From 8629d9aa4a79e3d8b9413b766534d09182e9d179 Mon Sep 17 00:00:00 2001
From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com>
Date: Tue, 17 Dec 2024 23:56:30 +0900
Subject: [PATCH] [Update/bugfix] Quick Settings: Expand width. Config Page:
 Sidebar: shrink width a bit. Config Page: Setting Box: each component: Fix
 gap to prevent sliders cover the label.

---
 src-ui/app/_index_css/variables.css                           | 2 +-
 .../setting_box/_templates/Templates.module.scss              | 2 +-
 .../config_page/sidebar_section/SidebarSection.module.scss    | 4 ++--
 src-ui/app/modal_controller/ModalController.module.scss       | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src-ui/app/_index_css/variables.css b/src-ui/app/_index_css/variables.css
index b433e5d9..2d38f67a 100644
--- a/src-ui/app/_index_css/variables.css
+++ b/src-ui/app/_index_css/variables.css
@@ -54,7 +54,7 @@
 
     --title_bar_height: 2rem;
     --main_page_topbar_height: 4.8rem;
-    --config_page_sidebar_width: 18rem;
+    --config_page_sidebar_width: 16.8rem;
     --config_page_topbar_height: 8rem;
 
     --font_family: "Yu Gothic UI";
diff --git a/src-ui/app/config_page/setting_section/setting_box/_templates/Templates.module.scss b/src-ui/app/config_page/setting_section/setting_box/_templates/Templates.module.scss
index 3de7a81d..66bb6464 100644
--- a/src-ui/app/config_page/setting_section/setting_box/_templates/Templates.module.scss
+++ b/src-ui/app/config_page/setting_section/setting_box/_templates/Templates.module.scss
@@ -4,7 +4,7 @@
     justify-content: space-between;
     align-items: center;
     padding: 2rem;
-    gap: 6rem;
+    gap: 10rem;
     &.flex_column {
         flex-direction: column;
     }
diff --git a/src-ui/app/config_page/sidebar_section/SidebarSection.module.scss b/src-ui/app/config_page/sidebar_section/SidebarSection.module.scss
index 849d34f1..6051cff6 100644
--- a/src-ui/app/config_page/sidebar_section/SidebarSection.module.scss
+++ b/src-ui/app/config_page/sidebar_section/SidebarSection.module.scss
@@ -4,7 +4,7 @@
     display: flex;
     flex-direction: column;
     justify-content: space-between;
-    padding: 0rem 0rem 5.8rem 1.6rem;
+    padding: 0rem 0rem 5.8rem 1.2rem;
     max-height: 60rem;
 }
 
@@ -23,7 +23,7 @@
     justify-content: left;
     align-items: center;
     color: var(--dark_basic_text_color);
-    padding: 0.8rem 0 0.8rem 1.2rem;
+    padding: 0.8rem 0 0.8rem 1rem;
     cursor: pointer;
     &:hover {
         background-color: var(--dark_800_color);
diff --git a/src-ui/app/modal_controller/ModalController.module.scss b/src-ui/app/modal_controller/ModalController.module.scss
index 0c527b10..567a1a7f 100644
--- a/src-ui/app/modal_controller/ModalController.module.scss
+++ b/src-ui/app/modal_controller/ModalController.module.scss
@@ -22,7 +22,7 @@
     transform: translate(-50%, -50%);
     overflow-y: auto;
     background-color: var(--dark_900_color);
-    width: 60%;
+    width: 80%;
     height: 96%;
     padding: 2rem;
     border-radius: 0.6rem;