_vars.scss

// Must be added to html tag either manaully or feature detect eg modernizr
$default-text-align: left !default;

$starting-columns: 1 !default;
$total-columns: 12 !default;

$column-gutter: 15px !default;
$auto-column-gutters: false !default;
$grid-padding-name: 'pad' !default;
$independant-grid-name: '' !default;

// Use to namespace the whole grid-system. eg 'wtf-' or 'cool-'
$global-name-space: '' !default;
$container-name: 'container' !default; // Could be wrapper
$grid-name: 'grid-' !default; // Could be col or column
$base-grid-name: '' !default; // Does your base grid have a sufix.
$row-name: 'row' !default; // Could be flex
$disable-push-pull-classes: false !default;
$right-name: 'right' !default; // Could be push
$left-name: 'left' !default; // Could be push

// Set to true to always set column index after grid name eg. grid-1-md instead of grid-md-1
$column-index-always-before-size: false !default;

// Loop over these breakpoints and pass keys into grid classes
$breakpoints: (
  'small': 480px,
  'medium': 768px,
  'large': 1024px,
  'xlarge': 1180px
) !default;

$break-dir: '>=' !default;

$smallest-size: nth(map-values($breakpoints), 1);
$last-breakpoint: nth(map-values($breakpoints), length($breakpoints));

$container-breakpoint: $last-breakpoint !default;
$column-gutter-breakpoint: $smallest-size !default;

$enable-extra-grid: false !default;
$extra-grid-name: 'fifth' !default;
$extra-columns: 5 !default;

$grid-framework: '' !default;

@if $grid-framework == 'bootstrap' {
  $grid-name: 'col-';
  $base-grid-name: 'xs';
  $column-gutter: 15px;
  $auto-column-gutters: true;
  $right-name: 'push';
  $left-name: 'pull';
  $breakpoints: (
    'sm': 480px,
    'md': 768px,
    'lg': 1024px,
    'xl': 1180px
  );

}

@if $grid-framework == 'foundation' {
  $column-gutter: 0.9375rem;
  $auto-column-gutters: false;
  $independant-grid-name: 'column';
  $grid-name: '';
  $base-grid-name: 'small';
  $breakpoints: (
    'medium': 768px,
    'large': 1024px
  );
}