noNameWEB/livewire-material
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Say what the design guard now reports and what to write instead

Browse Source 
The "Testing the design" section of the README and of the Boost skill list the
cleared breakpoints and scales with their M3 replacement, the arbitrary-colour
check, and the two opt-in checks for the absolutes and for opacity on ink.
Plan: docs/plans/material-3-alignment.md, step 9 (core C4a, C13).

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
Andreas Reinhold / reini
2026-09-14 05:32:31 +02:00
co-authored by Claude Opus 5
parent faf5132c7a
commit e2d249a409
2 changed files with 21 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+3 -1
View File
@@ -144,7 +144,9 @@ it('uses only what compiles', function () {
});
```
The guard fails on maryUI tags, daisyUI classes, colours the theme does not declare, unknown Material Symbol names and Blade directives written inside component tags.
The guard fails on maryUI tags, daisyUI classes, colours the theme does not declare, unknown Material Symbol names and Blade directives written inside component tags. It also fails on everything 2.0 cleared, and every line names the replacement: Tailwind's breakpoint prefixes (`sm:` and `md:` → `medium:`, `lg:` → `expanded:`, `xl:` → `large:`, `2xl:` → `extra-large:`, `max-` likewise), its radius (`rounded-lg` → `rounded-corner-lg`), shadow (`shadow-md` → `shadow-elevation-2`), text size, weight, leading and tracking (`text-sm`, `leading-6`, `tracking-wide` → a `type-*` style, `font-medium` → a `type-emphasized-*` style), easing and duration (`ease-in-out` → `ease-standard`, `duration-300` → a `duration-(--md-sys-motion-…-duration)` with the easing it pairs with), and a colour written as a value rather than a role (`bg-[#1d7afc]`, `text-[rgb(…)]`, `border-[color-mix(…)]`).
Two checks are opt-in: `forbidAbsolutes()` also fails on `bg-white` and `text-black` (M3's white is `surface-container-lowest`), and `forbidOpacityInk()` on opacity used as emphasis (`text-on-surface/60` → `text-on-surface-variant` or `text-outline`). M3 reserves 38 % on content and 12 % on a container for the disabled state, which is what the package's own components use them for, so neither is on by default.
## AI agents