From 3c9c4366eaa78b14d290339fc2162c42f5167f6f Mon Sep 17 00:00:00 2001
From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com>
Date: Tue, 17 Dec 2024 20:16:44 +0900
Subject: [PATCH] [Update] Config Page: Change the background color modal and
 quick settings.

---
 src-ui/app/_index_css/variables.css                         | 1 +
 .../setting_section/setting_box/vr/Vr.module.scss           | 6 +++---
 src-ui/app/modal_controller/ModalController.module.scss     | 4 ++--
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src-ui/app/_index_css/variables.css b/src-ui/app/_index_css/variables.css
index 8a759d0c..b433e5d9 100644
--- a/src-ui/app/_index_css/variables.css
+++ b/src-ui/app/_index_css/variables.css
@@ -49,6 +49,7 @@
     --dark_1000_color: #151517;
 
     --dark_825_color_cc: #434447cc;
+    --dark_550_color_22: #94959922;
 
 
     --title_bar_height: 2rem;
diff --git a/src-ui/app/config_page/setting_section/setting_box/vr/Vr.module.scss b/src-ui/app/config_page/setting_section/setting_box/vr/Vr.module.scss
index ff370d92..f5e813a6 100644
--- a/src-ui/app/config_page/setting_section/setting_box/vr/Vr.module.scss
+++ b/src-ui/app/config_page/setting_section/setting_box/vr/Vr.module.scss
@@ -170,7 +170,7 @@
 
 
 .slider_reset_button {
-    background-color: var(--dark_850_color);
+    background-color: var(--dark_875_color);
     padding: 0.6rem;
     display: flex;
     justify-content: center;
@@ -178,13 +178,13 @@
     border-radius: 0.4rem;
     flex-shrink: 0;
     &:hover {
-        background-color: var(--dark_800_color);
+        background-color: var(--dark_825_color);
         & .slider_reset_svg {
             color: var(--dark_200_color);
         }
     }
     &:active {
-        background-color: var(--dark_900_color);
+        background-color: var(--dark_925_color);
     }
 }
 
diff --git a/src-ui/app/modal_controller/ModalController.module.scss b/src-ui/app/modal_controller/ModalController.module.scss
index 914fedef..0c527b10 100644
--- a/src-ui/app/modal_controller/ModalController.module.scss
+++ b/src-ui/app/modal_controller/ModalController.module.scss
@@ -11,7 +11,7 @@
     position: absolute;
     width: 100%;
     height: 100%;
-    background-color:  (#ffffff22);
+    background-color: var(--dark_550_color_22);
     backdrop-filter: blur(0.2rem);
 }
 
@@ -21,7 +21,7 @@
     left: 50%;
     transform: translate(-50%, -50%);
     overflow-y: auto;
-    background-color: var(--dark_875_color);
+    background-color: var(--dark_900_color);
     width: 60%;
     height: 96%;
     padding: 2rem;