rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-17 09:52:29 +01:00
Code Issues Actions Packages Releases Activity

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

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
scss/_utilities.scss
View File

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

36
scss/utilities/_flex.scss
View File

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