From 0d4aff228b31bcfb342e250e32dc2b4c7b4665fd Mon Sep 17 00:00:00 2001
From: chat26666 <chat26666@gmail.com>
Date: Mon, 7 Jul 2025 00:45:00 +0900
Subject: [PATCH] =?UTF-8?q?chore=20:=20ui=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/main/resources/templates/chat-page.html | 20 ++++++++++++++
 src/main/resources/templates/game-page.html | 29 +++++++++++++++++++++
 2 files changed, 49 insertions(+)

diff --git a/src/main/resources/templates/chat-page.html b/src/main/resources/templates/chat-page.html
index 18137e2e..a58e195e 100644
--- a/src/main/resources/templates/chat-page.html
+++ b/src/main/resources/templates/chat-page.html
@@ -88,6 +88,26 @@
             margin: 0 auto;
         }
 
+        #messages::-webkit-scrollbar {
+            width: 8px;
+        }
+
+        #messages::-webkit-scrollbar-track {
+            background: #12141f;
+        }
+
+        #messages::-webkit-scrollbar-thumb {
+            background-color: #00d084;
+            border-radius: 4px;
+            border: 2px solid #12141f;
+        }
+
+        /* Firefox용 */
+        #messages {
+            scrollbar-width: thin;
+            scrollbar-color: #00d084 #12141f;
+        }
+
         #sidebar {
             width: 200px;
             border-right: 1px solid #2a2d3d;
diff --git a/src/main/resources/templates/game-page.html b/src/main/resources/templates/game-page.html
index 95007128..830b304b 100644
--- a/src/main/resources/templates/game-page.html
+++ b/src/main/resources/templates/game-page.html
@@ -117,6 +117,35 @@
             z-index: 5;
         }
 
+        /* WebKit 기반 브라우저 스크롤바 스타일 */
+        .side-panel-right::-webkit-scrollbar,
+        .side-panel-left::-webkit-scrollbar,
+        .button-container::-webkit-scrollbar {
+            width: 10px;
+        }
+
+        .side-panel-right::-webkit-scrollbar-track,
+        .side-panel-left::-webkit-scrollbar-track,
+        .button-container::-webkit-scrollbar-track {
+            background: #111; /* 배경색: 어두운 검정계열 */
+        }
+
+        .side-panel-right::-webkit-scrollbar-thumb,
+        .side-panel-left::-webkit-scrollbar-thumb,
+        .button-container::-webkit-scrollbar-thumb {
+            background-color: #0f0; /* 초록색 막대 */
+            border-radius: 6px;
+            border: 2px solid #111; /* 트랙과 구분 위한 테두리 */
+        }
+
+        /* Firefox 스크롤바 스타일 */
+        .side-panel-right,
+        .side-panel-left,
+        .button-container {
+            scrollbar-width: thin;
+            scrollbar-color: #0f0 #111;
+        }
+
         .side-panel-right.active {
             display: block;
             right: 40px;