feat(theme): Plan 2.5 P2 — Inter typography (AD-2.5-T1)

Per RFC-WS-PRIMEVUE-PLAN-2-5 §4 AD-2.5-T1. Establishes Inter as the
canonical Crewli body font via @fontsource/inter (local package, no
Google Fonts CDN).

Audit findings (pre-change):
- No @fontsource/public-sans package was installed.
- No <link> tag in index.html loaded Public Sans.
- Only one Public Sans reference existed in source: the vendored
  Vuexy SCSS variable $font-family-custom at
  src/@core/scss/template/libs/vuetify/_variables.scss, which drives
  Vuetify's $body-font-family on legacy surfaces during F4.
- No src/main.css exists; the Tailwind v4 entry lives at
  src/assets/styles/tailwind.css with no @theme block yet.

Changes:
- @fontsource/inter@^5.2.8 added to dependencies; weights
  400/500/600/700 imported at main.ts ahead of tailwind.css.
- src/assets/styles/tailwind.css: new @theme block declaring
  --font-sans Inter-first, plus :root --crewli-font-family and
  html/body font-family applying that variable cascade-wide.
- src/@core/scss/template/libs/vuetify/_variables.scss:
  $font-family-custom switched from the historical body font to
  Inter (vendored edit, narrowly scoped, F6 removes @core/ entirely).
- tests/unit/styles/typography.spec.ts: 3-spec regression lock
  (Tailwind direct stacks, Vuexy SCSS variable, zero historical
  references in either file). File-content inspection — jsdom does
  not cascade from imported stylesheets, so getComputedStyle would
  always pass.

Suite delta: 570 → 573 (+3; the prompt's template was +2 but the
audit revealed two distinct font-config files, so each gets its own
assertion per the prompt's "cover all sites" rule). vue-tsc clean.
Scoped ESLint clean.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
2026-05-20 08:36:11 +02:00
parent 59007e60e0
commit 41af180168
6 changed files with 155 additions and 5 deletions

View File

@@ -12,3 +12,35 @@
@import "tailwindcss";
@plugin "tailwindcss-primeui";
@source "../../**/*.{vue,ts,js,tsx,jsx}";
/* AD-2.5-T1 — typography (RFC-WS-PRIMEVUE-PLAN-2-5).
*
* Inter is loaded via @fontsource/inter in main.ts (weights 400/500/600/700,
* local package, no Google Fonts CDN). The stack falls back to the
* platform UI sans-family if Inter fails to load.
*
* Two declarations are required:
* 1. The Tailwind v4 `@theme` token `--font-sans` so utility classes
* (e.g. `font-sans`) resolve to Inter.
* 2. The cascade-level `html, body { font-family }` so PrimeVue and
* Vuetify components — which inherit from `body` — render in Inter
* too. `--crewli-font-family` is the named CSS variable carrying
* the stack so other consumers can read it without re-declaring.
*/
@theme {
--font-sans:
"Inter", system-ui, -apple-system, "Segoe UI", Roboto,
"Helvetica Neue", Arial, sans-serif;
}
:root {
--crewli-font-family:
"Inter", system-ui, -apple-system, "Segoe UI", Roboto,
"Helvetica Neue", Arial, sans-serif;
}
html,
body {
font-family: var(--crewli-font-family);
}