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
35 lines
1.3 KiB
PHP
35 lines
1.3 KiB
PHP
{{-- A Material Symbol (Rounded, weight 400, grade 0, optical size 24), inline.
|
|
|
|
`name` is Google's name for it, underscores and all (`arrow_back`), as listed on
|
|
fonts.google.com/icons; every symbol Google publishes is available, and an unknown name
|
|
throws. `filled` draws the filled state, which in M3 means active or selected.
|
|
|
|
Decorative by default and hidden from screen readers, because nearly every icon sits
|
|
beside words that already say what it means. Pass `label` when the icon alone carries
|
|
the meaning.
|
|
|
|
24px unless the caller sizes it. The default is added only when no size class is passed,
|
|
rather than merged under one: `size-6 size-4` compiles to whichever Tailwind emits last,
|
|
not to the one the caller wrote. --}}
|
|
|
|
@props([
|
|
'name',
|
|
'filled' => false,
|
|
'label' => null,
|
|
])
|
|
|
|
@php
|
|
$sized = preg_match('/(^|\s)(size|w|h)-/', (string) $attributes->get('class')) === 1;
|
|
|
|
$attributes = $attributes
|
|
->class(['shrink-0', 'size-6' => ! $sized])
|
|
->merge(array_filter([
|
|
'aria-hidden' => $label === null ? 'true' : null,
|
|
'aria-label' => $label,
|
|
'role' => $label === null ? null : 'img',
|
|
'focusable' => 'false',
|
|
]));
|
|
@endphp
|
|
|
|
{{ \NoNameWeb\LivewireMaterial\Support\SvgFile::symbol($name, (bool) $filled, $attributes) }}
|