Various Flexbox SASS Mixins

flexbox_mixins.scss

@mixin flex($flex-type: flex) {
  $flex-type: unquote($flex-type);
  @include experimental-value(display, $flex-type, not -moz, -webkit, not -o, -ms, not -khtml, official);
}

@mixin align-items($alignment) {
  $alignment: unquote($alignment);
  @include experimental(align-items, $alignment, not -moz, -webkit, not -o, -ms, not -khtml, official);
}

@mixin align-self($alignment) {
  $alignment: unquote($alignment);
  @include experimental(align-self, $alignment, not -moz, -webkit, not -o, -ms, not -khtml, official);
}

@mixin justify-content($alignment) {
  $alignment: unquote($alignment);
  @include experimental(justify-content, $alignment, not -moz, -webkit, not -o, -ms, not -khtml, official);
}

@mixin flex-direction($direction) {
  $direction: unquote($direction);
  @include experimental(flex-direction, $direction, not -moz, -webkit, not -o, -ms, not -khtml, official);
}

@mixin flex-wrap($wrap: wrap) {
  $wrap: unquote($wrap);
  @include experimental(flex-wrap, $wrap, not -moz, -webkit, not -o, -ms, not -khtml, official);
}

@mixin flex-grow($grow) {
  $grow: unquote($grow);
  @include experimental(flex-grow, $grow, not -moz, -webkit, not -o, -ms, not -khtml, official);
}

@mixin flex-shrink($shrink) {
  $shrink: unquote($shrink);
  @include experimental(flex-shrink, $shrink, not -moz, -webkit, not -o, -ms, not -khtml, official);
}

@mixin flex-basis($basis) {
  $basis: unquote($basis);
  @include experimental(flex-basis, $basis, not -moz, -webkit, not -o, -ms, not -khtml, official);
}