Draw a button's spinner in the button's own ink
The loading indicator inside a filled or tonal button was painted in text-primary on a primary container — 1:1 contrast. M3 asks an indicator embedded in another component to take that component's label colour, so the button now passes text-current, which loading.blade.php reads as a caller colour and leaves alone. Plan step 11, actions.md ACT-01. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
co-authored by
Claude Opus 5
parent
0adfb6fff4
commit
91f49be6d7
@@ -24,7 +24,9 @@
|
||||
Behaviour kept from maryUI: `link` renders an anchor with `wire:navigate` (unless `external`
|
||||
or `no-wire-navigate`); `disabled` works on a link too, as `aria-disabled`; `spinner` shows
|
||||
the loading indicator while the button's own `wire:click` runs (or the action named by a
|
||||
string); `responsive` hides the label below `expanded` (840px, where M3 lets buttons reposition);
|
||||
string), drawn in the button's own ink — M3 asks an indicator embedded in another component
|
||||
to take that component's label colour, so it stays visible on a filled or tonal container;
|
||||
`responsive` hides the label below `expanded` (840px, where M3 lets buttons reposition);
|
||||
`tooltip`, `tooltip-left`, `tooltip-right`
|
||||
and `tooltip-bottom` attach a plain tooltip. `fab` is a page's create action: an extended FAB
|
||||
pinned in the thumb zone on a compact window (below `medium`, 600px), a filled button from
|
||||
@@ -206,7 +208,7 @@
|
||||
<{{ $tag }} {{ $attributes }}>
|
||||
@if ($spinnerTarget)
|
||||
<span wire:loading.flex wire:target="{{ $spinnerTarget }}" class="items-center justify-center">
|
||||
<x-livewire-material::loading :class="$iconSize" :label="false" />
|
||||
<x-livewire-material::loading :class="$iconSize.' text-current'" :label="false" />
|
||||
</span>
|
||||
@endif
|
||||
|
||||
|
||||
Reference in New Issue
Block a user