/* `justify-content`
   ========================================================================== */

/**
 * Note: work is derived from https://github.com/mastastealth/sass-flex-mixin
 *
 * The 'justify-content' property aligns flex items along the main axis
 * of the current line of the flex container. This is done after any flexible
 * lengths and any auto margins have been resolved. Typically it helps distribute
 * extra free space leftover when either all the flex items on a line are
 * inflexible, or are flexible but have reached their maximum size. It also
 * exerts some control over the alignment of items when they overflow the line.
 *
 * http://w3.org/tr/css3-flexbox/#justify-content-property
 *
 * Values: flex-start | flex-end | center | space-between | space-around
 * Default: flex-start
 *
 * Example usage:
 * `@include flex-justify-content(flex-start);`
 * `@include flex-justify-content(flex-start, !important);`
 */

@mixin flex-justify-content($value: flex-start, $important: null) {
  
  @if $value == flex-start {
    -webkit-box-pack: start $important;
    -ms-flex-pack: start $important;
    -webkit-justify-content: $value $important;
    -moz-justify-content: $value $important;
    justify-content: $value $important;
  }
  @else if $value == flex-end {
    -webkit-box-pack: end $important;
    -ms-flex-pack: end $important;
    -webkit-justify-content: $value $important;
    -moz-justify-content: $value $important;
    justify-content: $value $important;
  }
  @else if $value == space-between {
    -webkit-box-pack: justify $important;
    -ms-flex-pack: justify $important;
    -webkit-justify-content: $value $important;
    -moz-justify-content: $value $important;
    justify-content: $value $important;
  }
  @else if $value == space-around {
    -ms-flex-pack: distribute $important;
    -webkit-justify-content: $value $important;
    -moz-justify-content: $value $important;
    justify-content: $value $important;
  }
  @else {
    -webkit-box-pack: $value $important;
    -ms-flex-pack: $value $important;
    -webkit-justify-content: $value $important;
    -moz-justify-content: $value $important;
    justify-content: $value $important;
  }
    
}


/* Utility classes
   ========================================================================== */

@if $u-classes-flex-justify-content == true {

  $flex-justify-content-values:
    center
    flex-end
    flex-start
    space-around
    space-between;

  @each $flex-justify-content-value in $flex-justify-content-values {
  
    .u-flex-justify-content--#{$flex-justify-content-value} {
      @include flex-justify-content(#{$flex-justify-content-value}, !important);
    }
  
  }

}