From d0d03ed15d9f336391e0d53631d0c6d35806e7d9 Mon Sep 17 00:00:00 2001
From: willchiu <tachiu@ucsd.edu>
Date: Mon, 27 Oct 2025 00:00:41 -0700
Subject: [PATCH] added new fixes to the color pallete same color problem.

---
 src/gui/src/css/style.css            |  5 +++--
 src/gui/src/services/ThemeService.js | 11 +++++++++++
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/gui/src/css/style.css b/src/gui/src/css/style.css
index 4c7d1637e2..a291bff67f 100644
--- a/src/gui/src/css/style.css
+++ b/src/gui/src/css/style.css
@@ -112,6 +112,7 @@ pre {
     --select-saturation: 74.22%;
     --select-lightness: 55.88%;
     --select-color: hsl(var(--select-hue), var(--select-saturation), var(--select-lightness));
+    --sidebar-header-text-color: hsl(210, 41.18%, 90%); /* Default to light color */
 }
 
 html, body {
@@ -1188,7 +1189,7 @@ span.header-sort-icon img {
     height: calc(100% - 30px);
 }
 
-.window-cover-page.window-filedialog .window-body {
+.window-cover-page .window-body {
     height: calc(100% - 109px) !important;
 }
 
@@ -1218,7 +1219,7 @@ span.header-sort-icon img {
     margin: 0;
     font-weight: bold;
     font-size: 13px;
-    color: #8f96a3;
+    color: var(--sidebar-header-text-color);
     text-shadow: 1px 1px rgb(247 247 247 / 15%);
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
diff --git a/src/gui/src/services/ThemeService.js b/src/gui/src/services/ThemeService.js
index b49d41e684..3221f1e1df 100644
--- a/src/gui/src/services/ThemeService.js
+++ b/src/gui/src/services/ThemeService.js
@@ -150,3 +150,14 @@ export class ThemeService extends Service {
         ));
     }
 }
+
+function adjustSidebarHeaderTextColor(hue, saturation, transparency, lightness) {
+    // Calculate adjusted brightness based on lightness and transparency
+    const adjustedLightness = lightness * (1 - transparency);
+    return adjustedLightness > 50 ? `hsl(${hue}, ${saturation}%, 10%)` : `hsl(${hue}, ${saturation}%, 90%)`;
+}
+
+export function updateTheme(hue, saturation, transparency, lightness) {
+    const sidebarHeaderTextColor = adjustSidebarHeaderTextColor(hue, saturation, transparency, lightness);
+    document.documentElement.style.setProperty('--sidebar-header-text-color', sidebarHeaderTextColor);
+}