fix light mode by changing css

This commit is contained in:
ld3zian 2025-01-26 11:04:32 -07:00
parent 23c62495eb
commit db585307f5
3 changed files with 21 additions and 6 deletions

View file

@ -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}

View file

@ -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 {

View file

@ -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