User wanted the testimonial section to feel "of the page" rather than
a card sitting on top of it, and to occupy less vertical space.
- Strip all chrome from .card--testimonial: transparent background,
no border, no shadow, no hover lift. Same treatment applied in the
swiss + cosmos overrides so per-theme backgrounds don't sneak back.
- Restructure the carousel markup to put the prev/next buttons
directly beside the viewport (carousel--inline = flex row), no
separate controls block, no dot indicators.
- Shrink the curly quote mark and the avatar (44 -> 32px); tighten
internal gaps. Removed the rule above the attribution row.
- Keep healthy horizontal padding via clamp() so the arrows don't
crowd the surrounding sections.
- Update aria-label on the carousel itself instead of the dots so
screen readers still get position context.
New `type: "testimonial"` with structured attribution
(quote/name/role/org/url/image/date) plus a `layout: "testimonials"`
section behavior that renders the items as a tasteful crossfade
carousel — one quote at a time, 7s auto-advance, prev/next nav, dot
indicators, swipe support, ←/→ keys, pause on hover/focus, ARIA
live region.
Reduced-motion users automatically get .carousel--stacked: every
testimonial visible at once, controls hidden, no auto-advance. A
single-item section also skips the carousel chrome.
Per-template treatment: editorial uses Fraunces italic for the curly
quote mark and the body, swiss strips uppercase from titles per prior
fix, cosmos glows the mark with the cyan/violet accent stack.
Section auto-detects the layout when the first item is a testimonial,
matching how the clients layout already works.
Swiss: drop all-caps on titles, soften heavy ink borders to muted rules
or remove them where background contrast carries the form, balance hero
name weights (smaller lighter first name vs heavier italic last name),
fix unreadable white description text on portfolio hover.
Editorial: enlarge the section "No" mark and set it in italic Fraunces so
it reads as typography instead of a tick, swap the first name into DM
Serif Display for a different J, sharpen the section number caption.
Client tile: contain custom logos at 86% so wide marks like
"The Cooperative Way" stop getting cropped to "operative".
New: optional `date` field on every item type (link/card/portfolio/
youtube/client). Accepts YYYY, YYYY-MM, or YYYY-MM-DD. Rendered
human-friendly with the raw ISO preserved in <time datetime>.
Documented in README and demonstrated in links.example.json.
A hand-rolled linktree alternative — pure static HTML/CSS/JS, no build
step. Drop on any shared host via SFTP and edit data/links.json to update.
Features
- File-driven content via data/links.json (links, projects, YouTube,
client tiles, portfolio pieces)
- Two interchangeable templates: editorial (Fraunces + paper + vermilion)
and swiss (Archivo grotesque, all-caps poster)
- Auto/light/dark theme toggle with no-flash boot script
- Auto-fetched favicons via Google S2 (with image-URL override)
- Lazy YouTube facades (no third-party JS until clicked)
- Adaptive client-logo grid
- Scroll-triggered reveal animations
- ~40 KB total payload, ~12 KB gzipped
The repo ships links.example.json as a demo; data/links.json is
gitignored so personal content stays out of the public repo.
