viktor/beadboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(theme): increase contrast in aurora theme surface layers

Browse source 
- Make surface layers more distinct (0f0e0d → 1a1816 → 252320 → 302e2a → 3c3934)
- Increase border visibility (18%, 35%, 55% opacity)
- Ensure header, sidebar, main content are visually distinct
This commit is contained in:
zenchantlive 2026-02-26 16:27:14 -08:00
parent a47f21e769
commit 756a1dec2b
3 changed files with 19 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/styles/themes/aurora.css
View file

@ -8,26 +8,26 @@
[data-theme="aurora"] {
/* ==========================================================================
1. SURFACE LAYERS - Warm Charcoal Scale (DISTINCT)
1. SURFACE LAYERS - Warm Charcoal Scale (MORE DISTINCT)
========================================================================== */
--surface-backdrop: #161514; /* Darkest - page background */
--surface-elevated: #0f0e0d; /* Header - darker for contrast */
--surface-primary: #1e1d1b; /* Sidebar */
--surface-secondary: #252422; /* Main content - lighter than sidebar */
--surface-tertiary: #2d2b29; /* Panels */
--surface-quaternary: #353331; /* Cards - lightest surface */
--surface-overlay: #0a0909; /* Modals */
--surface-input: #1a1917; /* Form fields */
--surface-backdrop: #0f0e0d; /* Page background - very dark */
--surface-elevated: #1a1816; /* Header - lighter than backdrop */
--surface-primary: #252320; /* Sidebar - lighter still */
--surface-secondary: #302e2a; /* Main content - distinct from sidebar */
--surface-tertiary: #3c3934; /* Panels - clearly lighter */
--surface-quaternary: #48453f; /* Cards - lightest surface */
--surface-overlay: #0a0908; /* Modals - darkest */
--surface-input: #1f1d1a; /* Form fields */
--surface-hover: rgba(240, 238, 234, 0.06);
--surface-active: rgba(53, 201, 255, 0.12);
--surface-tooltip: #1e1d1b;
/* ==========================================================================
2. BORDERS - Warm Grey (more visible)
2. BORDERS - More Visible
========================================================================== */
--border-subtle: rgba(180, 175, 165, 0.15);
--border-default: rgba(180, 175, 165, 0.28);
--border-strong: rgba(180, 175, 165, 0.45);
--border-subtle: rgba(200, 195, 185, 0.18);
--border-default: rgba(200, 195, 185, 0.35);
--border-strong: rgba(200, 195, 185, 0.55);
--border-accent: rgba(53, 201, 255, 0.55);
/* ==========================================================================