mdbootstrap/mdb-ui-kit
1
1
Fork 0
mirror of https://github.com/mdbootstrap/mdb-ui-kit.git synced 2024-11-27 03:54:13 +03:00
Code Issues Packages Projects Releases Wiki Activity

#822 y overlay with a marker class (non-responsive) and responsive

Browse Source
This commit is contained in:
Kevin Ross 2016-01-15 16:30:10 -06:00
parent 59831c66f0
commit da8515583d
1 changed files with 35 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
scss/_drawer.scss
View File

@ -199,14 +199,24 @@
overflow: hidden; overflow: hidden;
} }
} }
//@mixin drawer-y-overlay($side) { @mixin drawer-y-overlay($side) {
// > .mdb-layout-header, > .mdb-layout-header,
// > .mdb-layout-content { > .mdb-layout-content {
// width: 100%; overflow: hidden;
// margin-#{$side}: 0; }
// overflow: hidden;
// } > .mdb-layout-header {
//} @if $side == top { // only add margin-top on a header when the drawer is at the top
margin-#{$side}: 0;
}
}
> .mdb-layout-content {
@if $side == bottom { // only add margin-bottom on content when the drawer is at the bottom
margin-#{$side}: 0;
}
}
}
&.mdb-drawer-overlay { &.mdb-drawer-overlay {
#{unquote($name)} { // mdb-drawer-overlay, mdb-drawer-overlay-sm, mdb-drawer-overlay-md, mdb-drawer-overlay-lg #{unquote($name)} { // mdb-drawer-overlay, mdb-drawer-overlay-sm, mdb-drawer-overlay-md, mdb-drawer-overlay-lg
@ -231,23 +241,23 @@
} }
//// y - top/bottom //// y - top/bottom
//@each $side in (top bottom) { @each $side in (top bottom) {
// &.mdb-drawer-fixed-#{$side} { &.mdb-drawer-fixed-#{$side} {
//
// @if $breakpoint == xs { // overlay marker class (non-responsive) @if $breakpoint == xs { // overlay marker class (non-responsive)
//
// // Must double up on the .mdb-drawer-overlay class to increase specificity otherwise the // Must double up on the .mdb-drawer-overlay class to increase specificity otherwise the
// // responsive mdb-drawer-open-* media queries above win (and overlay is ignored) // responsive mdb-drawer-open-* media queries above win (and overlay is ignored)
// &.mdb-drawer-overlay { &.mdb-drawer-overlay {
// @include drawer-y-overlay($side) @include drawer-y-overlay($side)
// } }
// } @else { } @else {
// @include media-breakpoint-down($breakpoint) { // overlay responsive class @include media-breakpoint-down($breakpoint) { // overlay responsive class
// @include drawer-y-overlay($side) @include drawer-y-overlay($side)
// } }
// } }
// } }
//} }
} }
} }
} }