Generated by SassMeister.com.

SassMeister-input.scss

// ----
// libsass (v3.2.5)
// ----

$o-grid-layouts: (
	S:  490px, 
	SM: 720px, 
	M:  730px, 
	L:  970px, 
	XL: 1210px,
	XXL: 1300px,
	XXXL: 1300px,
) !default;

/// Layout names
/// @type List
$_o-grid-layout-names: map-keys($o-grid-layouts) !default;

@function oGridGutter($layout-name: default) {
	@if map-has-key($o-grid-gutters, $layout-name) {
		@return map-get($o-grid-gutters, $layout-name);
	}

  $layout-index: index($_o-grid-layout-names, $layout-name);

  // The first layout (S) should get the default gutter
  @if $layout-index == 1 {
    @return oGridGutter();
  }

  $layout: nth($_o-grid-layout-names, $layout-index - 1);
	@return oGridGutter($layout);
}

/// Gutter sizes
///
/// @type Map
$o-grid-gutters: (
  default: 10px,
  M: 20px,
  XL: 30px
) !default;


/* Layouts: #{inspect($o-grid-layouts)} */
/* Gutters: #{inspect($o-grid-gutters)} */

test {
  default: oGridGutter(); // 10px
  S: oGridGutter(S); // 10px
  M: oGridGutter(M); // 20px
  L: oGridGutter(L); // 20px
  XXXL: oGridGutter(XXXL); // 30px
}

SassMeister-output.css

/* Layouts: (S: 490px, SM: 720px, M: 730px, L: 970px, XL: 1210px, XXL: 1300px, XXXL: 1300px) */
/* Gutters: (default: 10px, M: 20px, XL: 30px) */
test {
  default: 10px;
  S: 10px;
  M: 20px;
  L: 20px;
  XXXL: 30px;
}