/**
* Flexlay Parent Layout
*
* https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction
*/

@import '../variables';

/** Given a breakpoint name, generate parent layout selectors */
@mixin flex-layouts($break: null) {
  $suffix: if($break, '-#{$break}', '');
  $prop: '#{$lib-prefix}layout#{$suffix}';

  [#{$prop}], [#{$prop}="row"], [#{$prop}="column"] {
    box-sizing: border-box;
    display: flex;
  }

  [#{$prop}="row"] {
    flex-direction: row;
  }

  [#{$prop}="column"] {
    flex-direction: column;

    /* IE10-IE11 column-flex bug fix (set proper default value) */
    & > [#{$lib-prefix}flex] {
      -ms-flex-basis: auto;
      flex-basis: auto;
    }
  }
}