thejayman77/upbeatBytes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

/onthisday: year back to green, "IN HISTORY" top-aligned beside big "2013"

Browse Source 
Per Jay: only the eyebrow was meant to go clay — the year stays GREEN to match
the date (both greens on the line tie in the green Read-more button). Layout is
now "IN HISTORY" top-aligned to the left of a large Playfair "2013", not stacked.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
jay
2026-06-26 20:19:53 -04:00
parent d969810c10
commit aa8ee674d5
1 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/routes/onthisday/+page.svelte
+5 -4
View File
@@ -127,10 +127,11 @@
.dl-rule { flex: 1 1 30px; min-width: 24px; height: 1.5px; margin-bottom: 7px; background: rgba(70, 120, 90, 0.26); }
.dl-label { font-family: 'Hanken Grotesk', sans-serif; font-weight: 700; font-size: clamp(14px, 1.7vw, 17px); letter-spacing: 0.1em; text-transform: uppercase; color: #2c5d44; margin-bottom: 5px; }
/* year lives here (off the image) — plain stacked type, no bubble; echoes the homepage card's brown */
.year-block { display: flex; flex-direction: column; flex: none; line-height: 1; }
.yb-label { font-family: 'Hanken Grotesk', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: #b06a45; }
.yb-year { font-family: 'Playfair Display', Georgia, serif; font-weight: 700; font-size: clamp(32px, 5.5vw, 44px); line-height: 0.92; color: #7a4a30; margin-top: 4px; }
/* year lives here (off the image) — "IN HISTORY" top-aligned beside a big "2013".
Green (matching the date) so both greens on this line tie in the green Read-more button. */
.year-block { display: inline-flex; align-items: flex-start; gap: 11px; flex: none; }
.yb-label { font-family: 'Hanken Grotesk', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: #3a7d5b; line-height: 1; margin-top: 4px; }
.yb-year { font-family: 'Playfair Display', Georgia, serif; font-weight: 700; font-size: clamp(34px, 5.5vw, 46px); line-height: 0.86; color: #2c5d44; }
.hero {
position: relative; border-radius: 12px; overflow: hidden; background: #21392e;