11c6c8c63e
Bootstrapped during the 2026-06-06 BlockNinja consolidation. Was previously an unversioned directory inside ~/src/blockninja-themes/coffee. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
50 lines
2.4 KiB
Markdown
50 lines
2.4 KiB
Markdown
# Coffee — Recommended fonts
|
|
|
|
The Coffee theme ships `fonts.json = []` per the wave-1
|
|
[FONTS.md](../docs/FONTS.md) policy. No woff2s are bundled in this pass.
|
|
Templates resolve font families through the BlockNinja CSS variables
|
|
`--font-heading`, `--font-body`, and `--font-mono` with the fallback stacks
|
|
defined in `assets/style.css`. The site admin assigns fonts in the
|
|
typography panel; the picks below are the spec-aligned defaults that match
|
|
the visual identity.
|
|
|
|
## How to apply
|
|
|
|
1. Open the admin → Theme → Typography panel.
|
|
2. Switch to the **Google Fonts** tab.
|
|
3. Search and pick each family below.
|
|
4. Assign to the matching slot (Heading / Body / Mono).
|
|
5. Save. The picks are persisted as `google:<Family>` and rendered as
|
|
`@import` URLs by `theme.GenerateCSS()`.
|
|
|
|
## Picks
|
|
|
|
| Slot | Source | Family | Why |
|
|
|----------|------------------|------------------|-----|
|
|
| Heading | `google:Fraunces` | Fraunces | Ligature-rich display serif. Italic stylistic alternates land on h2/h3 headings; pairs with the spec's "Quentin Blake ink lines" aesthetic. |
|
|
| Body | `google:Inter` | Inter | Relaxed body sans for long copy at 17px+. Excellent screen rendering across cream and espresso backgrounds. |
|
|
| Mono | `google:JetBrains Mono` | JetBrains Mono | Tabular-numerals mono for prices in `menu_board` and `featured_pour`, and hours in `hours_strip`. |
|
|
|
|
All three are already in the curated Google Fonts list in the picker and
|
|
have permissive SIL OFL 1.1 licences.
|
|
|
|
## Fallback stacks (used before admin picks fonts)
|
|
|
|
Defined in `assets/style.css`:
|
|
|
|
- `--coffee-heading-fallback`: `"Fraunces", "Playfair Display", Georgia, "Times New Roman", serif`
|
|
- `--coffee-body-fallback`: `"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`
|
|
- `--coffee-mono-fallback`: `"JetBrains Mono", "Fira Code", Menlo, Consolas, monospace`
|
|
|
|
Templates always consume the variable form, e.g.
|
|
`font-family: var(--font-heading, var(--coffee-heading-fallback))`.
|
|
|
|
## Wave-2 follow-up
|
|
|
|
If/when bundling becomes necessary (offline-first deployments, brand
|
|
exclusivity), commission/license the spec's exact Fraunces weights
|
|
(Regular 400, SemiBold 600, BoldItalic 700), Inter (Regular 400, Medium
|
|
500), and JetBrains Mono (Regular 400), and re-populate `fonts.json` per
|
|
[FONTS.md §"fonts.json schema"](../docs/FONTS.md). A `LICENSES.md` at the
|
|
theme root must also land in that pass.
|