From 110d7646fc63cc1ce9b33d8de22b06bdc3fad5a7 Mon Sep 17 00:00:00 2001
From: Debanjum Singh Solanky <debanjum@gmail.com>
Date: Tue, 28 Nov 2023 14:09:57 -0800
Subject: [PATCH] Use milder yellow as primary Khoj theme color for chat,
 buttons etc.

---
 src/interface/desktop/assets/khoj.css  |  8 ++++----
 src/interface/obsidian/styles.css      | 17 +++++++++--------
 src/khoj/interface/web/assets/khoj.css | 14 +++++++-------
 3 files changed, 20 insertions(+), 19 deletions(-)

diff --git a/src/interface/desktop/assets/khoj.css b/src/interface/desktop/assets/khoj.css
index b2e048c5..accbfd58 100644
--- a/src/interface/desktop/assets/khoj.css
+++ b/src/interface/desktop/assets/khoj.css
@@ -2,8 +2,8 @@
 /* Can be forced with data-theme="light" */
 [data-theme="light"],
 :root:not([data-theme="dark"]) {
-    --primary: #fee285;
-    --primary-hover: #fcc50b;
+    --primary: #f9f5de;
+    --primary-hover: #fee285;
     --primary-focus: rgba(255, 179, 0, 0.125);
     --primary-inverse: rgba(0, 0, 0, 0.75);
     --background-color: #f5f4f3;
@@ -17,8 +17,8 @@
 /* Automatically enabled if user has Dark mode enabled */
 @media only screen and (prefers-color-scheme: dark) {
     :root:not([data-theme]) {
-        --primary: #fee285;
-        --primary-hover: #fcc50b;
+        --primary: #f9f5de;
+        --primary-hover: #fee285;
         --primary-focus: rgba(255, 179, 0, 0.25);
         --primary-inverse: rgba(0, 0, 0, 0.75);
         --background-color: #f5f4f3;
diff --git a/src/interface/obsidian/styles.css b/src/interface/obsidian/styles.css
index ff2dee8a..bb309fca 100644
--- a/src/interface/obsidian/styles.css
+++ b/src/interface/obsidian/styles.css
@@ -8,8 +8,9 @@ If your plugin does not need CSS, delete this file.
 */
 
 :root {
-    --khoj-chat-primary: #fee285;
-    --khoj-chat-dark-grey: #475569;
+    --khoj-winter-sun: #f9f5de;
+    --khoj-sun: #fee285;
+    --khoj-storm-grey: #475569;
  }
 
 .khoj-chat {
@@ -29,7 +30,7 @@ If your plugin does not need CSS, delete this file.
 
 #khoj-chat-title {
     font-weight: 200;
-    color: var(--khoj-chat-primary);
+    color: var(--khoj-sun);
 }
 
 #khoj-chat-body {
@@ -68,8 +69,8 @@ If your plugin does not need CSS, delete this file.
 }
 /* color chat bubble by khoj blue */
 .khoj-chat-message-text.khoj {
-    color: var(--khoj-chat-dark-grey);
-    background: var(--khoj-chat-primary);
+    color: var(--khoj-storm-grey);
+    background: var(--khoj-winter-sun);
     margin-left: auto;
     white-space: pre-line;
 }
@@ -80,14 +81,14 @@ If your plugin does not need CSS, delete this file.
     bottom: -2px;
     left: -7px;
     border: 10px solid transparent;
-    border-top-color: var(--khoj-chat-primary);
+    border-top-color: var(--khoj-winter-sun);
     border-bottom: 0;
     transform: rotate(-60deg);
 }
 /* color chat bubble by you dark grey */
 .khoj-chat-message-text.you {
     color: var(--text-on-accent);
-    background: var(--khoj-chat-dark-grey);
+    background: var(--khoj-storm-grey);
     margin-right: auto;
 }
 /* add right protrusion to you chat bubble */
@@ -97,7 +98,7 @@ If your plugin does not need CSS, delete this file.
     top: 91%;
     right: -2px;
     border: 10px solid transparent;
-    border-left-color: var(--khoj-chat-dark-grey);
+    border-left-color: var(--khoj-storm-grey);
     border-right: 0;
     margin-top: -10px;
     transform: rotate(-60deg)
diff --git a/src/khoj/interface/web/assets/khoj.css b/src/khoj/interface/web/assets/khoj.css
index a29c02a6..4a8fa6ed 100644
--- a/src/khoj/interface/web/assets/khoj.css
+++ b/src/khoj/interface/web/assets/khoj.css
@@ -2,8 +2,8 @@
 /* Can be forced with data-theme="light" */
 [data-theme="light"],
 :root:not([data-theme="dark"]) {
-    --primary: #fee285;
-    --primary-hover: #fcc50b;
+    --primary: #f9f5de;
+    --primary-hover: #fee285;
     --primary-focus: rgba(255, 179, 0, 0.125);
     --primary-inverse: rgba(0, 0, 0, 0.75);
     --background-color: #f5f4f3;
@@ -17,8 +17,8 @@
 /* Automatically enabled if user has Dark mode enabled */
 @media only screen and (prefers-color-scheme: dark) {
     :root:not([data-theme]) {
-        --primary: #fee285;
-        --primary-hover: #fcc50b;
+        --primary: #f9f5de;
+        --primary-hover: #fee285;
         --primary-focus: rgba(255, 179, 0, 0.25);
         --primary-inverse: rgba(0, 0, 0, 0.75);
         --background-color: #f5f4f3;
@@ -31,8 +31,8 @@
 /* Amber Dark scheme (Forced) */
 /* Enabled if forced with data-theme="dark" */
 [data-theme="dark"] {
-    --primary: #fee285;
-    --primary-hover: #fcc50b;
+    --primary: #f9f5de;
+    --primary-hover: #fee285;
     --primary-focus: rgba(255, 179, 0, 0.25);
     --primary-inverse: rgba(0, 0, 0, 0.75);
     --background-color: #f5f4f3;
@@ -62,7 +62,7 @@
     grid-auto-flow: column;
     gap: 20px;
     padding: 16px 0;
-    margin: 0 0 16px 0;
+    margin: 0;
 }
 .khoj-footer {
     margin: 16px 0 0 0;