fix: hero lockup — Fenja wordmark scale and colour

This commit is contained in:
Jonathan 2026-04-19 20:44:57 +02:00
parent 6cbab5ba36
commit f6e6fb255d

View file

@ -26,8 +26,8 @@ const alignClass = `lockup--${alignment}`;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.lockup--left { align-items: flex-start; text-align: left; } .lockup--left { align-items: flex-start; text-align: left; }
.lockup--center { align-items: center; text-align: center; } .lockup--center { align-items: center; text-align: center; }
/* ── Project name ────────────────────────────────────────────────── */ /* ── Project name ────────────────────────────────────────────────── */
.lockup-name { .lockup-name {
@ -38,30 +38,32 @@ const alignClass = `lockup--${alignment}`;
margin: 0; margin: 0;
} }
.lockup-regular { font-weight: 400; font-style: normal; } .lockup-regular { font-weight: 400; font-style: normal; }
.lockup-bold-italic { font-weight: 700; font-style: italic; } .lockup-bold-italic { font-weight: 700; font-style: italic; }
.lockup-period { font-weight: 700; font-style: italic; } .lockup-period { font-weight: 700; font-style: italic; }
/* ── Sizes ───────────────────────────────────────────────────────── */ /* ── Sizes ───────────────────────────────────────────────────────── */
.lockup--hero .lockup-name { font-size: var(--text-display-lg); } .lockup--hero .lockup-name { font-size: var(--text-display-lg); }
.lockup--lg .lockup-name { font-size: var(--text-display-md); } .lockup--lg .lockup-name { font-size: var(--text-display-md); }
.lockup--md .lockup-name { font-size: var(--text-headline-lg); } .lockup--md .lockup-name { font-size: var(--text-headline-lg); }
/* ── Fenja wordmark ──────────────────────────────────────────────── */ /* ── Fenja wordmark — authorship signature, never auxiliary ─────── */
.lockup-wordmark-row { .lockup-wordmark-row {
display: flex; display: flex;
align-items: center; align-items: center;
} }
/* Spacing: deliberate gap between headline and signature */
.lockup--hero .lockup-wordmark-row { margin-top: var(--space-5); } .lockup--hero .lockup-wordmark-row { margin-top: var(--space-5); }
.lockup--lg .lockup-wordmark-row { margin-top: var(--space-4); } .lockup--lg .lockup-wordmark-row { margin-top: var(--space-4); }
.lockup--md .lockup-wordmark-row { margin-top: var(--space-3); } .lockup--md .lockup-wordmark-row { margin-top: var(--space-4); }
/* Sizes: ~1/4 the headline's line height at each scale. Full colour — no opacity. */
.lockup-wordmark { .lockup-wordmark {
opacity: 0.45;
display: block; display: block;
width: auto;
} }
.lockup--hero .lockup-wordmark { height: 18px; } .lockup--hero .lockup-wordmark { height: 30px; }
.lockup--lg .lockup-wordmark { height: 16px; } .lockup--lg .lockup-wordmark { height: 24px; }
.lockup--md .lockup-wordmark { height: 14px; } .lockup--md .lockup-wordmark { height: 20px; }
</style> </style>