WO-TF-013. Bring the coffee theme up to the frozen OVERRIDE-CONTRACT: - 49 mandatory builtin overrides in templates/overrides/coffee/ (chrome, marketing, primitives, commerce/local, blog family, auth surface, page-suggestions), each re-skinned in cafe/roastery chrome over the builtin data model. Legacy button/heading/image/text field reads updated to the new builtin contract (link/label/style, media/text). - Signature moves: chalkboard menu panel (menu-list), hand-drawn doodle dividers, torn-paper edges, kraft-tag stamped buttons, circular roast stamps, hours "today" highlight. Semantic tokens only; CSS-first motion with prefers-reduced-motion fallbacks. - 7 page templates: default, landing, article, full-width, blog-index, contact, auth. - Blocks rework: deleted the five builtin-duplicating theme blocks (menu_board, hours_strip, location_card, footer, doodle_divider) — now overrides. Kept/added 4 persona blocks: featured_pour, roast_profile, loyalty_card, brew_guide. - 5 dual-mode presets (mode "both"), all 19 tokens, light and dark tuned. - Bundled Fraunces / Work Sans / Caveat woff2 (OFL, latin subset, license recorded); fonts.json populated; all font-family via var(--font-*). Updated RECOMMENDED_FONTS.md, added RECOMMENDED_ICONS.md; required_icon_packs declared. - Themed email-safe wrapper retained (tables, inline styles). - Master pages rebuilt on builtin keys. Demo seed (demo:true): home, about, blog + 3 posts, contact (form + contact_submissions data table + row_inserted email-admins workflow), login. Cafe voice. make (codeless build + verify) and check-safety both exit 0. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2.4 KiB
Coffee — Recommended fonts
The Coffee theme bundles its type as woff2 in assets/fonts/ (latin
subsets, SIL Open Font License 1.1 — see assets/fonts/OFL.txt). The three
families become source=template rows in the fonts table and are selectable
in the admin typography picker. Templates always resolve font families through
the BlockNinja CSS variables --font-heading, --font-body, --font-mono
with the fallback stacks defined in the theme CSS — no family is hardcoded.
Bundled families
| Slot | Family | Weights | Role |
|---|---|---|---|
| Heading | Fraunces | 400, 600 | Ligature-rich display serif for headings and prices. Warm, hand-cut character. |
| Body | Work Sans | 400, 600 | Relaxed grotesque for long copy at 17px+. Reads well on cream and espresso backgrounds. |
| Accent | Caveat | 400, 700 | Hand-drawn script for badges, stamps, and doodle captions. |
Mono is intentionally not bundled: prices and tabular figures fall back to
"JetBrains Mono", ..., monospace via --font-mono. Assign a mono family from
the Google Fonts tab if you want a specific face.
Default behaviour (no admin picks)
On a fresh install the admin has not assigned any slot, so --font-heading /
--font-body / --font-mono are unset and the CSS fallbacks apply. Because the
bundled families emit @font-face from the fonts table, the fallbacks resolve
to the bundled woff2:
- Headings render in Fraunces.
- Body renders in Work Sans.
- Hand-drawn accents (
.coffee-hand) render in Caveat.
How to change
- Open admin → Theme → Typography.
- Pick a family per slot (bundled families appear as Template fonts; the Google Fonts tab offers ~50 more).
- Assign to Heading / Body / Mono and save.
Note: the platform exposes three controllable slots. The hand-drawn accent
utility resolves through --font-heading (falling back to Caveat), so if you
deliberately change the heading font the badge accents follow it — that is the
three-slot model working as intended.
Fallback stacks (theme CSS)
--coffee-heading-fallback:"Fraunces", "Playfair Display", Georgia, "Times New Roman", serif--coffee-body-fallback:"Work Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif--coffee-hand-fallback:"Caveat", "Segoe Print", "Bradley Hand", cursive--coffee-mono-fallback:"JetBrains Mono", "Fira Code", Menlo, Consolas, monospace