* Fix conflicts with WordPress.com toolbar

* Simplify selector

* Decrease z-index of header

* Remove unnecessary important
This commit is contained in:
Albert Juhé Lluveras 2019-06-14 17:48:28 +02:00 committed by GitHub
parent 4c62701b86
commit 15ecc94252
2 changed files with 24 additions and 77 deletions

View File

@ -12,7 +12,7 @@
position: fixed;
width: 100%;
top: $adminbar-height;
z-index: 99991; /* higher than component-popover (99990), lower than notification dropdown at 99999 */
z-index: 2; /* on top of components-popover */
&.is-scrolled {
box-shadow: 0 8px 8px 0 rgba(85, 93, 102, 0.3);

View File

@ -20,7 +20,9 @@
@include breakpoint( '<782px' ) {
// WP breakpoint for mobile menu
.wp-responsive-open #woocommerce-embedded-root,
.wp-responsive-open #wpbody {
position: relative;
right: -14.5em;
}
@ -64,95 +66,40 @@
display: none;
}
.woocommerce_page_wc-admin {
.wp-responsive-open {
.woocommerce-layout__header {
margin-left: 2px;
}
@include breakpoint( '<782px' ) {
.woocommerce-layout__activity-panel-wrapper.is-open,
.woocommerce-layout__activity-panel-tabs {
width: calc(100vw - 190px);
}
.components-popover:not(.is-mobile) {
z-index: 1; /* below of woocommerce-layout__header */
}
}
@include breakpoint( '<600px' ) {
#wpadminbar,
.jetpack-masterbar #wpadminbar {
#wpadminbar {
position: fixed;
}
}
#adminmenuwrap {
z-index: 99992;
}
// Temporary fix for compability with the Jetpack masterbar
// See https://github.com/Automattic/jetpack/issues/9608
// !important rules overwrite some existing !important rules
.jetpack-masterbar {
@include breakpoint( '<782px' ) {
&.wp-admin .wrap h1 {
.jetpack-masterbar {
#wpadminbar #wp-admin-bar-menu-toggle {
margin-top: -10px;
}
// #wpwrap id added for specificity
#wpwrap .woocommerce-layout__header-breadcrumbs {
padding-left: 60px;
}
&.wp-admin .wrap h1,
&.wp-admin .wrap h2 {
padding-left: 0;
}
#wpadminbar li.menupop.my-sites {
margin-left: 55px;
}
#wpadminbar #wp-admin-bar-menu-toggle {
top: -5px;
left: -5px;
width: 60px;
.ab-icon::before {
color: $white;
}
a {
padding: 0 8px 4px 8px !important;
}
a:hover {
background: #333;
}
}
.wp-responsive-open #wpadminbar #wp-admin-bar-menu-toggle {
left: -5px;
width: 60px;
.ab-icon::before {
color: $white !important;
}
a {
background: #333;
}
}
}
}
/* Hide wp-admin and WooCommerce elements when loading the WooCommerce Admin App */
.woocommerce-admin-is-loading {
#adminmenumain,
#wpadminbar,
.woocommerce-layout__header,
.update-nag,
.woocommerce-store-alerts,
.woocommerce-message,
.notice,
.error,
.updated {
display: none;
}
#wpcontent {
margin-left: 0;
}
#wpbody {
padding-top: 0;
}
}