|
|
|
|
@import '../../abstracts/variables';
|
|
|
|
|
|
|
|
|
|
@mixin display-mixin ($breakpoint) {
|
|
|
|
|
.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-row {
|
|
|
|
|
display: table-row !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.d-#{$breakpoint}table-cell {
|
|
|
|
|
display: table-cell !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.d-#{$breakpoint}flex {
|
|
|
|
|
display: flex !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.d-#{$breakpoint}inline-flex {
|
|
|
|
|
display: inline-flex !important;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// XS >
|
|
|
|
|
@include display-mixin("");
|
|
|
|
|
|
|
|
|
|
@media (min-width:$breakpoint-sm) {
|
|
|
|
|
@include display-mixin("sm-");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@media (min-width:$breakpoint-md) {
|
|
|
|
|
@include display-mixin("md-");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@media (min-width:$breakpoint-lg) {
|
|
|
|
|
@include display-mixin("lg-");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@media (min-width:$breakpoint-xl) {
|
|
|
|
|
@include display-mixin("xl-");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@media (min-width:$breakpoint-xxl) {
|
|
|
|
|
@include display-mixin("xxl-");
|
|
|
|
|
}
|