_grid.scss

// ---------------------------------------------------------------------------
// Imports

@import "compass/utilities/general/clearfix";

// ---------------------------------------------------------------------------
// Container

// Set the width of a container
@mixin set-container-width(){
  $width: if($container-width, $container-width, columns-width());

  @if $container-style == 'static' {
    width: $width;
  } @else {
    @if $container-style == 'fluid' {
      width: if(unit($width) == '%', $width, auto);
    } @else {
      max-width: $width;
      @if $legacy-support-for-ie6 {
        _width: $width;
      }
    }
  }
}

// Set the outer grid-containing element(s).
@mixin apply-container(){
  @include pie-clearfix;
  @include set-container-width;
  margin: { left: auto; right: auto; }
  padding: { left: $grid-padding; right: $grid-padding; }
}

// Set one or more layouts on a grid-containing element at any number of media-query breakpoints.
//
// $media-layout-1        : [default:$total-columns] A list of values including -
//                        : One unitless number (representing columns in a layout)
//                        : Two optional lengths (representing min and max-width media-query breakpoints).
// $media-layout-2 ...-10 : [optional] Same as $media-layout-1
@mixin container(
  $media-layout-1   : $total-columns,
  $media-layout-2   : false,
  $media-layout-3   : false,
  $media-layout-4   : false,
  $media-layout-5   : false,
  $media-layout-6   : false,
  $media-layout-7   : false,
  $media-layout-8   : false,
  $media-layout-9   : false,
  $media-layout-10  : false
){
  $media-layouts    : compact($media-layout-2,$media-layout-3,$media-layout-4,$media-layout-5,$media-layout-6,$media-layout-7,$media-layout-8,$media-layout-9,$media-layout-10);

  @if is-default-layout($media-layout-1) {
    @include apply-container();
  } @else {
    @include at-breakpoint($media-layout-1) {
      @include apply-container();
    }
  }

  @each $ml in $media-layouts {
    @if $ml {
      @include at-breakpoint($ml) {
        @include set-container-width;
      }
    }
  }
}

// ---------------------------------------------------------------------------
// Columns

// Create a grid element spanning any number of 'columns' in a grid 'context'.
// $columns : The number of columns to span.
// $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)
@mixin span-columns(
  $columns,
  $context  : $total-columns,
  $from     : $from-direction
) {
  $to       : opposite-position($from);
  $pos      : split-columns-value($columns,position);
  $cols     : split-columns-value($columns,columns);
  
  width: columns($cols, $context);

  @if ($pos == 'omega') {
    @include omega($from);
  } @else {  
    float: $from;
    margin-#{$to}: gutter($context);      
    @if $legacy-support-for-ie6 {
      display: inline;
    }
  }
}

// Apply to elements spanning the last column, to account for the page edge.
// Only needed as an override. Normally 'omega' can just be called by `columns`.
//
// $from    : The start-direction for your document.
@mixin omega(
  $from     : $from-direction
) {
  $to     : opposite-position($from);
  $hack   : opposite-position($omega-float);
  
  float: $omega-float;
  margin-#{$to}: 0;

  @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
    #margin-#{$hack}: - $gutter-width;
    @if $legacy-support-for-ie6 { display: inline; }
  }
}

// ---------------------------------------------------------------------------
// Reset Columns

// Reset a '+columns' grid element to default block behavior
//
// $from  : The start direction of your layout (e.g. 'left' for ltr languages)
@mixin reset-columns(
  $from: $from-direction
) {
  $to     : opposite-position($from);
  $hack   : opposite-position($omega-float);

  float: none;
  width: auto;
  margin-#{$to}: auto;
  
  @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
    #margin-#{$hack}: auto;
    @if $legacy-support-for-ie6 { display: block; }
  }
}