From 7575079da96a70eb00272e6273b90a10b02da0f0 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 28 Feb 2024 22:28:15 +0200
Subject: [PATCH] fix badge-notificaiton color in favicon and notifications

---
 src/components/badge.style.js                 |  6 ++++++
 src/components/chat_message/chat_message.scss |  8 ++------
 src/components/root.style.js                  | 16 +++++++++++++++-
 3 files changed, 23 insertions(+), 7 deletions(-)

diff --git a/src/components/badge.style.js b/src/components/badge.style.js
index 37833cdb06..0697cac6c4 100644
--- a/src/components/badge.style.js
+++ b/src/components/badge.style.js
@@ -9,6 +9,12 @@ export default {
     notification: '.-notification'
   },
   defaultRules: [
+    {
+      component: 'Root',
+      directives: {
+        '--badgeNotification': 'color | --cRed'
+      }
+    },
     {
       directives: {
         background: '--cGreen'
diff --git a/src/components/chat_message/chat_message.scss b/src/components/chat_message/chat_message.scss
index 18eb610b7d..f7254ea351 100644
--- a/src/components/chat_message/chat_message.scss
+++ b/src/components/chat_message/chat_message.scss
@@ -1,5 +1,3 @@
-@import "../../variables";
-
 .chat-message-wrapper {
   &.hovered-message-chain {
     .animated.Avatar {
@@ -93,8 +91,7 @@
   .error {
     .status-content.media-body,
     .created-at {
-      color: $fallback--cRed;
-      color: var(--badgeNotification, $fallback--cRed);
+      color: var(--badgeNotification);
     }
   }
 
@@ -146,6 +143,5 @@
   margin: 1.4em 0;
   font-size: 0.9em;
   user-select: none;
-  color: $fallback--text;
-  color: var(--faintedText, $fallback--text);
+  color: var(--textFaint);
 }
diff --git a/src/components/root.style.js b/src/components/root.style.js
index 53777a4bfe..40c53172a8 100644
--- a/src/components/root.style.js
+++ b/src/components/root.style.js
@@ -15,9 +15,23 @@ export default {
   defaultRules: [
     {
       directives: {
+        // These are here just to establish order,
+        // themes should override those
+        '--bg': 'color | #121a24',
+        '--fg': 'color | #182230',
+        '--text': 'color | #b9b9ba',
+        '--link': 'color | #d8a070',
+        '--cRed': 'color | #FF0000',
+        '--cBlue': 'color | #0095ff',
+        '--cGreen': 'color | #0fa00f',
+        '--cOrange': 'color | #ffa500',
+
+        // Fonts
         '--font': 'generic | sans-serif',
         '--monoFont': 'generic | monospace',
-        '--bg': 'color | #000000', // just to establish order
+
+        // Fallback no-background-image color
+        // (also useful in some other places like scrollbars)
         '--wallpaper': 'color | --bg, -2'
       }
     }