From b237f78c40600f8ac10420ab89abe6d49685ae8b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Miguel=20Gonz=C3=A1lez?= <migolo10@gmail.com>
Date: Wed, 28 Apr 2021 12:55:16 -0500
Subject: [PATCH] Update _colors.scss

Getting a warning
WARNING: You probably don't mean to use the color value white in interpolation here.
It may end up represented as white, which will likely produce invalid CSS.
Always quote color names when using them as strings or map keys (for example, "white").
If you really want to use the color value here, use '"" + $color'.
---
 src/scss/utils/_colors.scss | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/scss/utils/_colors.scss b/src/scss/utils/_colors.scss
index 1d9553561..4fae2f789 100644
--- a/src/scss/utils/_colors.scss
+++ b/src/scss/utils/_colors.scss
@@ -4,12 +4,12 @@
 SOCIAL COLORS
  */
 @each $color, $value in $social-colors {
-  .bg-#{$color} {
+  .bg-#{"" + $color} {
     color: #fff !important;
     background: $value !important;
   }
 
-  .text-#{$color} {
+  .text-#{"" + $color} {
     color: $value !important;
   }
 }
@@ -17,15 +17,15 @@ SOCIAL COLORS
 
 @if $enable-extra-colors {
   @each $color, $value in map-merge($colors, (dark: $dark, muted: $text-muted, white: $white)) {
-    .bg-#{$color} {
+    .bg-#{"" + $color} {
       background: $value;
     }
 
-    .text-#{$color} {
+    .text-#{"" + $color} {
       color: $value !important;
     }
 
-    .bg-#{$color}-lt {
+    .bg-#{"" + $color}-lt {
       color: $value !important;
       background: theme-color-lighter($value, true) !important;
     }