tajniak81andClaude Opus 5
a49d48f659
The lockup was the visible symptom and the wrong suspect. Matching it to the Web App's component changed nothing a reader would notice, because the panel was not rendering Archivo at all — it was rendering system-ui's italic bold, which is a different letterform at the same size, and had been since the stylesheet was written. The Google Fonts @import sat after @import "tailwindcss". Tailwind v4 inlines its import into the rules it generates, so anything importing after it is no longer at the top of the sheet, and CSS drops an @import that follows real rules. The built stylesheet carried zero occurrences of fonts.googleapis.com; the build had been saying so on every run, in a warning easy to read as noise about a comment. Moving the font import above Tailwind's is the whole fix, and the Web App's own stylesheet has always had that order with a comment explaining it — that comment comes across, plus what it cost here. This was never only the wordmark. Every rule reaching for --font-sans or --font-mono was falling back too, which is the entire panel: the section nav, the card titles, and the endpoint tables whose monospace is how a path reads as a path. Checked against the built bundle rather than the dev server, since the dev pipeline is exactly what was hiding it: the page now reports Archivo italic 800 loaded, and the wordmark measures 115.05px — the same width the Web App's rail lockup measures. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
16 lines
524 B
HTML
16 lines
524 B
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="theme-color" content="#2563eb" />
|
|
<title>DriverVault · API Server</title>
|
|
<script type="module" crossorigin src="/assets/index-CvY2-bIX.js"></script>
|
|
<link rel="stylesheet" crossorigin href="/assets/index-C26jpIre.css">
|
|
</head>
|
|
<body>
|
|
<div id="app"></div>
|
|
</body>
|
|
</html>
|