block/themes-terminal
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(fonts): bundle JetBrains Mono + IBM Plex Mono via @font-face + preset typography refs

Browse Source 
The host does not consume bundled_fonts (LoadedPlugin.BundledFonts is dead
code), so declare @font-face against the served /templates/terminal/fonts/
paths and point each preset's typography.fontHeading/body/mono at
template:terminal:<Family>. Mono faces now render instead of fallback sans.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Alex Dunmow 2026-07-06 21:23:53 +08:00
parent 0e51058af0
commit 1bab4171a9
2 changed files with 36 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
manifest.yaml
View File

@ -117,6 +117,17 @@ css:
Dual-mode: light = paper teletype, dark = phosphor CRT. Dual-mode: light = paper teletype, dark = phosphor CRT.
============================================================ */ ============================================================ */
/* Bundled mono faces. The host does not yet emit @font-face for
* bundled_fonts (LoadedPlugin.BundledFonts is unconsumed), so the theme
* declares its own faces against the served artifact paths
* (/templates/terminal/fonts/...). Presets set typography.fontHeading/
* body/mono to template:terminal:<Family> so --font-heading/body/mono
* resolve to these families. JetBrains Mono is one variable-weight file
* (400–700); IBM Plex Mono ships 400 + 500. */
@font-face { font-family: 'JetBrains Mono'; src: url('/templates/terminal/fonts/jetbrains-mono-latin.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Mono'; src: url('/templates/terminal/fonts/ibm-plex-mono-400.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Mono'; src: url('/templates/terminal/fonts/ibm-plex-mono-500.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
/* --- Globals: square corners, mono stack ------------------ */ /* --- Globals: square corners, mono stack ------------------ */
:root { --radius: 0; } :root { --radius: 0; }

25
presets.json
View File

@ -5,6 +5,11 @@
"description": "Green printer-ribbon on paper for light, VT220 green phosphor for dark. The flagship terminal look.", "description": "Green printer-ribbon on paper for light, VT220 green phosphor for dark. The flagship terminal look.",
"theme": { "theme": {
"mode": "both", "mode": "both",
"typography": {
"fontHeading": "template:terminal:JetBrains Mono",
"fontBody": "template:terminal:IBM Plex Mono",
"fontMono": "template:terminal:JetBrains Mono"
},
"lightColors": { "lightColors": {
"background": "60 20% 97%", "background": "60 20% 97%",
"foreground": "120 30% 12%", "foreground": "120 30% 12%",
@ -55,6 +60,11 @@
"description": "Warm cream paper with amber ribbon for light, amber phosphor on warm black for dark.", "description": "Warm cream paper with amber ribbon for light, amber phosphor on warm black for dark.",
"theme": { "theme": {
"mode": "both", "mode": "both",
"typography": {
"fontHeading": "template:terminal:JetBrains Mono",
"fontBody": "template:terminal:IBM Plex Mono",
"fontMono": "template:terminal:JetBrains Mono"
},
"lightColors": { "lightColors": {
"background": "40 30% 96%", "background": "40 30% 96%",
"foreground": "30 25% 15%", "foreground": "30 25% 15%",
@ -105,6 +115,11 @@
"description": "Crisp black-on-white docs for light with a blue link accent, hard white on black for dark. Austere, no glow.", "description": "Crisp black-on-white docs for light with a blue link accent, hard white on black for dark. Austere, no glow.",
"theme": { "theme": {
"mode": "both", "mode": "both",
"typography": {
"fontHeading": "template:terminal:JetBrains Mono",
"fontBody": "template:terminal:IBM Plex Mono",
"fontMono": "template:terminal:JetBrains Mono"
},
"lightColors": { "lightColors": {
"background": "0 0% 100%", "background": "0 0% 100%",
"foreground": "0 0% 10%", "foreground": "0 0% 10%",
@ -155,6 +170,11 @@
"description": "Cool slate-on-white for light with a teal accent, cyan phosphor on blue-black for dark.", "description": "Cool slate-on-white for light with a teal accent, cyan phosphor on blue-black for dark.",
"theme": { "theme": {
"mode": "both", "mode": "both",
"typography": {
"fontHeading": "template:terminal:JetBrains Mono",
"fontBody": "template:terminal:IBM Plex Mono",
"fontMono": "template:terminal:JetBrains Mono"
},
"lightColors": { "lightColors": {
"background": "200 30% 97%", "background": "200 30% 97%",
"foreground": "200 40% 14%", "foreground": "200 40% 14%",
@ -205,6 +225,11 @@
"description": "Ink-on-white with a magenta accent for light, magenta phosphor on black for dark.", "description": "Ink-on-white with a magenta accent for light, magenta phosphor on black for dark.",
"theme": { "theme": {
"mode": "both", "mode": "both",
"typography": {
"fontHeading": "template:terminal:JetBrains Mono",
"fontBody": "template:terminal:IBM Plex Mono",
"fontMono": "template:terminal:JetBrains Mono"
},
"lightColors": { "lightColors": {
"background": "320 20% 98%", "background": "320 20% 98%",
"foreground": "320 30% 14%", "foreground": "320 30% 14%",