@import compass/utilities

// Configure grid coordinates
$grid-columns: 12 !default
$grid-width: 60px !default
$grid-gutter-width: 20px !default
$overflow-allowed: false !default

=grid-coordinates
  .grid-container
    +grid-container
  .nested-grid-container
    +nested-grid-container
  .grid-block
    +grid-block
  @for $i from 1 through $grid-columns
    .grid-#{$i}
      +grid($i)
  .grid-full
    +grid-full
  @for $i from 1 through $grid-columns - 1
    .grid-prefix-#{$i}
      +grid-prefix($i)
  @for $i from 1 through $grid-columns - 1
    .grid-suffix-#{$i}
      +grid-suffix($i)

=grid-container
  margin: 0 auto
  @if $overflow-allowed
    +pie-clearfix
  @else
    +clearfix
  width: $grid-columns * $grid-width + $grid-columns * $grid-gutter-width

=nested-grid-container
  display: inline-block
  margin:
    left: -$grid-gutter-width / 2
    right: -$grid-gutter-width / 2
  @if $overflow-allowed
    +pie-clearfix
  @else
    +clearfix
  width: auto

=grid-block
  +float-left
  @if $overflow-allowed
    +pie-clearfix
  @else
    +clearfix
  margin: 0 $grid-gutter-width / 2

=grid($grid-columns)
  +grid-width($grid-columns)
  +grid-block

=grid-width($grid-columns)
  @if $grid-columns == 1
    width: $grid-width
  @else
    width: $grid-columns * $grid-width + $grid-columns * $grid-gutter-width - $grid-gutter-width

=grid-full
  +grid($grid-columns)

=grid-prefix($grid-columns)
  @if $grid-columns == 1
    padding-left: $grid-width + $grid-gutter-width
  @else
    padding-left: $grid-columns * $grid-width + $grid-columns * $grid-gutter-width

=grid-suffix($grid-columns)
  @if $grid-columns == 1
    padding-right: $grid-width + $grid-gutter-width
  @else
    padding-right: $grid-columns * $grid-width + $grid-columns * $grid-gutter-width