@import "compass/utilities";

// Configure grid coordinates
$grid-columns: 12 !default;
$grid-pixels: 60px !default;
$grid-gutter-width: 20px !default;

@mixin grid-coordinates {
  /* Grid-Coordinates by Adam Stacoviak
   * Fork me: http://adamstac.com/grid-coordinates */
  .grid-container {
    margin: 0 auto;
    overflow: hidden;
    width: $grid-columns * $grid-pixels + $grid-columns * $grid-gutter-width; }
  .nested-grid-container {
    display: inline-block;
    margin: {
      left: -$grid-gutter-width / 2;
      right: -$grid-gutter-width / 2; };
    overflow: hidden;
    width: auto; }
  @for $i from 1 through $grid-columns {
    .grid-#{$i} {
      @include grid($i); } }
  .grid-full {
    @include grid($grid-columns); }
  @for $i from 1 through $grid-columns - 1 {
    .grid-prefix-#{$i} {
      @include grid-prefix($i); } }
  @for $i from 1 through $grid-columns - 1 {
    .grid-suffix-#{$i} {
      @include grid-suffix($i); } } }

@mixin grid($grid-columns) {
  @include grid-width($grid-columns);
  @include float-left;
  margin: 0 $grid-gutter-width / 2;
  overflow: hidden; }

@mixin grid-width($grid-columns) {
  @if $grid-columns == 1 {
    width: $grid-pixels; }
  @else {
    width: $grid-columns * $grid-pixels + $grid-columns * $grid-gutter-width - $grid-gutter-width; } }

@mixin grid-prefix($grid-columns) {
  @if $grid-columns == 1 {
    padding-left: $grid-pixels + $grid-gutter-width; }
  @else {
    padding-left: $grid-columns * $grid-pixels + $grid-columns * $grid-gutter-width; } }

@mixin grid-suffix($grid-columns) {
  @if $grid-columns == 1 {
    padding-right: $grid-pixels + $grid-gutter-width; }
  @else {
    padding-right: $grid-columns * $grid-pixels + $grid-columns * $grid-gutter-width; } }