From db585307f55334a2116571a5437b7fbfa08b0971 Mon Sep 17 00:00:00 2001
From: ld3zian <42660576+ld3z@users.noreply.github.com>
Date: Sun, 26 Jan 2025 11:04:32 -0700
Subject: [PATCH] fix light mode by changing css

---
 src/components/TypeFilter.astro             |  4 ++--
 src/layouts/Layout.astro                    | 15 +++++++++++++++
 src/pages/[lang]/[contentType]/[type].astro |  8 ++++----
 3 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/src/components/TypeFilter.astro b/src/components/TypeFilter.astro
index 8ea63d3..edd2cbe 100644
--- a/src/components/TypeFilter.astro
+++ b/src/components/TypeFilter.astro
@@ -21,8 +21,8 @@ const types = [
       href={`/${lang}/${contentType}/${type.id}`}
       class={`px-4 py-2 rounded-lg text-sm font-medium transition-colors ${
         currentType === type.id
-          ? 'bg-accent text-white'
-          : 'bg-secondary text-primary/80 hover:bg-hover'
+          ? 'bg-[rgb(var(--accent-bg))] text-[rgb(var(--accent-text))]'
+          : 'bg-secondary text-primary hover:bg-hover'
       }`}
     >
       {type.label}
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 9d812e1..a3a3968 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -66,6 +66,11 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site ?? 'https://comick-r
     --bg-secondary: #f0f0f0;
     --bg-hover: #e0e0e0;
     --text-color: #13151a;
+    --accent: 89, 0, 255;        /* Brighter, more saturated purple */
+    --accent-light: 124, 58, 237;
+    --accent-dark: 76, 29, 149;
+    --accent-bg: 89, 0, 255;     /* Same as accent for bg */
+    --accent-text: 255, 255, 255; /* White text for contrast */
   }
 
   /* Dark theme */
@@ -74,6 +79,11 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site ?? 'https://comick-r
     --bg-secondary: #23262d;
     --bg-hover: #2a2d35;
     --text-color: #ffffff;
+    --accent: 136, 58, 234;
+    --accent-light: 224, 204, 250;
+    --accent-dark: 49, 10, 101;
+    --accent-bg: 136, 58, 234;    /* Same as accent for bg */
+    --accent-text: 255, 255, 255; /* White text for contrast */
   }
 
   /* Default to dark theme if no data-theme is set */
@@ -82,6 +92,11 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site ?? 'https://comick-r
     --bg-secondary: #23262d;
     --bg-hover: #2a2d35;
     --text-color: #ffffff;
+    --accent: 136, 58, 234;
+    --accent-light: 224, 204, 250;
+    --accent-dark: 49, 10, 101;
+    --accent-bg: 136, 58, 234;
+    --accent-text: 255, 255, 255;
   }
 
   html {
diff --git a/src/pages/[lang]/[contentType]/[type].astro b/src/pages/[lang]/[contentType]/[type].astro
index 0eca550..8b2b16c 100644
--- a/src/pages/[lang]/[contentType]/[type].astro
+++ b/src/pages/[lang]/[contentType]/[type].astro
@@ -44,8 +44,8 @@ const title = `ComicK - ${getLanguageName(lang!)} ${contentType?.toUpperCase()}
               href={`/${lang}/sfw/${type}`}
               class={`px-4 py-2 rounded-lg text-sm font-medium transition-colors ${
                 contentType === 'sfw'
-                  ? 'bg-accent text-white'
-                  : 'bg-secondary text-primary/80 hover:bg-hover'
+                  ? 'bg-[rgb(var(--accent-bg))] text-[rgb(var(--accent-text))]'
+                  : 'bg-secondary text-primary hover:bg-hover'
               }`}
             >
               SFW
@@ -54,8 +54,8 @@ const title = `ComicK - ${getLanguageName(lang!)} ${contentType?.toUpperCase()}
               href={`/${lang}/nsfw/${type}`}
               class={`px-4 py-2 rounded-lg text-sm font-medium transition-colors ${
                 contentType === 'nsfw'
-                  ? 'bg-accent text-white'
-                  : 'bg-secondary text-primary/80 hover:bg-hover'
+                  ? 'bg-[rgb(var(--accent-bg))] text-[rgb(var(--accent-text))]'
+                  : 'bg-secondary text-primary hover:bg-hover'
               }`}
             >
               NSFW