0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-29 11:24:18 +01:00
Bootstrap/scss/utilities/_display.scss
Mark Otto ffaad0a819 Responsive display utilities (#20934)
* Explore responsive display utils, but with a twist: lowest breakpoint has no breakpoint modifier in the class name
* make floats use the same format, add float-none mixin
2016-10-31 21:27:56 -07:00

31 lines
1.0 KiB
SCSS

//
// Display utilities
//
@each $breakpoint in map-keys($grid-breakpoints) {
@include media-breakpoint-up($breakpoint) {
$min: breakpoint-min($breakpoint, $grid-breakpoints);
@if $min {
@media (min-width: $min) {
.d-#{$breakpoint}-none { display: none !important; }
.d-#{$breakpoint}-inline { display: inline !important; }
.d-#{$breakpoint}-inline-block { display: inline-block !important; }
.d-#{$breakpoint}-block { display: block !important; }
.d-#{$breakpoint}-table { display: table !important; }
.d-#{$breakpoint}-table-cell { display: table-cell !important; }
.d-#{$breakpoint}-flex { display: flex !important; }
}
} @else {
.d-none { display: none !important; }
.d-inline { display: inline !important; }
.d-inline-block { display: inline-block !important; }
.d-block { display: block !important; }
.d-table { display: table !important; }
.d-table-cell { display: table-cell !important; }
.d-flex { display: flex !important; }
}
}
}