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

Tighten the design guard's application-CSS check on real stylesheets

Browse Source 
Plan step 41 review, check (iii): calc() hid every literal inside it and
now only one built on a var() does (min(), max() and clamp() too), so
calc(8px + 4px) and clamp(1rem, 2vw, 2rem) are reported. Declarations are
read whole, so a last one without a semicolon is seen and a custom
property named --card-border-radius is not mistaken for border-radius;
the font shorthand is checked; a 0s duration is fine. Media queries read
only width features: a height or prefers-* condition is not a breakpoint,
and (600px <= width < 840px) passes. The type hints no longer suggest
font-size: var(--md-sys-typescale-*), which is a font shorthand value.

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-15 08:48:25 +02:00
co-authored by Claude Opus 5
parent c0c71ef16c
commit 2073480da4
3 changed files with 90 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/Fixtures/design-guard/app-css/app.css
+16
View File
@@ -36,3 +36,19 @@
display: flex;
}
}
.edges {
--card-border-radius: 12px;
border-radius: min(var(--md-sys-shape-corner-lg), 50%);
border-top-left-radius: calc(8px + 4px);
transition: opacity 0s;
animation: pulse var(--md-sys-motion-effects-slow-duration) var(--md-sys-motion-effects-slow) infinite;
font: 600 14px/20px sans-serif;
font-size: clamp(1rem, 2vw, 2rem);
line-height: 1.5
}
@media (width > 839px) and (max-height: 500px) { .edges { display: none; } }
@media (600px <= width < 840px), (prefers-reduced-motion: reduce) { .edges { display: block; } }
@media (max-width: 40rem) { .edges { display: grid; } }
@container (width > 400px) { .edges { display: flex; } }