mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-14 11:14:24 +00:00
Flexbox helpers (#3047)
* Add flexbox helpers * Add flex-{grow,shrink}: 0 * Order alphabetically * Make classes shorter * Rename to flexbox and used full attribute names
This commit is contained in:
parent
da369e134c
commit
3c4dd3a326
@ -2,6 +2,7 @@
|
||||
@charset "utf-8"
|
||||
|
||||
@import "color.sass"
|
||||
@import "flexbox.sass"
|
||||
@import "float.sass"
|
||||
@import "other.sass"
|
||||
@import "overflow.sass"
|
||||
|
35
sass/helpers/flexbox.sass
Normal file
35
sass/helpers/flexbox.sass
Normal file
@ -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
|
Loading…
Reference in New Issue
Block a user