Set minimum content height to prevent cutoff of absolute content (https://github.com/woocommerce/woocommerce-admin/pull/1166)

* Set minimum content height to prevent cutoff of absolute content

* Add admin bar height vars for SCSS and apply them
This commit is contained in:
Joshua T Flowers 2018-12-25 12:34:24 +08:00 committed by GitHub
parent 7cf9e293e1
commit 024d267ae6
3 changed files with 11 additions and 2 deletions

View File

@ -11,7 +11,7 @@
height: 80px;
position: fixed;
width: 100%;
top: 32px;
top: $adminbar-height;
z-index: 99991; /* higher than component-popover (99990), lower than notification dropdown at 99999 */
&.is-scrolled {
@ -19,7 +19,7 @@
}
@include breakpoint( '<782px' ) {
top: 46px;
top: $adminbar-height-mobile;
height: 50px;
flex-flow: row wrap;
}

View File

@ -23,3 +23,7 @@ $light-gray-500: $core-grey-light-500;
$dark-gray-300: $core-grey-dark-300;
$dark-gray-900: $core-grey-dark-900;
$alert-red: $error-red;
// WordPress defaults
$adminbar-height: 32px;
$adminbar-height-mobile: 46px;

View File

@ -9,6 +9,7 @@
#wpbody-content {
padding: 0;
overflow-x: hidden !important;
min-height: calc(100vh - #{$adminbar-height});
}
@include breakpoint( '<782px' ) {
@ -16,6 +17,10 @@
.wp-responsive-open #wpbody {
right: -14.5em;
}
#wpcontent,
#wpbody-content {
min-height: calc(100vh - #{$adminbar-height-mobile});
}
}
@include breakpoint( '>960px' ) {