From 7b7cf221cd1e0a1e07889a5e766de19466445a32 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 6 Feb 2016 01:29:51 -0800 Subject: [PATCH] Move the conditional statement back to the file because nested imports aren't supported in Sass --- scss/_utilities.scss | 5 +---- scss/utilities/_flex.scss | 36 +++++++++++++++++++----------------- 2 files changed, 20 insertions(+), 21 deletions(-) diff --git a/scss/_utilities.scss b/scss/_utilities.scss index 24d6868a50..ac703bc467 100644 --- a/scss/_utilities.scss +++ b/scss/_utilities.scss @@ -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"; diff --git a/scss/utilities/_flex.scss b/scss/utilities/_flex.scss index cd8476bdb3..1676806b8f 100644 --- a/scss/utilities/_flex.scss +++ b/scss/utilities/_flex.scss @@ -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; } + } } } -- 2.47.2