0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-17 09:52:29 +01:00

Move the conditional statement back to the file because nested imports aren't supported in Sass

This commit is contained in:
Mark Otto 2016-02-06 01:29:51 -08:00
parent 0de7321bbb
commit 7b7cf221cd
2 changed files with 20 additions and 21 deletions

View File

@ -6,7 +6,4 @@
@import "utilities/spacing"; @import "utilities/spacing";
@import "utilities/text"; @import "utilities/text";
@import "utilities/visibility"; @import "utilities/visibility";
@import "utilities/flex";
@if $enable-flex and $enable-grid-classes {
@import "utilities/flex";
}

View File

@ -2,24 +2,26 @@
// //
// Custom styles for additional flex alignment options. // Custom styles for additional flex alignment options.
@each $breakpoint in map-keys($grid-breakpoints) { @if $enable-flex and $enable-grid-classes {
// Flex column reordering @each $breakpoint in map-keys($grid-breakpoints) {
@include media-breakpoint-up($breakpoint) { // Flex column reordering
.flex-#{$breakpoint}-first { order: -1; } @include media-breakpoint-up($breakpoint) {
.flex-#{$breakpoint}-last { order: 1; } .flex-#{$breakpoint}-first { order: -1; }
} .flex-#{$breakpoint}-last { order: 1; }
}
// Alignment for every column in row // Alignment for every column in row
@include media-breakpoint-up($breakpoint) { @include media-breakpoint-up($breakpoint) {
.flex-items-#{$breakpoint}-top { align-items: flex-start; } .flex-items-#{$breakpoint}-top { align-items: flex-start; }
.flex-items-#{$breakpoint}-center { align-items: center; } .flex-items-#{$breakpoint}-center { align-items: center; }
.flex-items-#{$breakpoint}-bottom { align-items: flex-end; } .flex-items-#{$breakpoint}-bottom { align-items: flex-end; }
} }
// Alignment per column // Alignment per column
@include media-breakpoint-up($breakpoint) { @include media-breakpoint-up($breakpoint) {
.flex-#{$breakpoint}-top { align-self: flex-start; } .flex-#{$breakpoint}-top { align-self: flex-start; }
.flex-#{$breakpoint}-center { align-self: center; } .flex-#{$breakpoint}-center { align-self: center; }
.flex-#{$breakpoint}-bottom { align-self: flex-end; } .flex-#{$breakpoint}-bottom { align-self: flex-end; }
}
} }
} }