fix(Modal): background color now working

wfp · Nov 12, 2020 · 901be30 · 901be30
1 parent a4866e6
commit 901be30
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 1 deletion.
diff --git a/src/components/Modal/_modal.scss b/src/components/Modal/_modal.scss
@@ -33,7 +33,8 @@
     overflow: auto;
     content: '';
     opacity: 0;
-    background-color: rgba(var(--ui-07), 0.5);
+    //background-color: rgba(var(--ui-07), 0.5);
+    background-color: var(--modal-background);
     transition: opacity 200ms, z-index 0s 200ms, visibility 0s 200ms;
     visibility: hidden;
 

diff --git a/src/globals/scss/_colors.scss b/src/globals/scss/_colors.scss
@@ -165,3 +165,5 @@ $color__navy-gray-8: #dfe6eb !default;
 $color__navy-gray-9: #eff2f5 !default;
 $color__navy-gray-10: #f9fbfc !default;
 $color__white: #fff !default;
+
+$color__modal-background: rgba($color__gray-80, 0.8);
diff --git a/src/globals/scss/_theme-tokens.scss b/src/globals/scss/_theme-tokens.scss
@@ -41,6 +41,7 @@
     --disabled: #{$color__navy-gray-10};
     --disabled-01: #{$color__navy-gray-10};
     --disabled-02: #{$color__navy-gray-8};
+    --modal-background: #{$color__modal-background};
   }
 
   @media (prefers-color-scheme: dark) {