@import "compass/layout/grid-background";
@import "grid", "typography";

// Shows a background that can be used to check grid alignment.
// By default this is a pure css version that only works in browsers
// that support gradients and multiple backgrounds, but you can pass
// an image url if you prefer.
@mixin showgrid($image: false) {
  @if $image {
    background: image-url($image);
  }
  @else {
    @include grid-background(
      $total    : $blueprint-grid-columns,
      $column   : $blueprint-grid-width,
      $gutter   : $blueprint-grid-margin,
      $baseline : $blueprint-font-size * 1.5
    );
  }
}

@mixin blueprint-debug($grid-image: false) {
  // Use this class on any column or container to see the grid.
  // TODO: prefix this with the project path.
  .showgrid {
    @include showgrid($grid-image);
  }
}