fix(web): align replay and landing page to Terminal (base16-eighties) palette

Replay viewer was using the old midnight-purple palette. Both pages now
use the exact color tokens from ui_theme.rs — matching the desktop and
Android app exactly.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
funman300
2026-05-13 16:23:16 -07:00
parent 00f2d890f1
commit feb581005c
2 changed files with 25 additions and 23 deletions
+1 -1
View File
@@ -14,7 +14,7 @@
--bg: #151515; --bg: #151515;
--panel: #202020; --panel: #202020;
--panel-hi: #2a2a2a; --panel-hi: #2a2a2a;
--border: rgba(255,255,255,0.07); --border: #353535;
--text: #d0d0d0; --text: #d0d0d0;
--text-muted: #a0a0a0; --text-muted: #a0a0a0;
--accent: #a54242; --accent: #a54242;
+24 -22
View File
@@ -1,19 +1,21 @@
/* Solitaire Quest replay viewer — palette mirrors the desktop client's /* Solitaire Quest replay viewer — Terminal (base16-eighties) palette,
midnight-purple Balatro tone (BG_BASE = #1A0F2E) and the dark felt matching the Bevy desktop/Android app's ui_theme.rs tokens exactly. */
from the engine's TABLE_COLOUR. */
:root { :root {
--bg: #0f0a1f; --bg: #151515;
--felt: #0f4c30; --felt: #0f5232;
--panel: #1a0f2e; --panel: #202020;
--panel-hi: #2d1b69; --panel-hi: #2a2a2a;
--text: #f5f0ff; --text: #d0d0d0;
--text-muted: #b5a8d5; --text-muted: #a0a0a0;
--accent: #ffd23f; --accent: #a54242;
--red: #cc3344; --accent-hi: #c25e5e;
--black: #1a0f2e; --red: #fb9fb1;
--card-bg: #ffffff; --black: #151515;
--card-border: #ccc; --success: #acc267;
--warning: #ddb26f;
--card-bg: #f8f5f0;
--card-border: #c8b8a0;
--card-w: 80px; --card-w: 80px;
--card-h: 112px; --card-h: 112px;
--gap: 12px; --gap: 12px;
@@ -114,13 +116,13 @@ main {
background: background:
repeating-linear-gradient( repeating-linear-gradient(
45deg, 45deg,
#482f97 0, #2a2a2a 0,
#482f97 6px, #2a2a2a 6px,
#2d1b69 6px, #202020 6px,
#2d1b69 12px #202020 12px
); );
color: transparent; color: transparent;
border-color: #4a3a8a; border-color: #353535;
} }
.card .corner { .card .corner {
@@ -162,8 +164,8 @@ main {
} }
#controls button:hover:not(:disabled) { #controls button:hover:not(:disabled) {
background: var(--accent); background: var(--accent-hi);
color: var(--black); color: var(--text);
} }
#controls button:disabled { #controls button:disabled {
@@ -178,6 +180,6 @@ main {
} }
#status #result.win { #status #result.win {
color: var(--accent); color: var(--success);
font-weight: 600; font-weight: 600;
} }