john/svsmspcalc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Light & Dark Theme Alterations

Browse Source
This commit is contained in:
John OReilly
2026-03-12 00:47:18 -04:00
parent 901b3bb116
commit 1663c69c63
4 changed files with 92 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
SVS-MSP-Calculator-light.css
View File

@@ -7,14 +7,14 @@
/* ── DESIGN TOKENS (light overrides) ───────────────────────────── */
:root {
--ink: #1a1816; /* near-black for body text */
--paper: #f4f2ed; /* warm off-white page background */
--accent: #1a6a98; /* slightly darker blue for contrast */
--muted: #6b6360; /* mid-grey for secondary text */
--border: #ccc9c3; /* light grey borders */
--card: #ebe8e2; /* off-white card background */
--green: #217045; /* darker green — accessible on white */
--amber: #a05f00; /* darker amber — accessible on white */
--ink: #2c2825; /* soft near-black — readable without harshness */
--paper: #f4f2ed; /* warm off-white page background */
--accent: #1a6a98; /* blue — good for buttons, kept full strength */
--muted: #6b6360; /* mid-grey for secondary text */
--border: #d0cdc7; /* soft warm-grey borders */
--card: #ebe8e2; /* off-white card background */
--green: #217045; /* darker green — accessible on white */
--amber: #a05f00; /* darker amber — accessible on white */
}
/* ── BODY ────────────────────────────────────────────────────────── */
@@ -30,11 +30,12 @@ body {
─────────────────────────────────────────────────────────────────── */
.top-bar {
background: #e8e4db !important;
border-bottom-color: rgba(0, 0, 0, 0.09) !important; /* replace strong blue stripe with soft warm separator */
}
/* ── SECTION CARDS ───────────────────────────────────────────────── */
.section {
background: #ffffff !important;
background: #faf9f5 !important; /* warm white — less stark than pure white on cream background */
}
/* ── CHEVRON PILL — swap white-alpha tint for dark-alpha ─────────── */
@@ -48,12 +49,12 @@ body {
/* ── SECTION HOVER / OPEN GLOW ───────────────────────────────────── */
.section:hover {
border-color: rgba(26, 106, 152, 0.3) !important;
box-shadow: -3px 0 0 0 rgba(26, 106, 152, 0.35) !important;
border-color: rgba(26, 106, 152, 0.22) !important;
box-shadow: -3px 0 0 0 rgba(26, 106, 152, 0.25) !important;
}
.sec-open {
border-color: rgba(26, 106, 152, 0.45) !important;
box-shadow: -3px 0 0 0 rgba(26, 106, 152, 0.65) !important;
border-color: rgba(26, 106, 152, 0.35) !important;
box-shadow: -3px 0 0 0 rgba(26, 106, 152, 0.45) !important;
}
/* ── CALLOUT BOXES ───────────────────────────────────────────────── */
@@ -78,7 +79,12 @@ body {
color: var(--ink) !important;
}
.addon-row.selected .addon-price {
color: var(--accent) !important;
color: var(--accent) !important; /* override dark-mode #62c5f0 */
}
/* ── FEATURE CARDS ───────────────────────────────────────────────── */
.feature-card {
background: #f0ede7 !important;
}
/* ── NUDGE BANNER ────────────────────────────────────────────────── */