Add the Material 3 Expressive foundation
tests / lint (push) Successful in 1m0s
tests / feature (8.4) (push) Successful in 1m0s
tests / feature (8.5) (push) Successful in 1m1s
tests / browser (safari, webkit) (push) Successful in 1m59s
tests / browser (chrome, chromium) (push) Successful in 1m49s
tests / browser (firefox, firefox) (push) Successful in 1m54s
tests / lint (push) Successful in 1m0s
tests / feature (8.4) (push) Successful in 1m0s
tests / feature (8.5) (push) Successful in 1m1s
tests / browser (safari, webkit) (push) Successful in 1m59s
tests / browser (chrome, chromium) (push) Successful in 1m49s
tests / browser (firefox, firefox) (push) Successful in 1m54s
Colour, shape, type, elevation and motion as tokens and Tailwind utilities; `php artisan material:scheme`, which generates an app's colour roles with Google's material-color-utilities (spec 2025); the theme head script with light, dark and system and its Alpine store; Google Sans Flex; every Material Symbol (4,135, outlined and filled) drawn by <x-icon> without blade-icons; all 35 M3 Expressive shapes, ported from androidx, as <x-shape>; the x-figure directive; the Toasts concern; DesignGuard for applications' tests; and a showcase with every token, both themes side by side and an icon search. Colour utilities are `@theme inline`, so a section with its own data-theme repaints; without it they resolve once on :root. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V9NnLxnPp8vaaurb3Z1MFy
This commit is contained in:
co-authored by
Claude Opus 5
parent
9b53891a8e
commit
b48e879254
@@ -1,10 +1,29 @@
|
||||
/*
|
||||
* Livewire Material — the one stylesheet an application imports, after Tailwind:
|
||||
* Livewire Material — the one stylesheet an application imports, after Tailwind, followed by
|
||||
* the scheme `php artisan material:scheme` wrote for it:
|
||||
*
|
||||
* @import 'tailwindcss';
|
||||
* @import '../../vendor/nonameweb/livewire-material/resources/css/material.css';
|
||||
* @import './material-scheme.css';
|
||||
* @source '../../vendor/nonameweb/livewire-material/resources/views';
|
||||
* @source '../../vendor/nonameweb/livewire-material/src';
|
||||
*
|
||||
* Colour roles, shape, type, motion, elevation and the component styles arrive in 0.2.0.
|
||||
* tokens/scheme.css is the package's own default (M3's baseline purple), so an application
|
||||
* renders before it has a scheme; the application's file declares the same roles later and wins.
|
||||
*/
|
||||
|
||||
@import './tokens/scheme.css';
|
||||
@import './tokens/shape.css';
|
||||
@import './tokens/elevation.css';
|
||||
@import './tokens/motion.css';
|
||||
@import './tokens/type.css';
|
||||
@import './tokens/font.css';
|
||||
@import './tokens/theme.css';
|
||||
@import './tokens/state.css';
|
||||
|
||||
@layer base {
|
||||
html {
|
||||
background-color: var(--md-sys-color-surface);
|
||||
color: var(--md-sys-color-on-surface);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user