skillhub/web/index.html
FenjuFu 1c3e9be9e9
fix(web): self-host Inter and JetBrains Mono fonts (#753)
* fix(web): self-host Inter and JetBrains Mono fonts

web/index.html loaded Inter + JetBrains Mono from fonts.googleapis.com at
runtime. On networks where Google Fonts is slow or unreachable (e.g. CN),
that stylesheet blocks first paint for tens of seconds (#716).

Vendor the same woff2 (from the @fontsource distribution) under
web/public/fonts and declare them in fonts.css with latin/latin-ext
unicode-range splits and font-display: swap, then point index.html at the
local stylesheet and drop the fonts.googleapis.com / fonts.gstatic.com hosts
from the page CSP. Only Inter and JetBrains Mono were ever fetched from the
CDN, so families and weights are unchanged; no external font requests remain.

Closes #716

Signed-off-by: FenjuFu <92919259+FenjuFu@users.noreply.github.com>

* docs(web): record vendored font licenses

Signed-off-by: XiaoSeS <87064762+XiaoSeS@users.noreply.github.com>

---------

Signed-off-by: FenjuFu <92919259+FenjuFu@users.noreply.github.com>
Signed-off-by: XiaoSeS <87064762+XiaoSeS@users.noreply.github.com>
Co-authored-by: XiaoSeS <87064762+XiaoSeS@users.noreply.github.com>
2026-08-25 13:49:08 +08:00

25 lines
1.3 KiB
HTML

<!DOCTYPE html>
<html lang="zh-CN" translate="no" class="notranslate">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="google" content="notranslate" />
<meta
http-equiv="Content-Security-Policy"
content="default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; img-src 'self' data: blob: https:; font-src 'self' data:; connect-src 'self' ws: wss: http://localhost:* https://localhost:*; object-src 'none'; base-uri 'self'; frame-ancestors 'none'; form-action 'self'"
/>
<title>SkillHub</title>
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<!-- Self-hosted fonts (see /fonts/fonts.css); no external CDN so first paint
isn't blocked on fonts.googleapis.com, which is slow/unreachable on some
networks (#716). -->
<link rel="stylesheet" href="/fonts/fonts.css" />
</head>
<body>
<!-- translate=no: Chrome auto-translate mutates #root and races React 19 insertBefore. -->
<div id="root" translate="no" class="notranslate"></div>
<!-- Isolated host for Dialog/Sonner portals (avoids body sibling races with #root). -->
<div id="skillhub-portals" translate="no" class="notranslate"></div>
<script type="module" src="/src/bootstrap.ts"></script>
</body>
</html>