From: Matthijs Meulenbrug <mrm@users.noreply.github.com>
Date: Thu, 27 Aug 2020 08:02:12 +0000 (+0200)
Subject: Flexbox helpers (#3047)
X-Git-Tag: 0.9.1~19
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=3c4dd3a326bc55282b78c00203029377f5c0951f;p=thirdparty%2Fbulma.git

Flexbox helpers (#3047)

* Add flexbox helpers

* Add flex-{grow,shrink}: 0

* Order alphabetically

* Make classes shorter

* Rename to flexbox and used full attribute names
---

diff --git a/sass/helpers/_all.sass b/sass/helpers/_all.sass
index 638ad3045..b316ab4a0 100644
--- a/sass/helpers/_all.sass
+++ b/sass/helpers/_all.sass
@@ -2,6 +2,7 @@
 @charset "utf-8"
 
 @import "color.sass"
+@import "flexbox.sass"
 @import "float.sass"
 @import "other.sass"
 @import "overflow.sass"
diff --git a/sass/helpers/flexbox.sass b/sass/helpers/flexbox.sass
new file mode 100644
index 000000000..bf0d3050d
--- /dev/null
+++ b/sass/helpers/flexbox.sass
@@ -0,0 +1,35 @@
+$flex-directions-values: row, row-reverse, column, column-reverse
+@each $value in $flex-directions-values
+    .is-flex-direction-#{$value}
+        flex-direction: $value !important
+
+$flex-wrap-values: nowrap, wrap, wrap-reverse
+@each $value in $flex-wrap-values
+    .is-flex-wrap-#{$value}
+        flex-wrap: $value !important
+
+$justify-content-values: flex-start, flex-end, center, space-between, space-around, space-evenly, start, end, left, right
+@each $value in $justify-content-values
+    .is-justify-content-#{$value}
+        justify-content: $value !important
+
+$align-content-values: flex-start, flex-end, center, space-between, space-around, space-evenly, stretch, start, end, baseline
+@each $value in $align-content-values
+    .is-align-content-#{$value}
+        align-content: $value !important
+
+$align-items-values: stretch, flex-start, flex-end, center, baseline, start, end, self-start, self-end
+@each $value in $align-items-values
+    .is-align-items-#{$value}
+        align-items: $value !important
+
+$align-self-values: auto, flex-start, flex-end, center, baseline, stretch
+@each $value in $align-self-values
+    .is-align-self-#{$value}
+        align-self: $value !important
+
+$flex-operators: grow, shrink
+@each $operator in $flex-operators
+    @for $i from 0 through 5
+        .is-flex-#{$operator}-#{$i}
+            flex-#{$operator}: $i !important