// Foundation for Sites by ZURB // foundation.zurb.com // Licensed under MIT Open Source

//// /// @group grid ////

/// Sizes child elements so that ‘$n` number of items appear on each row. /// /// @param {Number} $n - Number of elements to display per row. /// @param {String} $selector [’.column’] - Selector(s) to use for child elements. /// @param {Number|List} $gutter /// The gutter to apply to child elements. Accepts multiple values: /// - $grid-column-gutter will use the values in the $grid-column-gutter map, including breakpoint sizes. /// - A fixed numeric value will apply this gutter to all breakpoints. @mixin grid-layout(

$n,
$selector: '.column',
$gutter: null

) {

& > #{$selector} {
  float: $global-left;
  width: percentage(1/$n);

  // If a $gutter value is passed
  @if($gutter) {
    // Gutters
    @if type-of($gutter) == 'map' {
      @each $breakpoint, $value in $gutter {
        $padding: rem-calc($value) / 2;

        @include breakpoint($breakpoint) {
          padding-right: $padding;
          padding-left: $padding;
        }
      }
    }
    @else if type-of($gutter) == 'number' and strip-unit($gutter) > 0 {
      $padding: rem-calc($gutter) / 2;
      padding-right: $padding;
      padding-left: $padding;
    }
  }

  &:nth-of-type(1n) {
    clear: none;
  }

  &:nth-of-type(#{$n}n+1) {
    clear: both;
  }

  &:last-child {
    float: $global-left;
  }
}

}

/// Adds extra CSS to block grid children so the last items in the row center automatically. Apply this to the columns, not the row. /// /// @param {Number} $n - Number of items that appear in each row. @mixin grid-layout-center-last($n) {

@for $i from 1 to $n {
  @if $i == 1 {
    &:nth-child(#{$n}n+1):last-child {
      margin-left: (100 - 100/$n * $i) / 2 * 1%;
    }
  }
  @else {
    &:nth-child(#{$n}n+1):nth-last-child(#{$i}) {
      margin-left: (100 - 100/$n * $i) / 2 * 1%;
    }
  }
}

}