minimal-mistakes-jekyll 4.4.1 → 4.4.2

data/_sass/minimal-mistakes/vendor/magnific-popup/_settings.scss

@@ -1,46 +1,46 @@
-////////////////////////
-//      Settings      //
-////////////////////////
-
-// overlay
-$mfp-overlay-color:                   #000;                     // Color of overlay screen
-$mfp-overlay-opacity:                 0.8;                        // Opacity of overlay screen
-$mfp-shadow:                          0 0 8px rgba(0, 0, 0, 0.6); // Shadow on image or iframe
-
-// spacing
-$mfp-popup-padding-left:              8px;                        // Padding from left and from right side
-$mfp-popup-padding-left-mobile:       6px;                        // Same as above, but is applied when width of window is less than 800px
-
-$mfp-z-index-base:                    1040;                       // Base z-index of popup
-
-// controls
-$mfp-include-arrows:                  true;                       // Include styles for nav arrows
-$mfp-controls-opacity:                1;                          // Opacity of controls
-$mfp-controls-color:                  #fff;                     // Color of controls
-$mfp-controls-border-color:           #fff;                     // Border color of controls
-$mfp-inner-close-icon-color:          #fff;                     // Color of close button when inside
-$mfp-controls-text-color:             #ccc;                       // Color of preloader and "1 of X" indicator
-$mfp-controls-text-color-hover:       #fff;                     // Hover color of preloader and "1 of X" indicator
-$mfp-IE7support:                      true;                       // Very basic IE7 support
-
-// Iframe-type options
-$mfp-include-iframe-type:             true;                       // Enable Iframe-type popups
-$mfp-iframe-padding-top:              40px;                       // Iframe padding top
-$mfp-iframe-background:               #000;                       // Background color of iframes
-$mfp-iframe-max-width:                900px;                      // Maximum width of iframes
-$mfp-iframe-ratio:                    9/16;                       // Ratio of iframe (9/16 = widescreen, 3/4 = standard, etc.)
-
-// Image-type options
-$mfp-include-image-type:              true;                       // Enable Image-type popups
-$mfp-image-background:                #444 !default;
-$mfp-image-padding-top:               40px;                       // Image padding top
-$mfp-image-padding-bottom:            40px;                       // Image padding bottom
-$mfp-include-mobile-layout-for-image: true;                       // Removes paddings from top and bottom
-
-// Image caption options
-$mfp-caption-title-color:             #f3f3f3;                    // Caption title color
-$mfp-caption-subtitle-color:          #bdbdbd;                    // Caption subtitle color
-.mfp-counter { font-family: $serif; }                          // Caption font family
-
-// A11y
+////////////////////////
+//      Settings      //
+////////////////////////
+
+// overlay
+$mfp-overlay-color:                   #000;                     // Color of overlay screen
+$mfp-overlay-opacity:                 0.8;                        // Opacity of overlay screen
+$mfp-shadow:                          0 0 8px rgba(0, 0, 0, 0.6); // Shadow on image or iframe
+
+// spacing
+$mfp-popup-padding-left:              8px;                        // Padding from left and from right side
+$mfp-popup-padding-left-mobile:       6px;                        // Same as above, but is applied when width of window is less than 800px
+
+$mfp-z-index-base:                    1040;                       // Base z-index of popup
+
+// controls
+$mfp-include-arrows:                  true;                       // Include styles for nav arrows
+$mfp-controls-opacity:                1;                          // Opacity of controls
+$mfp-controls-color:                  #fff;                     // Color of controls
+$mfp-controls-border-color:           #fff;                     // Border color of controls
+$mfp-inner-close-icon-color:          #fff;                     // Color of close button when inside
+$mfp-controls-text-color:             #ccc;                       // Color of preloader and "1 of X" indicator
+$mfp-controls-text-color-hover:       #fff;                     // Hover color of preloader and "1 of X" indicator
+$mfp-IE7support:                      true;                       // Very basic IE7 support
+
+// Iframe-type options
+$mfp-include-iframe-type:             true;                       // Enable Iframe-type popups
+$mfp-iframe-padding-top:              40px;                       // Iframe padding top
+$mfp-iframe-background:               #000;                       // Background color of iframes
+$mfp-iframe-max-width:                900px;                      // Maximum width of iframes
+$mfp-iframe-ratio:                    9/16;                       // Ratio of iframe (9/16 = widescreen, 3/4 = standard, etc.)
+
+// Image-type options
+$mfp-include-image-type:              true;                       // Enable Image-type popups
+$mfp-image-background:                #444 !default;
+$mfp-image-padding-top:               40px;                       // Image padding top
+$mfp-image-padding-bottom:            40px;                       // Image padding bottom
+$mfp-include-mobile-layout-for-image: true;                       // Removes paddings from top and bottom
+
+// Image caption options
+$mfp-caption-title-color:             #f3f3f3;                    // Caption title color
+$mfp-caption-subtitle-color:          #bdbdbd;                    // Caption subtitle color
+.mfp-counter { font-family: $serif; }                          // Caption font family
+
+// A11y
 $mfp-use-visuallyhidden:              false;

data/_sass/minimal-mistakes/vendor/susy/_su.scss

@@ -1,4 +1,4 @@
-// Su
-// ==
-
-@import 'susy/su';
+// Su
+// ==
+
+@import 'susy/su';

data/_sass/minimal-mistakes/vendor/susy/_susy.scss

@@ -1,4 +1,4 @@
-// Susy
-// ====
-
-@import 'susy/language/susy';
+// Susy
+// ====
+
+@import 'susy/language/susy';

data/_sass/minimal-mistakes/vendor/susy/_susyone.scss

@@ -1,4 +1,4 @@
-// Susy
-// ====
-
-@import 'susy/language/susyone';
+// Susy
+// ====
+
+@import 'susy/language/susyone';

data/_sass/minimal-mistakes/vendor/susy/susy/_su.scss

@@ -1,7 +1,7 @@
-// Su
-// ==
-
-@import "su/utilities";
-@import "su/settings";
-@import "su/validation";
-@import "su/grid";
+// Su
+// ==
+
+@import "su/utilities";
+@import "su/settings";
+@import "su/validation";
+@import "su/grid";

data/_sass/minimal-mistakes/vendor/susy/susy/language/_susy.scss

@@ -1,24 +1,24 @@
-// Susy Next Syntax
-// ================
-
-$susy-version: 2.1;
-
-@import "../su";
-@import "../output/float";
-
-@import "susy/settings";
-@import "susy/validation";
-@import "susy/grids";
-@import "susy/box-sizing";
-@import "susy/context";
-@import "susy/background";
-@import "susy/container";
-@import "susy/span";
-@import "susy/gutters";
-@import "susy/isolate";
-@import "susy/gallery";
-@import "susy/rows";
-@import "susy/margins";
-@import "susy/padding";
-@import "susy/bleed";
-@import "susy/breakpoint-plugin";
+// Susy Next Syntax
+// ================
+
+$susy-version: 2.1;
+
+@import "../su";
+@import "../output/float";
+
+@import "susy/settings";
+@import "susy/validation";
+@import "susy/grids";
+@import "susy/box-sizing";
+@import "susy/context";
+@import "susy/background";
+@import "susy/container";
+@import "susy/span";
+@import "susy/gutters";
+@import "susy/isolate";
+@import "susy/gallery";
+@import "susy/rows";
+@import "susy/margins";
+@import "susy/padding";
+@import "susy/bleed";
+@import "susy/breakpoint-plugin";

data/_sass/minimal-mistakes/vendor/susy/susy/language/_susyone.scss

@@ -1,13 +1,13 @@
-// ---------------------------------------------------------------------------
-// Partials
-
-$susy-version: 1.5;
-
-@import "susyone/settings";
-@import "susyone/functions";
-@import "susyone/grid";
-@import "susyone/isolation";
-@import "susyone/padding";
-@import "susyone/margin";
-@import "susyone/media";
-@import "susyone/background";
+// ---------------------------------------------------------------------------
+// Partials
+
+$susy-version: 1.5;
+
+@import "susyone/settings";
+@import "susyone/functions";
+@import "susyone/grid";
+@import "susyone/isolation";
+@import "susyone/padding";
+@import "susyone/margin";
+@import "susyone/media";
+@import "susyone/background";

data/_sass/minimal-mistakes/vendor/susy/susy/language/susy/_background.scss

@@ -1,385 +1,385 @@
-// Background Grid Syntax
-// ======================
-
-$susy-overlay-grid-head-exists: false;
-
-
-// Show Grid/s
-// -----------
-// Show grid on any element using either background or overlay.
-// - [$grid]  : <settings>
-@mixin show-grid(
-  $grid: $susy
-) {
-  $inspect: $grid;
-  $_output: debug-get(output, $grid);
-
-  @include susy-inspect(show-grid, $inspect);
-  @if $_output == overlay and susy-get(debug image, $grid) != hide {
-    @include overlay-grid($grid);
-  } @else {
-    @include background-grid($grid);
-  }
-}
-
-@mixin show-grids(
-  $grid: $susy
-) {
-  @include show-grid($grid);
-}
-
-// Background Grid
-// ---------------
-// Show a grid background on any element.
-// - [$grid]  : <settings>
-@mixin background-grid(
-  $grid: $susy
-) {
-  $inspect  : $grid;
-  $_output  : get-background($grid);
-
-  @if length($_output) > 0 {
-    $_flow: susy-get(flow, $grid);
-
-    $_image: ();
-    @each $name, $layer in map-get($_output, image) {
-      $_direction: if($name == baseline, to bottom, to to($_flow));
-      $_image: append($_image, linear-gradient($_direction, $layer), comma);
-    }
-    $_output: map-merge($_output, (image: $_image));
-
-    @include background-grid-output($_output...);
-    @include susy-inspect(background-grid, $inspect);
-  }
-}
-
-
-// Overlay Grid
-// ------------
-// Generate an icon to trigger grid-overlays on any given elements.
-// $grids...  : <selector> [<settings>] [, <selector>]*
-@mixin overlay-grid (
-  $grid: $susy
-) {
-  @if not($susy-overlay-grid-head-exists) {
-    @at-root head { @include overlay-head($grid); }
-    @at-root head:before { @include overlay-trigger; }
-    @at-root head:hover { @include overlay-trigger-hover; }
-    $susy-overlay-grid-head-exists: true !global;
-  }
-
-  head:hover ~ &,
-  head:hover ~ body & {
-    position: relative;
-    &:before {
-      @include grid-overlay-base;
-      @include background-grid($grid);
-    }
-  }
-}
-
-
-// [Private] Overlay Trigger
-// -------------------------
-@mixin overlay-trigger {
-  content: "|||";
-  display: block;
-  padding: 5px 10px;
-  font: {
-    family: sans-serif;
-    size: 16px;
-    weight: bold;
-  }
-}
-
-
-// [Private] Overlay Trigger Hover
-// -------------------------------
-@mixin overlay-trigger-hover {
-  background: rgba(white, .5);
-  color: red;
-}
-
-
-// [Private] Overlay Head
-// ----------------------
-// <head> styles to create grid overlay toggle
-@mixin overlay-head (
-  $grid: $susy
-) {
-  $_toggle: debug-get(toggle, $grid);
-  $_horz: null;
-  $_vert: null;
-
-  @each $side in $_toggle {
-    $_horz: if($side == left or $side == right, $side, $_horz);
-    $_vert: if($side == top or $side == bottom, $side, $_vert);
-  }
-
-  display: block;
-  position: fixed;
-  #{$_horz}: 10px;
-  #{$_vert}: 10px;
-  z-index: 999;
-  color: #333;
-  background: rgba(white, .25);
-}
-
-
-// [Private] Grid Overlay Base
-// ---------------------------
-// Base styles for generating a grid overlay
-@mixin grid-overlay-base() {
-  position: absolute;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  right: 0;
-  content: " ";
-  z-index: 998;
-}
-
-
-// Get Symmetrical Background
-// --------------------------
-// - $grid: <map>
-@function get-background-sym(
-  $grid
-) {
-  $grid           : parse-grid($grid);
-  $_gutters       : susy-get(gutters, $grid);
-  $_column-width  : susy-get(column-width, $grid);
-  $_math          : susy-get(math, $grid);
-
-  $_color         : debug-get(color);
-  $_trans         : transparent;
-  $_light         : lighten($_color, 15%);
-
-  $_end           : 1 + $_gutters;
-  $_after         : percentage(1/$_end);
-  $_stops         : ();
-  $_size          : span(1 $grid wide);
-
-  @if is-inside($grid) {
-    $_stops: $_color, $_light;
-  } @else if is-split($grid) {
-    $_split: $_gutters/2;
-    $_before: percentage($_split/$_end);
-    $_after: percentage((1 + $_split)/$_end);
-    $_stops: $_trans $_before, $_color $_before, $_light $_after, $_trans $_after;
-  } @else {
-    $_stops: $_color, $_light $_after, $_trans $_after;
-  }
-
-  @if $_math == static {
-    $_size: valid-column-math($_math, $_column-width) * $_end;
-  }
-
-  $_output: (
-    image: (columns: $_stops),
-    size: $_size,
-  );
-
-  @return $_output;
-}
-
-
-// Get Asymmetrical Inside
-// -----------------------
-// - $grid: <settings>
-@function get-asym-inside(
-  $grid
-) {
-  $grid     : parse-grid($grid);
-  $_columns : susy-get(columns, $grid);
-
-  $_color   : debug-get(color);
-  $_light   : lighten($_color, 15%);
-  $_stops   : ();
-
-  @for $location from 1 through susy-count($_columns) {
-    $this-stop: ();
-
-    @if $location == 1 {
-      $this-stop: append($this-stop, $_color, comma);
-    } @else {
-      $start: parse-span(1 at $location $grid);
-      $start: get-isolation($start);
-      $this-stop: append($this-stop, $_color $start, comma);
-    }
-
-    @if $location == susy-count($_columns) {
-      $this-stop: append($this-stop, $_light, comma);
-    } @else {
-      $_end: parse-span(1 at ($location + 1) $grid);
-      $_end: get-isolation($_end);
-      $this-stop: append($this-stop, $_light $_end, comma);
-    }
-
-    $_stops: join($_stops, $this-stop, comma);
-  }
-
-  @return $_stops;
-}
-
-
-// Get Asymmetrical Split
-// ----------------------
-// - $grid: <settings>
-@function get-asym-split(
-  $grid
-) {
-  $grid     : parse-grid($grid);
-  $_columns : susy-get(columns, $grid);
-
-  $_color   : debug-get(color);
-  $_light   : lighten($_color, 15%);
-  $_stops   : ();
-
-  @for $location from 1 through susy-count($_columns) {
-    $this-stop: ();
-
-    $start: parse-span(1 at $location $grid);
-    $start: get-isolation($start);
-    $this-stop: append($this-stop, transparent $start, comma);
-    $this-stop: append($this-stop, $_color $start, comma);
-
-    $_end: $start + span(1 at $location $grid);
-    $this-stop: append($this-stop, $_light $_end, comma);
-    $this-stop: append($this-stop, transparent $_end, comma);
-
-    $_stops: join($_stops, $this-stop, comma);
-  }
-
-  @return $_stops;
-}
-
-
-// Get Asymmetrical Outside
-// ------------------------
-// - $grid: <settings>
-@function get-asym-outside(
-  $grid
-) {
-  $grid     : parse-grid($grid);
-  $_columns : susy-get(columns, $grid);
-
-  $_color   : debug-get(color);
-  $_light   : lighten($_color, 15%);
-  $_trans   : transparent;
-  $_stops   : ();
-
-  @for $location from 1 through susy-count($_columns) {
-    $this-stop: ();
-
-    @if $location == 1 {
-      $this-stop: append($this-stop, $_color, comma);
-    } @else {
-      $start: parse-span(1 at $location $grid);
-      $start: get-isolation($start);
-      $this-stop: append($this-stop, $_color $start, comma);
-    }
-
-    @if $location == susy-count($_columns) {
-      $this-stop: append($this-stop, $_light, comma);
-    } @else {
-      $gutter: get-span-width(first $location $grid);
-
-      $_end: parse-span(1 at ($location + 1) $grid);
-      $_end: get-isolation($_end);
-
-      $gutter: $_light $gutter, $_trans $gutter, $_trans $_end;
-      $this-stop: join($this-stop, $gutter, comma);
-    }
-
-    $_stops: join($_stops, $this-stop, comma);
-  }
-
-  @return $_stops;
-}
-
-
-// Get Asymmetrical Background
-// ---------------------------
-// - $grid: <settings>
-@function get-background-asym(
-  $grid
-) {
-  $_stops: ();
-
-  @if is-inside($grid) {
-    $_stops: get-asym-inside($grid);
-  } @else if is-split($grid) {
-    $_stops: get-asym-split($grid);
-  } @else {
-    $_stops: get-asym-outside($grid);
-  }
-
-  @return (image: (columns: $_stops));
-}
-
-
-// Get Background
-// --------------
-// - $grid: <settings>
-@function get-background(
-  $grid
-) {
-  $grid     : parse-grid($grid);
-  $_show    : susy-get(debug image, $grid);
-  $_return  : ();
-
-  @if $_show and $_show != 'hide' {
-    $_columns: susy-get(columns, $grid);
-
-    @if $_show != 'show-baseline' {
-      $_sym: is-symmetrical($_columns);
-      $_return: if($_sym, get-background-sym($grid), get-background-asym($grid));
-      $_return: map-merge($_return, (clip: content-box));
-    }
-
-    @if $_show != 'show-columns'
-      and global-variable-exists(base-line-height)
-      and type-of($base-line-height) == 'number'
-      and not unitless($base-line-height) {
-      $_color: variable-exists('grid-background-baseline-color');
-      $_color: if($_color, $grid-background-baseline-color, #000);
-
-      $_image: map-get($_return, image);
-      $_size: map-get($_return, size);
-      $_baseline: (baseline: ($_color 1px, transparent 1px));
-      $_baseline-size: 100% $base-line-height;
-
-      $_return: map-merge($_return, (
-        image: if($_image, map-merge($_image, $_baseline), $_baseline),
-        size: if($_size, ($_size, $_baseline-size), $_baseline-size),
-      ));
-
-      @if $_show == 'show' {
-        $_clip: map-get($_return, clip);
-        $_return: map-merge($_return, (clip: join($_clip, border-box, comma)));
-      }
-    } @else if $_show == 'show-baseline' {
-      @warn 'Please provide a $base-line-height with the desired height and units';
-    }
-  }
-
-  @if map-get($_return, image) {
-    $_return: map-merge($_return, (flow: susy-get(flow, $grid)));
-  }
-
-  @return $_return;
-}
-
-
-// Get Debug
-// ---------
-// Return the value of a debug setting
-// - $key: <setting>
-@function debug-get(
-  $key,
-  $grid: $susy
-) {
-  $key: join(debug, $key, space);
-  @return susy-get($key, $grid);
-}
+// Background Grid Syntax
+// ======================
+
+$susy-overlay-grid-head-exists: false;
+
+
+// Show Grid/s
+// -----------
+// Show grid on any element using either background or overlay.
+// - [$grid]  : <settings>
+@mixin show-grid(
+  $grid: $susy
+) {
+  $inspect: $grid;
+  $_output: debug-get(output, $grid);
+
+  @include susy-inspect(show-grid, $inspect);
+  @if $_output == overlay and susy-get(debug image, $grid) != hide {
+    @include overlay-grid($grid);
+  } @else {
+    @include background-grid($grid);
+  }
+}
+
+@mixin show-grids(
+  $grid: $susy
+) {
+  @include show-grid($grid);
+}
+
+// Background Grid
+// ---------------
+// Show a grid background on any element.
+// - [$grid]  : <settings>
+@mixin background-grid(
+  $grid: $susy
+) {
+  $inspect  : $grid;
+  $_output  : get-background($grid);
+
+  @if length($_output) > 0 {
+    $_flow: susy-get(flow, $grid);
+
+    $_image: ();
+    @each $name, $layer in map-get($_output, image) {
+      $_direction: if($name == baseline, to bottom, to to($_flow));
+      $_image: append($_image, linear-gradient($_direction, $layer), comma);
+    }
+    $_output: map-merge($_output, (image: $_image));
+
+    @include background-grid-output($_output...);
+    @include susy-inspect(background-grid, $inspect);
+  }
+}
+
+
+// Overlay Grid
+// ------------
+// Generate an icon to trigger grid-overlays on any given elements.
+// $grids...  : <selector> [<settings>] [, <selector>]*
+@mixin overlay-grid (
+  $grid: $susy
+) {
+  @if not($susy-overlay-grid-head-exists) {
+    @at-root head { @include overlay-head($grid); }
+    @at-root head:before { @include overlay-trigger; }
+    @at-root head:hover { @include overlay-trigger-hover; }
+    $susy-overlay-grid-head-exists: true !global;
+  }
+
+  head:hover ~ &,
+  head:hover ~ body & {
+    position: relative;
+    &:before {
+      @include grid-overlay-base;
+      @include background-grid($grid);
+    }
+  }
+}
+
+
+// [Private] Overlay Trigger
+// -------------------------
+@mixin overlay-trigger {
+  content: "|||";
+  display: block;
+  padding: 5px 10px;
+  font: {
+    family: sans-serif;
+    size: 16px;
+    weight: bold;
+  }
+}
+
+
+// [Private] Overlay Trigger Hover
+// -------------------------------
+@mixin overlay-trigger-hover {
+  background: rgba(white, .5);
+  color: red;
+}
+
+
+// [Private] Overlay Head
+// ----------------------
+// <head> styles to create grid overlay toggle
+@mixin overlay-head (
+  $grid: $susy
+) {
+  $_toggle: debug-get(toggle, $grid);
+  $_horz: null;
+  $_vert: null;
+
+  @each $side in $_toggle {
+    $_horz: if($side == left or $side == right, $side, $_horz);
+    $_vert: if($side == top or $side == bottom, $side, $_vert);
+  }
+
+  display: block;
+  position: fixed;
+  #{$_horz}: 10px;
+  #{$_vert}: 10px;
+  z-index: 999;
+  color: #333;
+  background: rgba(white, .25);
+}
+
+
+// [Private] Grid Overlay Base
+// ---------------------------
+// Base styles for generating a grid overlay
+@mixin grid-overlay-base() {
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  content: " ";
+  z-index: 998;
+}
+
+
+// Get Symmetrical Background
+// --------------------------
+// - $grid: <map>
+@function get-background-sym(
+  $grid
+) {
+  $grid           : parse-grid($grid);
+  $_gutters       : susy-get(gutters, $grid);
+  $_column-width  : susy-get(column-width, $grid);
+  $_math          : susy-get(math, $grid);
+
+  $_color         : debug-get(color);
+  $_trans         : transparent;
+  $_light         : lighten($_color, 15%);
+
+  $_end           : 1 + $_gutters;
+  $_after         : percentage(1/$_end);
+  $_stops         : ();
+  $_size          : span(1 $grid wide);
+
+  @if is-inside($grid) {
+    $_stops: $_color, $_light;
+  } @else if is-split($grid) {
+    $_split: $_gutters/2;
+    $_before: percentage($_split/$_end);
+    $_after: percentage((1 + $_split)/$_end);
+    $_stops: $_trans $_before, $_color $_before, $_light $_after, $_trans $_after;
+  } @else {
+    $_stops: $_color, $_light $_after, $_trans $_after;
+  }
+
+  @if $_math == static {
+    $_size: valid-column-math($_math, $_column-width) * $_end;
+  }
+
+  $_output: (
+    image: (columns: $_stops),
+    size: $_size,
+  );
+
+  @return $_output;
+}
+
+
+// Get Asymmetrical Inside
+// -----------------------
+// - $grid: <settings>
+@function get-asym-inside(
+  $grid
+) {
+  $grid     : parse-grid($grid);
+  $_columns : susy-get(columns, $grid);
+
+  $_color   : debug-get(color);
+  $_light   : lighten($_color, 15%);
+  $_stops   : ();
+
+  @for $location from 1 through susy-count($_columns) {
+    $this-stop: ();
+
+    @if $location == 1 {
+      $this-stop: append($this-stop, $_color, comma);
+    } @else {
+      $start: parse-span(1 at $location $grid);
+      $start: get-isolation($start);
+      $this-stop: append($this-stop, $_color $start, comma);
+    }
+
+    @if $location == susy-count($_columns) {
+      $this-stop: append($this-stop, $_light, comma);
+    } @else {
+      $_end: parse-span(1 at ($location + 1) $grid);
+      $_end: get-isolation($_end);
+      $this-stop: append($this-stop, $_light $_end, comma);
+    }
+
+    $_stops: join($_stops, $this-stop, comma);
+  }
+
+  @return $_stops;
+}
+
+
+// Get Asymmetrical Split
+// ----------------------
+// - $grid: <settings>
+@function get-asym-split(
+  $grid
+) {
+  $grid     : parse-grid($grid);
+  $_columns : susy-get(columns, $grid);
+
+  $_color   : debug-get(color);
+  $_light   : lighten($_color, 15%);
+  $_stops   : ();
+
+  @for $location from 1 through susy-count($_columns) {
+    $this-stop: ();
+
+    $start: parse-span(1 at $location $grid);
+    $start: get-isolation($start);
+    $this-stop: append($this-stop, transparent $start, comma);
+    $this-stop: append($this-stop, $_color $start, comma);
+
+    $_end: $start + span(1 at $location $grid);
+    $this-stop: append($this-stop, $_light $_end, comma);
+    $this-stop: append($this-stop, transparent $_end, comma);
+
+    $_stops: join($_stops, $this-stop, comma);
+  }
+
+  @return $_stops;
+}
+
+
+// Get Asymmetrical Outside
+// ------------------------
+// - $grid: <settings>
+@function get-asym-outside(
+  $grid
+) {
+  $grid     : parse-grid($grid);
+  $_columns : susy-get(columns, $grid);
+
+  $_color   : debug-get(color);
+  $_light   : lighten($_color, 15%);
+  $_trans   : transparent;
+  $_stops   : ();
+
+  @for $location from 1 through susy-count($_columns) {
+    $this-stop: ();
+
+    @if $location == 1 {
+      $this-stop: append($this-stop, $_color, comma);
+    } @else {
+      $start: parse-span(1 at $location $grid);
+      $start: get-isolation($start);
+      $this-stop: append($this-stop, $_color $start, comma);
+    }
+
+    @if $location == susy-count($_columns) {
+      $this-stop: append($this-stop, $_light, comma);
+    } @else {
+      $gutter: get-span-width(first $location $grid);
+
+      $_end: parse-span(1 at ($location + 1) $grid);
+      $_end: get-isolation($_end);
+
+      $gutter: $_light $gutter, $_trans $gutter, $_trans $_end;
+      $this-stop: join($this-stop, $gutter, comma);
+    }
+
+    $_stops: join($_stops, $this-stop, comma);
+  }
+
+  @return $_stops;
+}
+
+
+// Get Asymmetrical Background
+// ---------------------------
+// - $grid: <settings>
+@function get-background-asym(
+  $grid
+) {
+  $_stops: ();
+
+  @if is-inside($grid) {
+    $_stops: get-asym-inside($grid);
+  } @else if is-split($grid) {
+    $_stops: get-asym-split($grid);
+  } @else {
+    $_stops: get-asym-outside($grid);
+  }
+
+  @return (image: (columns: $_stops));
+}
+
+
+// Get Background
+// --------------
+// - $grid: <settings>
+@function get-background(
+  $grid
+) {
+  $grid     : parse-grid($grid);
+  $_show    : susy-get(debug image, $grid);
+  $_return  : ();
+
+  @if $_show and $_show != 'hide' {
+    $_columns: susy-get(columns, $grid);
+
+    @if $_show != 'show-baseline' {
+      $_sym: is-symmetrical($_columns);
+      $_return: if($_sym, get-background-sym($grid), get-background-asym($grid));
+      $_return: map-merge($_return, (clip: content-box));
+    }
+
+    @if $_show != 'show-columns'
+      and global-variable-exists(base-line-height)
+      and type-of($base-line-height) == 'number'
+      and not unitless($base-line-height) {
+      $_color: variable-exists('grid-background-baseline-color');
+      $_color: if($_color, $grid-background-baseline-color, #000);
+
+      $_image: map-get($_return, image);
+      $_size: map-get($_return, size);
+      $_baseline: (baseline: ($_color 1px, transparent 1px));
+      $_baseline-size: 100% $base-line-height;
+
+      $_return: map-merge($_return, (
+        image: if($_image, map-merge($_image, $_baseline), $_baseline),
+        size: if($_size, ($_size, $_baseline-size), $_baseline-size),
+      ));
+
+      @if $_show == 'show' {
+        $_clip: map-get($_return, clip);
+        $_return: map-merge($_return, (clip: join($_clip, border-box, comma)));
+      }
+    } @else if $_show == 'show-baseline' {
+      @warn 'Please provide a $base-line-height with the desired height and units';
+    }
+  }
+
+  @if map-get($_return, image) {
+    $_return: map-merge($_return, (flow: susy-get(flow, $grid)));
+  }
+
+  @return $_return;
+}
+
+
+// Get Debug
+// ---------
+// Return the value of a debug setting
+// - $key: <setting>
+@function debug-get(
+  $key,
+  $grid: $susy
+) {
+  $key: join(debug, $key, space);
+  @return susy-get($key, $grid);
+}