add theme-color-level function and interval so we can generate shades of colors

scss/_functions.scss

@@ -67,6 +67,20 @@
 @function color($key: "blue") {
   @return map-get($colors, $key);
 }
+
 @function theme-color($key: "primary") {
   @return map-get($theme-colors, $key);
 }
+
+// Request a theme color level
+@function theme-color-level($color-name: "primary", $level: 0) {
+  $color: theme-color($color-name);
+  $color-base: if($level > 0, #000, #fff);
+
+  @if $level < 0 {
+    // Lighter values need a quick double negative for the Sass math to work
+    @return mix($color-base, $color, $level * -1 * $theme-color-interval);
+  } @else {
+    @return mix($color-base, $color, $level * $theme-color-interval);
+  }
+}