v0.8: self-hosted fonts replace the Google Fonts CDN link

index.html now loads /api/fonts/fonts.css, synthesized at request time
by goods-editor's mountEditorApi from the host's fonts/ directory
(populated via fetch-fonts in goods-editor-module — the host-local
fetch script shrinks to a pointer). Shipped synchronously in <head>
on purpose: the module's runtime injector races first paint and the
editor's text measurement gives wrong answers against fallback
metrics until real fonts load.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
khalid@traclabs.com
2026-09-01 23:29:04 -05:00
parent 6599a5e68f
commit dfa1f90a16
2 changed files with 40 additions and 141 deletions

View File

@@ -6,9 +6,25 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="theme-color" content="#fdf2f4" />
<title>Pawfectly Yours — Customize Your Shirt</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700&family=Bebas+Neue&family=Caveat:wght@400;600;700&family=DM+Sans:wght@400;500;700&family=Fira+Sans:wght@400;500;600;700&family=Lato:wght@400;700&family=Lora:wght@400;500;600;700&family=Merriweather:wght@400;700&family=Montserrat:wght@400;600;700&family=Nunito:wght@400;500;600;700;800&family=Open+Sans:wght@400;600;700&family=Oswald:wght@400;500;700&family=Pacifico&family=Playfair+Display:wght@400;600;700&family=Poppins:wght@400;500;600;700&family=Raleway:wght@400;600;700&family=Roboto:wght@400;500;700&family=Roboto+Condensed:wght@400;700&family=Roboto+Slab:wght@400;700&family=Rubik:wght@400;500;600;700&family=Source+Sans+3:wght@400;600;700&family=Space+Mono:wght@400;700&family=Ubuntu:wght@400;500;700&family=Work+Sans:wght@400;500;600;700&display=swap" rel="stylesheet">
<!--
Fonts are served by the goods-editor module from the host's fonts/
directory (populated by `npm run fetch-fonts` in goods-editor-module).
mountEditorApi synthesizes the @font-face rules at request time
based on whatever .ttf/.otf/.woff2/.woff files are present, so
adding a font is a "drop file + restart" workflow with no code
change here. See goods-editor-module/src/server/fontRegistry.js
for the generator.
We deliberately ship this synchronously in <head> rather than
letting the module inject a <link> at mount time: the module's
runtime injector races first paint, and the editor's font-
dependent text measurement (`measureTextWidth`) gives wrong
answers against fallback metrics until the fonts load. The
host pays a tiny extra TTFB to make first paint correct.
<ApparelDesigner loadFonts={false}> in App.jsx / CustomizeRoute
tells the module not to also inject its own runtime tag.
-->
<link rel="stylesheet" href="/api/fonts/fonts.css">
</head>
<body>
<div id="root"></div>