From 49689e84fc4431405a02e80d9564f2e9a0139e6f Mon Sep 17 00:00:00 2001
From: Lam Tang <tangyenan@gmail.com>
Date: Sat, 23 Mar 2024 09:15:28 +0800
Subject: [PATCH] fix: also keep old color variables when not sign in

---
 .../features/developer-networks/react-modal.scss     |  4 ++--
 src/pages/ContentScripts/features/oss-gpt/rcw.scss   | 12 ++++++------
 .../repo-activity-racing-bar/PlayerButton.tsx        |  4 +++-
 .../repo-activity-racing-bar/SpeedController.tsx     |  2 +-
 src/pages/ContentScripts/index.scss                  |  6 +++---
 5 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/src/pages/ContentScripts/features/developer-networks/react-modal.scss b/src/pages/ContentScripts/features/developer-networks/react-modal.scss
index e9528f71..f88965fb 100644
--- a/src/pages/ContentScripts/features/developer-networks/react-modal.scss
+++ b/src/pages/ContentScripts/features/developer-networks/react-modal.scss
@@ -20,6 +20,6 @@
     rgba(0, 0, 0, 0.18) 0px 4.8px 14.4px 0px;
   outline: transparent solid 3px;
   border-radius: 2px;
-  background: var(--bgColor-default);
-  color: var(--fgColor-default);
+  background: var(--bgColor-default, var(--color-canvas-default));
+  color: var(--fgColor-default, var(--color-fg-default));
 }
diff --git a/src/pages/ContentScripts/features/oss-gpt/rcw.scss b/src/pages/ContentScripts/features/oss-gpt/rcw.scss
index 20a9b936..6deeb5ac 100644
--- a/src/pages/ContentScripts/features/oss-gpt/rcw.scss
+++ b/src/pages/ContentScripts/features/oss-gpt/rcw.scss
@@ -28,7 +28,7 @@
   margin-left: auto;
 }
 .rcw-client .rcw-message-text {
-  background-color: var(--bgColor-accent-muted);
+  background-color: var(--bgColor-accent-muted, var(--color-accent-subtle));
   border-radius: 10px;
   max-width: 350px;
   padding: 15px;
@@ -45,7 +45,7 @@
   align-items: flex-start;
 }
 .rcw-response .rcw-message-text {
-  background-color: var(--bgColor-inset);
+  background-color: var(--bgColor-inset, var(--color-canvas-subtle));
   border-radius: 10px;
   max-width: 450px;
   padding: 15px;
@@ -100,7 +100,7 @@
   color: #fff;
 }
 .rcw-conversation-container .rcw-header {
-  background-color: var(--header-bgColor);
+  background-color: var(--header-bgColor, var(--color-header-bg));
   border-radius: 10px 10px 0 0;
   color: #fff;
   display: flex;
@@ -175,7 +175,7 @@
   display: flex;
 }
 .loader-container {
-  background-color: var(--bgColor-inset);
+  background-color: var(--bgColor-inset, var(--color-canvas-subtle));
   border-radius: 10px;
   padding: 15px;
   max-width: 215px;
@@ -220,7 +220,7 @@
   }
 }
 .rcw-messages-container {
-  background-color: var(--bgColor-default);
+  background-color: var(--bgColor-default, var(--color-canvas-default));
   height: 55vh;
   max-height: 600px;
   overflow-y: auto;
@@ -830,7 +830,7 @@ img.rcw-picker-icon {
   animation-name: slide-in;
   animation-fill-mode: forwards;
   align-self: flex-end;
-  background-color: var(--header-bgColor);
+  background-color: var(--header-bgColor, var(--color-header-bg));
   border: 0;
   border-radius: 50%;
   box-shadow: 0 2px 10px 1px var(--color-shadow);
diff --git a/src/pages/ContentScripts/features/repo-activity-racing-bar/PlayerButton.tsx b/src/pages/ContentScripts/features/repo-activity-racing-bar/PlayerButton.tsx
index ebaa95f1..980fcf19 100644
--- a/src/pages/ContentScripts/features/repo-activity-racing-bar/PlayerButton.tsx
+++ b/src/pages/ContentScripts/features/repo-activity-racing-bar/PlayerButton.tsx
@@ -48,7 +48,9 @@ export const PlayerButton = ({
     >
       <Button
         style={{ backgroundColor: 'var(--color-btn-bg)' }}
-        styles={{ icon: { color: 'var(--fgColor-default)' } }}
+        styles={{
+          icon: { color: 'var(--fgColor-default, var(--color-fg-default))' },
+        }}
         icon={icon}
         onMouseDown={handleMouseDown}
         onMouseUp={handleMouseUp}
diff --git a/src/pages/ContentScripts/features/repo-activity-racing-bar/SpeedController.tsx b/src/pages/ContentScripts/features/repo-activity-racing-bar/SpeedController.tsx
index d6b265f5..cd8d4cdb 100644
--- a/src/pages/ContentScripts/features/repo-activity-racing-bar/SpeedController.tsx
+++ b/src/pages/ContentScripts/features/repo-activity-racing-bar/SpeedController.tsx
@@ -29,7 +29,7 @@ export const SpeedController = ({
     <Segmented
       style={{
         backgroundColor: 'var(--color-btn-bg)',
-        color: 'var(--fgColor-default)',
+        color: 'var(--fgColor-default, var(--color-fg-default))',
       }}
       options={options}
       value={speed}
diff --git a/src/pages/ContentScripts/index.scss b/src/pages/ContentScripts/index.scss
index e11c8faf..1210a8c7 100644
--- a/src/pages/ContentScripts/index.scss
+++ b/src/pages/ContentScripts/index.scss
@@ -5,7 +5,7 @@
 }
 
 .hypertrons-crx-border {
-  border: 1px solid var(--borderColor-default);
+  border: 1px solid var(--borderColor-default, var(--color-border-default));
   border-radius: 6px;
 }
 
@@ -15,8 +15,8 @@
   margin: 0;
   font-size: 14px;
   line-height: 35px;
-  background-color: var(--bgColor-inset);
-  border: 1px solid var(--borderColor-default);
+  background-color: var(--bgColor-inset, var(--color-canvas-subtle));
+  border: 1px solid var(--borderColor-default, var(--color-border-default));
   border-top-left-radius: 6px;
   border-top-right-radius: 6px;
 }