fix: replace all hardcoded hex colors with CSS theme variables
CI / typecheck + build (push) Canceled after 0s
CI / deploy to VPS (push) Canceled after 0s

Phase 15c — theme-consistent color system:

Replaced 63 instances of hardcoded hex colors (#5e6ad2, #7170ff, #4f46e5,
#6a75e0, #828fff, #94a3b8, etc.) with CSS variables from globals.css:
- #5e6ad2 → var(--brand) (light: #5e6ad2, dark: #5e6ad2)
- #7170ff → var(--accent) (light: #4f46e5, dark: #7170ff)
- #4f46e5 → var(--accent)
- #6a75e0 → var(--brand-hover) (new var, light: #6a75e0, dark: #7170ff)
- #828fff → var(--accent-hover)
- #868686 → var(--text-dim)
- Dark-mode-specific hex in Markdown.tsx → CSS variables

Added --brand-hover CSS variable (light: #6a75e0, dark: #7170ff)
Added dark:prose-invert instead of prose-invert (light mode now uses
default prose theme instead of forced dark)

Files changed: 15 component files + globals.css
This commit is contained in:
asepharyana committed 2026-08-21 13:06:01 +07:00
1 parent ea75d68b1a
commit be923cb432
18 files changed
+149 -105

No files matched your search

+1 -1
View File
@@ -35,7 +35,7 @@ export default function RootLayout({
}}
/>
</head>
<body className="min-h-screen bg-[var(--bg-app)] text-[var(--text-secondary)] font-sans antialiased selection:bg-[#5e6ad2]/30 selection:text-white flex flex-col transition-colors duration-150">
<body className="min-h-screen bg-[var(--bg-app)] text-[var(--text-secondary)] font-sans antialiased selection:bg-[var(--brand)]/30 selection:text-white flex flex-col transition-colors duration-150">
<div hidden>
<div id="a11y-live-region" aria-live="polite" aria-atomic="true" />
</div>