DeCentN2Madness/aia-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(typography): standardize eyebrow labels across page shells

Browse Source 
- consolidate the shared eyebrow label styling into the global typography layer
- replace the old script-label usage in page hero, home hero, FAQ, and team shells
- keep the next heading flush under the label across all affected page types
This commit is contained in:
DeCentN2Madness
2026-06-20 12:05:24 -07:00
parent 9398321fac
commit a048d395f7
5 changed files with 22 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
www/src/styles/typography.css
+14 -6
View File
@@ -3,18 +3,26 @@
@font-face { font-family: Rubik; src: url('/assets/fonts/Rubik/regular.woff2') format('woff2'); font-display: swap; }
@font-face { font-family: Rubik; src: url('/assets/fonts/Rubik/700.woff2') format('woff2'); font-weight: 700; font-display: swap; }
body { color: var(--color-text); font-family: var(--font-body); font-size: 16px; line-height: 1.625; }
h1, h2, h3 { color: var(--color-primary); font-family: var(--font-heading); line-height: 1.15; text-wrap: balance; }
h1, h2, h3, h4 { color: var(--color-primary); font-family: var(--font-heading); line-height: 1.15; text-wrap: balance; }
.no-balance { text-wrap: auto; }
h1 { font-size: clamp(2.5rem, 5vw, 3rem); line-height: 1.12; margin: 0 0 var(--space-md); }
h2 { font-size: clamp(2rem, 4vw, 2.4rem); line-height: 1.25; }
h3 { font-size: clamp(1.5rem, 3vw, 2rem); }
h3 { font-size: clamp(1.8rem, 3.4vw, 2rem); }
h4 { font-size: clamp(1.5rem, 3vw, 1.8rem); }
a, a:visited { color: var(--color-accent-strong); text-decoration: none; }
a:hover, a:active { color: var(--color-accent); }
a.button { color: var(--color-primary) }
.eyebrow { color: var(--color-secondary); font-size: .8rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.lede, .hero-copy { color: var(--color-muted); font-size: 1.25rem; }
.script-label { color: var(--color-accent-strong); font-family: var(--font-accent); font-size: 2rem; margin: 0; }
.script-label + h2 { margin-top: 0; }
.eyebrow {
margin: 0;
color: var(--color-accent-strong);
font-family: var(--font-accent);
font-size: 2rem;
}
.eyebrow + :is(h1, h2, h3, h4, h5, h6) {
margin-block-start: 0;
}
.prose :where(ul, ol) {
margin-block: 0 1.5rem;