flexbox.sass 1.3 KB

1234567891011121314151617181920212223242526272829303132333435
  1. $flex-direction-values: row, row-reverse, column, column-reverse
  2. @each $value in $flex-direction-values
  3. .is-flex-direction-#{$value}
  4. flex-direction: $value !important
  5. $flex-wrap-values: nowrap, wrap, wrap-reverse
  6. @each $value in $flex-wrap-values
  7. .is-flex-wrap-#{$value}
  8. flex-wrap: $value !important
  9. $justify-content-values: flex-start, flex-end, center, space-between, space-around, space-evenly, start, end, left, right
  10. @each $value in $justify-content-values
  11. .is-justify-content-#{$value}
  12. justify-content: $value !important
  13. $align-content-values: flex-start, flex-end, center, space-between, space-around, space-evenly, stretch, start, end, baseline
  14. @each $value in $align-content-values
  15. .is-align-content-#{$value}
  16. align-content: $value !important
  17. $align-items-values: stretch, flex-start, flex-end, center, baseline, start, end, self-start, self-end
  18. @each $value in $align-items-values
  19. .is-align-items-#{$value}
  20. align-items: $value !important
  21. $align-self-values: auto, flex-start, flex-end, center, baseline, stretch
  22. @each $value in $align-self-values
  23. .is-align-self-#{$value}
  24. align-self: $value !important
  25. $flex-operators: grow, shrink
  26. @each $operator in $flex-operators
  27. @for $i from 0 through 5
  28. .is-flex-#{$operator}-#{$i}
  29. flex-#{$operator}: $i !important