From 901be3065a6902552fce8e713ad27b31bae76602 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Robert=20Gu=CC=88hne?= <robert@polyxostudios.de>
Date: Thu, 12 Nov 2020 14:47:39 +0100
Subject: [PATCH] fix(Modal): background color now working

---
 src/components/Modal/_modal.scss    | 3 ++-
 src/globals/scss/_colors.scss       | 2 ++
 src/globals/scss/_theme-tokens.scss | 1 +
 3 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/Modal/_modal.scss b/src/components/Modal/_modal.scss
index d49f2bb59..a103f8299 100755
--- 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
index edb1b3312..a402f43d2 100755
--- 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
index 429346b49..0a6eefdf6 100644
--- 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) {