From 77a15c8d392ba617fe750b9e6ee412dec0da3f6f Mon Sep 17 00:00:00 2001
From: FawzyAshraf <fawzyashrf98@gmail.com>
Date: Mon, 16 Dec 2024 18:34:12 +0200
Subject: [PATCH 1/2] Enable sass parser in ui/build to parse indirect color
 assignments

The sass build for colors currently only works for direct assignments,
but doesn't work correctly when being assigned to another variables and
causes the assignee to be #000 instead.
---
 ui/.build/src/sass.ts | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/ui/.build/src/sass.ts b/ui/.build/src/sass.ts
index bbf63ed84bf9f..40d7352741b56 100644
--- a/ui/.build/src/sass.ts
+++ b/ui/.build/src/sass.ts
@@ -235,6 +235,7 @@ async function parseScss(src: string) {
 async function parseThemeColorDefs() {
   const themeFiles = await globArray('./common/css/theme/_*.scss', { absolute: false });
   const themes: string[] = ['dark'];
+  const capturedColors = new Map<string, string>();
   for (const themeFile of themeFiles ?? []) {
     const theme = /_([^/]+)\.scss/.exec(themeFile)?.[1];
     if (!theme) {
@@ -242,9 +243,22 @@ async function parseThemeColorDefs() {
       continue;
     }
     const text = fs.readFileSync(themeFile, 'utf8');
-    const colorMap = new Map<string, clr.Instance>();
     for (const match of text.matchAll(/\s\$c-([-a-z0-9]+):\s*([^;]+);/g)) {
-      colorMap.set(match[1], clr(match[2]));
+      capturedColors.set(match[1], match[2]);
+    }
+    const colorMap = new Map<string, clr.Instance>();
+    for (const [color, colorVal] of capturedColors) {
+      let val = colorVal;
+      const visitedVariables = new Set();
+      while (val.startsWith('$')) {
+        const inferredValue = capturedColors.get(val.substring(3)) ?? '#000';
+        if (visitedVariables.has(inferredValue)) {
+          break;
+        }
+        visitedVariables.add(inferredValue);
+        val = inferredValue;
+      }
+      colorMap.set(color, clr(val));
     }
     if (theme !== 'default') themes.push(theme);
     themeColorMap.set(theme, colorMap);

From 8732d9ac082be7859890d8ffc35c432794daceb8 Mon Sep 17 00:00:00 2001
From: FawzyAshraf <fawzyashrf98@gmail.com>
Date: Wed, 18 Dec 2024 21:49:14 +0200
Subject: [PATCH 2/2] Declare $c-good by hsl instead of scss variable

---
 ui/common/css/theme/_default.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ui/common/css/theme/_default.scss b/ui/common/css/theme/_default.scss
index f28ffa0780e5c..52e44c64d9527 100644
--- a/ui/common/css/theme/_default.scss
+++ b/ui/common/css/theme/_default.scss
@@ -30,7 +30,7 @@ $c-shade: hsl(0, 0%, 30%);
 $c-inaccuracy: hsl(202, 78%, 62%);
 $c-mistake: hsl(41, 100%, 45%);
 $c-blunder: hsl(0, 69%, 60%);
-$c-good: $c-secondary;
+$c-good: hsl(88, 62%, 37%);
 $c-brilliant: hsl(129, 71%, 45%);
 $c-interesting: hsl(307, 80%, 70%);
 $c-paper: hsl(60, 56%, 91%);