feature: Dark Theme Home & About Styles

This commit is contained in:
daniel-c-harvey
2026-06-19 23:15:26 -04:00
parent aeda7e67a8
commit 77d0562b08
5 changed files with 15 additions and 16 deletions
@@ -13,7 +13,7 @@
font-family: var(--deepdrft-font-mono); font-family: var(--deepdrft-font-mono);
font-size: 0.65rem; font-size: 0.65rem;
letter-spacing: 0.28em; letter-spacing: 0.28em;
color: var(--deepdrft-green-accent); color: var(--deepdrft-green);
text-transform: uppercase; text-transform: uppercase;
margin-bottom: 1.8rem; margin-bottom: 1.8rem;
display: flex; display: flex;
@@ -27,7 +27,7 @@
display: block; display: block;
width: 2.5rem; width: 2.5rem;
height: 1px; height: 1px;
background: var(--deepdrft-green-accent); background: var(--deepdrft-green);
} }
.hero-title { .hero-title {
@@ -43,7 +43,7 @@
.hero-title em { .hero-title em {
font-style: italic; font-style: italic;
color: var(--deepdrft-green); color: var(--deepdrft-green-accent);
} }
.hero-subtitle { .hero-subtitle {
+2 -2
View File
@@ -23,8 +23,8 @@
@* ── HERO — the page opener. Reuses the .hero-* type scale with About's own words. @* ── HERO — the page opener. Reuses the .hero-* type scale with About's own words.
NOT DeepDrftHero (that hard-codes the Deep/DRFT masthead + streaming CTA). ── *@ NOT DeepDrftHero (that hard-codes the Deep/DRFT masthead + streaming CTA). ── *@
<section class="hero"> <section class="hero pb-20">
<MudGrid Spacing="0" Style="height: 100%;"> <MudGrid Spacing="0">
<MudItem xs="12" md="6"> <MudItem xs="12" md="6">
<div class="hero-left"> <div class="hero-left">
<div class="hero-eyebrow @AnimClass">Charleston, South Carolina</div> <div class="hero-eyebrow @AnimClass">Charleston, South Carolina</div>
+8 -9
View File
@@ -25,7 +25,6 @@
/* ── HERO — the page opener (type scale from Home's .hero-*) ── */ /* ── HERO — the page opener (type scale from Home's .hero-*) ── */
.hero { .hero {
min-height: 100vh;
overflow: hidden; overflow: hidden;
} }
@@ -56,7 +55,7 @@
font-family: var(--deepdrft-font-mono); font-family: var(--deepdrft-font-mono);
font-size: 0.65rem; font-size: 0.65rem;
letter-spacing: 0.28em; letter-spacing: 0.28em;
color: var(--deepdrft-green-accent); color: var(--deepdrft-green);
text-transform: uppercase; text-transform: uppercase;
margin-bottom: 1.8rem; margin-bottom: 1.8rem;
display: flex; display: flex;
@@ -70,7 +69,7 @@
display: block; display: block;
width: 2.5rem; width: 2.5rem;
height: 1px; height: 1px;
background: var(--deepdrft-green-accent); background: var(--deepdrft-green);
} }
.hero-title { .hero-title {
@@ -86,7 +85,7 @@
.hero-title em { .hero-title em {
font-style: italic; font-style: italic;
color: var(--deepdrft-green); color: var(--deepdrft-green-accent);
} }
.hero-desc { .hero-desc {
@@ -148,7 +147,7 @@
} }
.movement.is-active .rail-numeral { .movement.is-active .rail-numeral {
color: var(--deepdrft-green-accent); color: var(--deepdrft-green);
opacity: 0.95; opacity: 0.95;
} }
@@ -195,7 +194,7 @@
.wave-stroke path { .wave-stroke path {
fill: none; fill: none;
stroke: var(--deepdrft-green-accent); stroke: var(--deepdrft-green);
stroke-width: 1.4; stroke-width: 1.4;
opacity: 0.7; opacity: 0.7;
vector-effect: non-scaling-stroke; vector-effect: non-scaling-stroke;
@@ -221,7 +220,7 @@
font-family: var(--deepdrft-font-mono); font-family: var(--deepdrft-font-mono);
font-size: 0.62rem; font-size: 0.62rem;
letter-spacing: 0.28em; letter-spacing: 0.28em;
color: var(--deepdrft-green-accent); color: var(--deepdrft-green);
text-transform: uppercase; text-transform: uppercase;
margin-bottom: 1.4rem; margin-bottom: 1.4rem;
} }
@@ -237,7 +236,7 @@
.movement-title em { .movement-title em {
font-style: italic; font-style: italic;
color: var(--deepdrft-green); color: var(--deepdrft-green-accent);
} }
.movement-prose { .movement-prose {
@@ -355,7 +354,7 @@
font-family: var(--deepdrft-font-mono); font-family: var(--deepdrft-font-mono);
font-size: 0.62rem; font-size: 0.62rem;
letter-spacing: 0.28em; letter-spacing: 0.28em;
color: var(--deepdrft-green-accent); color: var(--deepdrft-green);
text-transform: uppercase; text-transform: uppercase;
margin-bottom: 1.2rem; margin-bottom: 1.2rem;
} }
+2 -2
View File
@@ -64,7 +64,7 @@
font-family: var(--deepdrft-font-mono); font-family: var(--deepdrft-font-mono);
font-size: 0.62rem; font-size: 0.62rem;
letter-spacing: 0.28em; letter-spacing: 0.28em;
color: var(--deepdrft-green-accent); color: var(--deepdrft-green);
text-transform: uppercase; text-transform: uppercase;
margin-bottom: 1.2rem; margin-bottom: 1.2rem;
} }
@@ -79,7 +79,7 @@
.section-title em { .section-title em {
font-style: italic; font-style: italic;
color: var(--deepdrft-green); color: var(--deepdrft-green-accent);
} }
/* The body column is already full height; make it a flex container that /* The body column is already full height; make it a flex container that
Binary file not shown.

Before

Width:  |  Height:  |  Size: 478 KiB

After

Width:  |  Height:  |  Size: 525 KiB