[edit] 調整

:

app/assets/style/helpers/_helpers.scss

@@ -54,4 +54,11 @@
   @include media-breakpoint-up(lg) {
     height: calc(100vh - 92px);
   }
+}
+
+/*nav*/
+
+.nav-overlay{
+  width: 190px;
+  height: 24px;
 }

app/assets/style/helpers/_variables.scss

@@ -96,6 +96,12 @@ $theme-colors: (
 ) !default;
 // scss-docs-end theme-colors-map
 
+//this is a must
+// scss-docs-start theme-colors-rgb
+$theme-colors-rgb: map-loop($theme-colors, to-rgb, "$value") !default;
+// scss-docs-end theme-colors-rgb
+//this is a must
+
 // The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.
 // See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast
 $min-contrast-ratio:   4.5 !default;
@@ -294,6 +300,31 @@ $body-bg:                   $white !default;
 $body-color:                $black !default; //edit
 $body-text-align:           null !default;
 
+//this is a must 
+// Utilities maps
+//
+// Extends the default `$theme-colors` maps to help create our utilities.
+
+// scss-docs-start utilities-colors
+$utilities-colors: map-merge(
+  $theme-colors-rgb,
+  (
+    "black": to-rgb($black),
+    "white": to-rgb($white),
+    "body":  to-rgb($body-color)
+  )
+) !default;
+// scss-docs-end utilities-colors
+
+// scss-docs-start utilities-text-colors
+$utilities-text-colors: map-loop($utilities-colors, rgba-css-var, "$key", "text") !default;
+// scss-docs-end utilities-text-colors
+
+// scss-docs-start utilities-bg-colors
+$utilities-bg-colors: map-loop($utilities-colors, rgba-css-var, "$key", "bg") !default;
+// scss-docs-end utilities-bg-colors
+//this is a must 
+
 
 // Links
 //