Sha256: 5556d1d7bfa0294dd00e7069a3ed3afed0f97af5d91cffe69349a8e84b5a584c

Contents?: true

Size: 1.13 KB

Versions: 84

Compression:

Stored size: 1.13 KB

Contents

// 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.
@mixin grid-layout(
  $n,
  $selector: '.column'
) {
  & > #{$selector} {
    width: percentage(1/$n);
    float: $global-left;

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

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

    &:last-child {
      float: 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%;
      }
    }
  }
}

Version data entries

84 entries across 84 versions & 4 rubygems

Version Path
foundation-rails-6.2.3.0 vendor/assets/scss/grid/_layout.scss
foundation-rails-6.2.1.0 vendor/assets/scss/grid/_layout.scss
foundation-rails-6.2.0.1 vendor/assets/scss/grid/_layout.scss
foundation-rails-6.2.0.0 vendor/assets/scss/grid/_layout.scss