From 99cd3d1df0454ae076ddda90dda658da7c4e42d5 Mon Sep 17 00:00:00 2001
From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com>
Date: Fri, 11 Oct 2024 04:25:34 +0900
Subject: [PATCH] [bugfix] Main Page: Message Box Ratio. store the data in
 float and fix the bug that was set bit off message box's height.

---
 src-python/config.py                                          | 2 +-
 src-python/webui_controller.py                                | 2 +-
 .../main_section/message_container/MessageContainer.jsx       | 4 ++--
 src-ui/app/window_title_bar/WindowTitleBar.module.scss        | 2 +-
 src-ui/utils/variables.css                                    | 1 +
 5 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src-python/config.py b/src-python/config.py
index 2aa8ac28..3537c2f5 100644
--- a/src-python/config.py
+++ b/src-python/config.py
@@ -399,7 +399,7 @@ class Config:
 
     @MESSAGE_BOX_RATIO.setter
     def MESSAGE_BOX_RATIO(self, value):
-        if isinstance(value, int) and self.MESSAGE_BOX_RATIO_RANGE[0] <= value <= self.MESSAGE_BOX_RATIO_RANGE[1]:
+        if isinstance(value, float):
             self._MESSAGE_BOX_RATIO = value
             saveJson(self.PATH_CONFIG, inspect.currentframe().f_code.co_name, value)
 
diff --git a/src-python/webui_controller.py b/src-python/webui_controller.py
index 6632e3a0..3a48a7cd 100644
--- a/src-python/webui_controller.py
+++ b/src-python/webui_controller.py
@@ -549,7 +549,7 @@ class Controller:
 
     @staticmethod
     def setMessageBoxRatio(data, *args, **kwargs) -> dict:
-        config.MESSAGE_BOX_RATIO = int(data)
+        config.MESSAGE_BOX_RATIO = float(data)
         return {"status":200, "result":config.MESSAGE_BOX_RATIO}
 
     @staticmethod
diff --git a/src-ui/app/main_page/main_section/message_container/MessageContainer.jsx b/src-ui/app/main_page/main_section/message_container/MessageContainer.jsx
index 944c3fcc..c19158cf 100644
--- a/src-ui/app/main_page/main_section/message_container/MessageContainer.jsx
+++ b/src-ui/app/main_page/main_section/message_container/MessageContainer.jsx
@@ -49,8 +49,8 @@ export const MessageContainer = () => {
         const container_height = container_ref.current.offsetHeight;
         const container_padding_bottom = parseFloat(window.getComputedStyle(container_ref.current).paddingBottom);
         const total_height = container_height - container_padding_bottom;
-
-        return ((ratio / 100) * total_height / 10) | 0; // 10px = 1rem
+        if (total_height === 0) return 0;
+        return ((ratio / 100) * total_height / 10); // 10px = 1rem
     };
 
 
diff --git a/src-ui/app/window_title_bar/WindowTitleBar.module.scss b/src-ui/app/window_title_bar/WindowTitleBar.module.scss
index 75785d0e..8aa100b1 100644
--- a/src-ui/app/window_title_bar/WindowTitleBar.module.scss
+++ b/src-ui/app/window_title_bar/WindowTitleBar.module.scss
@@ -11,7 +11,7 @@
     width: 100%;
     justify-content: space-between;
     align-items: center;
-    height: 2rem;
+    height: var(--title_bar_height);
     margin-top: 0.4rem;
 }
 
diff --git a/src-ui/utils/variables.css b/src-ui/utils/variables.css
index 1b462bf0..9cd88d28 100644
--- a/src-ui/utils/variables.css
+++ b/src-ui/utils/variables.css
@@ -46,6 +46,7 @@
     --dark_1000_color: #151517;
 
 
+    --title_bar_height: 2rem;
     --main_page_topbar_height: 4.8rem;
     --config_page_sidebar_width: 18rem;
     --config_page_topbar_height: 8rem;