Teach 2.0's plain CSS in the Boost guidelines and skills
2.0.0 took Tailwind out of the stack, but the texts Boost copies into every application still taught its utilities: the core guideline said "built on Tailwind CSS", the always-on material-3 guideline wrote every rule as `bg-primary`, `type-*`, `rounded-corner-*`, `state-layer` and `medium:`, and both skills' tables and examples did the same. None of those classes exists in 2.0's stylesheets, so an agent following the guideline wrote markup that compiled to nothing. Found moving ReStride onto 2.0: its CLAUDE.md, and SealShare's, carry these texts. The guidelines and skills now teach what 2.0 has: component and layout component props (`gap="space200"`, `hide-from="medium"`), the `md-type-*`, `md-ink-*` and interaction classes, and `--md-sys-*` tokens in the application's own CSS, with breakpoints as range media queries. UPGRADE.md §1, §2 and §4 describe the finished move instead of the in-between state, and header comments that pointed at the removed tokens/utilities.css and tailwind.css, or called a component "still Tailwind", say what is true now. BoostVocabularyTest runs DesignGuard over the code in every shipped guideline and skill (fenced Blade and CSS, and each inline class list), so a text that teaches a class the stylesheets do not define fails the suite; it finds 268 violations in the texts as 2.0.0 shipped them. The guard's own table of what it reports is exempt. BoostResourcesTest now asks the design skill for each breakpoint's prop value and media query instead of the removed `medium:` variants. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 5
parent
bae1df09da
commit
24eb811f34
@@ -28,8 +28,8 @@
|
||||
`--material-bottom-bar` follows the bar down and up, so a `fab` button, the snackbar and the
|
||||
page's bottom padding keep their distance from it rather than from where it was.
|
||||
|
||||
It does not position itself: wrap it in the element that pins it (`fixed inset-x-0 bottom-0`)
|
||||
and hides it where a rail takes over. `<x-scaffold>` does both, and lifts the snackbar and a
|
||||
It does not position itself: wrap it in the element that pins it (`position: fixed` to the
|
||||
bottom edge, in the application's own CSS) and hides it where a rail takes over. `<x-scaffold>` does both, and lifts the snackbar and a
|
||||
`fab` button above it through `--material-bottom-bar`.
|
||||
|
||||
`label` names the landmark ("Main" by default); `tall` picks the 80px container;
|
||||
|
||||
@@ -7,9 +7,9 @@
|
||||
moves the same way after a Livewire morph.
|
||||
|
||||
Linear by default, as wide as its container, unless the caller's own class narrows it — an
|
||||
application's unlayered CSS always outranks the package's default, `w-*` Tailwind utilities
|
||||
included. `circular` is 40px, 48px wavy, the same way. `wavy` draws Expressive's wave. `thick`
|
||||
makes the track and indicator 8px instead of 4px and keeps the wave as high as it was, which
|
||||
application's unlayered CSS always outranks the package's default. `circular` is 40px, 48px
|
||||
wavy, the same way. `wavy` draws Expressive's wave. `thick` makes the track and indicator 8px
|
||||
instead of 4px and keeps the wave as high as it was, which
|
||||
is what Compose's thick samples do: the container grows by the extra stroke (14px linear
|
||||
wavy, 44px circular, 52px circular wavy). `color` is the active indicator and the stop:
|
||||
`primary` (the default), `secondary`, `tertiary`, `error`, `success`, `warning`, `info`; the
|
||||
|
||||
Reference in New Issue
Block a user