From 7828ef2648cfc8f510509c1679c75f5e662f69cf Mon Sep 17 00:00:00 2001
From: Eli Bosley <ekbosley@gmail.com>
Date: Wed, 18 Dec 2024 12:59:25 -0500
Subject: [PATCH] feat: use text-secondary-foreground instead of gray

---
 web/components/Notifications/Item.vue | 2 +-
 web/components/Notifications/List.vue | 2 +-
 web/store/theme.ts                    | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/web/components/Notifications/Item.vue b/web/components/Notifications/Item.vue
index 3f834b0b6..e4c6088a8 100644
--- a/web/components/Notifications/Item.vue
+++ b/web/components/Notifications/Item.vue
@@ -100,7 +100,7 @@ const reformattedTimestamp = computed<string>(() => {
         class="shrink-0 flex flex-row items-baseline justify-end gap-2 mt-1"
         :title="formattedTimestamp ?? reformattedTimestamp"
       >
-        <p class="text-gray-500 text-sm">{{ reformattedTimestamp }}</p>
+        <p class="text-secondary-foreground text-sm">{{ reformattedTimestamp }}</p>
       </div>
     </header>
 
diff --git a/web/components/Notifications/List.vue b/web/components/Notifications/List.vue
index 6dbbf1dce..1114df3ea 100644
--- a/web/components/Notifications/List.vue
+++ b/web/components/Notifications/List.vue
@@ -80,7 +80,7 @@ async function onLoadMore() {
     <div v-if="loading" class="py-5 grid place-content-center">
       <LoadingSpinner />
     </div>
-    <div v-if="!canLoadMore" class="py-5 grid place-content-center text-gray-500">
+    <div v-if="!canLoadMore" class="py-5 grid place-content-center text-secondary-foreground">
       You've reached the end...
     </div>
   </div>
diff --git a/web/store/theme.ts b/web/store/theme.ts
index 906c9a89c..aa064cac0 100644
--- a/web/store/theme.ts
+++ b/web/store/theme.ts
@@ -37,7 +37,7 @@ export const defaultColors: Record<string, ThemeVariables> = {
     '--primary': '24 100% 50%',
     '--primary-foreground': '0 0% 98%',
     '--secondary': '0 0% 14.9%',
-    '--secondary-foreground': '0 0% 98%',
+    '--secondary-foreground': '0 0% 77%',
     '--accent': '0 0% 14.9%',
     '--accent-foreground': '0 0% 98%',
     '--destructive': '0 62.8% 30.6%',
@@ -61,7 +61,7 @@ export const defaultColors: Record<string, ThemeVariables> = {
     '--primary': '24 100% 50%',
     '--primary-foreground': '0 0% 98%',
     '--secondary': '0 0% 96.1%',
-    '--secondary-foreground': '0 0% 9%',
+    '--secondary-foreground': '0 0% 45%',
     '--accent': '0 0% 96.1%',
     '--accent-foreground': '0 0% 9%',
     '--destructive': '0 84.2% 60.2%',