@if compass-env() == 'development' {/*!
 * Gernerated- & Helper-classes for a column based grid
 *
 * @package #{$package_name()}
 * @path Objects/_Grid.scss
 */}


// =============================================================================
// $ Variables
// =============================================================================
$grid-direction:  $start;


/* =============================================================================
$ Grid Classes
================================================================================
 * A basic grid system wich is dependent on the border-box layout mode
 * e.g.
 *
  <div class="grid">
    <div class="gi one-third"> </div>
    <div class="gi one-third"> </div>
    <div class="gi one-third"> </div>
  </div>
================================================================================ */
.g,
.grid {
  @extend .cf;
  margin-left: -($column-gutter / 2);
  margin-right: -($column-gutter / 2);
}
.gi,
.grid__item {
  // Base styles for .gi--# classes
  float: $grid-direction;
  padding-left: ($column-gutter / 2);
  padding-right: ($column-gutter / 2);
}
@if compass-env() == 'development' {/*!
 * Gernerated- & Helper-classes for a column based grid
 *
 * @package #{$package_name()}
 * @path Objects/_Grid.scss
 */}


// =============================================================================
// $ Variables
// =============================================================================
$grid-direction:  $start;


/* =============================================================================
$ Grid Classes
================================================================================
 * A basic grid system wich is dependent on the border-box layout mode
 * e.g.
 *
  <div class="g">
    <div class="gi one-third"> </div>
    <div class="gi one-third"> </div>
    <div class="gi one-third"> </div>
  </div>
================================================================================ */
.g,
.grid {
  @extend .cf;
  margin-left: -($column-gutter / 2);
  margin-right: -($column-gutter / 2);
}
.gi,
.grid__item {
  // Base styles for .gi--# classes
  float: $grid-direction;
  padding-left: ($column-gutter / 2);
  padding-right: ($column-gutter / 2);
}
Use the grid shortcut instead of the full name of the class
[DOCS] Use the grid shortcut instead of the full name of the class
