Plan step 37: an application on 1.x-style imports now imports foundation.css before @import 'tailwindcss' and tailwind.css after it, the way foundation.css's own header has described since Phase F started — material.css only ever saved writing those two lines. Updates every place that named it: tailwind.css's and foundation/hidden.css's and tokens/utilities.css's header comments, the development skill's install snippet and Tokens section, README.md's install snippet, and a new line in UPGRADE.md's migration notes. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
25 lines
1.1 KiB
CSS
25 lines
1.1 KiB
CSS
/*
|
|
* The two rules that hide, outside every layer.
|
|
*
|
|
* A layered rule always loses to an unlayered one, and no rule without `!important` beats one with
|
|
* it, so these two sit outside the layers and carry `!important`: whatever `display` a component
|
|
* gives its root, `hidden` on it hides it, and an application can pass `hidden` to any component.
|
|
* `hidden="until-found"` is left to the browser, which keeps such content searchable.
|
|
* `[x-cloak]` hides what Alpine has not started yet; Alpine removes the attribute when it has.
|
|
*
|
|
* Only a layered `!important` could outrank these, and the package writes none. The file is apart
|
|
* from reset.css because these two rules are unlayered while reset.css's are in `material.reset`;
|
|
* foundation.css is the only file that imports it, so every entry — `all.css` and an application's
|
|
* own — reaches it once, through the foundation.
|
|
*/
|
|
|
|
@layer material.reset, material.tokens, material.base, material.layout, material.components, material.text, material.visibility;
|
|
|
|
[hidden]:where(:not([hidden='until-found'])) {
|
|
display: none !important;
|
|
}
|
|
|
|
[x-cloak] {
|
|
display: none !important;
|
|
}
|