$basic-settings: true;

$add-grid: 3, 5 at 500px, 1 3 5 7 at 700px;
$add-gutter: .25, .35 at 500px, .55 at 700px;
$add-gutter-style: 'split', 'split fixed' at 500px, 'opposite fixed' at 700px;

@import "../shared";

@mixin span-stuff($func) {
  $name: "#{$func}-span";

  $grid: find-grid();
  $column-count: column-count($grid);

  _grid: $grid;
  _#{$func}-start: "#{$name}(1, 1)";
  _#{$func}-start: call($name, 1, 1);
  _#{$func}-end: "#{$name}(1, #{$column-count})";
  _#{$func}-end: call($name, 1, $column-count);
  _#{$func}-multiple: "#{$name}(2, 1)";
  _#{$func}-multiple: call($name, 2, 1);

  @each $bkpt in $bkpts {
    @include breakpoint($bkpt) {
      $grid: find-grid();
      $column-count: column-count($grid);

      _grid: $grid;
      _#{$func}-start: "#{$name}(1, 1)";
      _#{$func}-start: call($name, 1, 1);
      _#{$func}-end: "#{$name}(1, #{$column-count})";
      _#{$func}-end: call($name, 1, $column-count);
      _#{$func}-multiple: "#{$name}(2, 2)";
      _#{$func}-multiple: call($name, 2, 2);
    }
  }
}

/**
  * Returns the percentage of columns plus inner gutters (if any)
**/
.column-span {
  @include span-stuff('column');
}

/**
  * Returns the percentage of a single gutter
**/
.gutter-span {
  @include span-stuff('gutter');
}

/**
  * Returns the percentage of columns plus inner gutters (if any) plus one additional gutter (if not the last item)
**/
.grid-span {
  @include span-stuff('grid');
}