Plan step 33. Each token file now opens with the material layer statement and wraps its declarations in material.tokens (the font face in material.base), so an application's unlayered scheme outranks the package default whatever the selectors, and the foundation can import the files with no layer() on the import. The type-* and state utilities move to tokens/utilities.css, still imported by material.css, so no file the foundation imports carries a Tailwind directive. [x-cloak] moves beside the [hidden] rule in foundation/hidden.css, outside every layer; material.css imports it. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
25 lines
1.0 KiB
CSS
25 lines
1.0 KiB
CSS
/*
|
||
* Google Sans Flex (SIL Open Font License 1.1, resources/fonts/google-sans-flex/OFL.txt).
|
||
*
|
||
* One variable woff2, cut down with fontTools: Latin and Latin Extended plus a handful of
|
||
* symbols (≈ →), weight 400–700 and roundness 0–100 kept, width, grade, slant and optical
|
||
* size pinned — 63 KB where the full font is 4 MB. Vite copies it into the application's
|
||
* build from this relative url.
|
||
*
|
||
* The face sits in `material.base` (foundation/base.css imports it). An application that wants
|
||
* another typeface overrides `--md-ref-typeface-brand` in its own stylesheet, which outranks
|
||
* every package layer.
|
||
*/
|
||
|
||
@layer material.reset, material.tokens, material.base, material.layout, material.components, material.text, material.visibility;
|
||
|
||
@layer material.base {
|
||
@font-face {
|
||
font-family: 'Google Sans Flex';
|
||
src: url('../../fonts/google-sans-flex/GoogleSansFlex-Latin.woff2') format('woff2');
|
||
font-weight: 400 700;
|
||
font-style: normal;
|
||
font-display: swap;
|
||
}
|
||
}
|