_padding.scss

// ---------------------------------------------------------------------------
// Padding Mixins

// add empty colums as padding before an element.
// $columns : The number of columns to prefix.
// $context : [optional] The context (columns spanned by parent).
//          : Context is required on any nested elements.
//          : Context MUST NOT be declared on a root element.
// $from    : The start direction of your layout (e.g. 'left' for ltr languages)
// $style   : The container style to use.
@mixin prefix(
  $columns,
  $context  : $total-columns,
  $from     : $from-direction,
  $style    : $container-style
) {
  $from           : unquote($from);
  padding-#{$from}: space($columns, $context, $style);
}

// add empty colums as padding after an element.
// $columns : The number of columns to suffix.
// $context : [optional] The context (columns spanned by parent).
//          : Context is required on any nested elements.
//          : Context MUST NOT be declared on a root element.
// $from    : The start direction of your layout (e.g. 'left' for ltr languages)
// $style   : The container style to use.
@mixin suffix(
  $columns,
  $context  : $total-columns,
  $from     : $from-direction,
  $style    : $container-style
) {
  $from         : unquote($from);
  $to           : opposite-position($from);
  padding-#{$to}: space($columns, $context, $style);
}

// add empty colums as padding before and after an element.
// $columns : The number of columns to pad.
// $context : [optional] The context (columns spanned by parent).
//          : Context is required on any nested elements.
//          : Context MUST NOT be declared on a root element.
// $from    : The start direction of your layout (e.g. 'left' for ltr languages)
// $style   : The container style to use.
@mixin pad(
  $prefix   : false,
  $suffix   : false,
  $context  : $total-columns,
  $from     : $from-direction,
  $style    : $container-style
) {
  $from     : unquote($from);
  @if $prefix {
    @include prefix($prefix, $context, $from, $style);
  }
  @if $suffix {
    @include suffix($suffix, $context, $from, $style);
  }
}

// Bleed into colums with margin/padding on any side of an element.
// $width   : The side of the bleed.
//          : Any unit-length will be used directly.
//          : Any unitless number will be used as a column-count.
//          : Use "2 of 6" format to represent 2 cals in a 6-col nested context.
// $sides   : One or more sides to bleed [ top | right | bottom | left | all ].
// $style   : The container style to use.
@mixin bleed(
  $width: $grid-padding,
  $sides: left right,
  $style: $container-style
) {
  @if $border-box-sizing { @include box-sizing(content-box) }

  @if type-of($width) == 'list' {
    $width: filter($width, of);
    $width: space(nth($width,1), nth($width,2), $style);
  } @else if unitless($width) {
    $width: space($width, $style: $style);
  }

  @if $sides == 'all' {
    margin: - $width;
    padding: $width;
  } @else {
    @each $side in $sides {
      margin-#{$side}: - $width;
      padding-#{$side}: $width;
    }
  }
}