Add data tables, sort headers and M3 paginators
tests / lint (push) Successful in 1m0s
tests / feature (8.4) (push) Successful in 1m10s
tests / feature (8.5) (push) Successful in 1m6s
tests / browser (chrome, chromium) (push) Successful in 3m28s
tests / browser (firefox, firefox) (push) Successful in 4m20s
tests / browser (safari, webkit) (push) Failing after 6m16s
tests / lint (push) Successful in 1m0s
tests / feature (8.4) (push) Successful in 1m10s
tests / feature (8.5) (push) Successful in 1m6s
tests / browser (chrome, chromium) (push) Successful in 3m28s
tests / browser (firefox, firefox) (push) Successful in 4m20s
tests / browser (safari, webkit) (push) Failing after 6m16s
A data table styled from descendant selectors, a Livewire sort header with aria-sort, and Laravel's and Livewire's full and simple paginators drawn in M3, put in front of their own views. 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
f90695cedd
commit
83ed671c4e
@@ -0,0 +1,16 @@
|
||||
{{-- A data table. Its callers write `<thead>`, `<tr>`, `<th>` and `<td>` as they always do; how they
|
||||
look is resources/css/components/table.css, keyed on the `data-table` attribute set here (the
|
||||
top of that file says why).
|
||||
|
||||
`size="xs"` for a table inside a panel inside a panel. A selected row is
|
||||
`<tr aria-selected="true">`. Horizontal scrolling stays the caller's — wrap the table in
|
||||
`<div class="overflow-x-auto">` where the page needs it. A column that sorts is
|
||||
`<x-sort-header>`. --}}
|
||||
|
||||
@props([
|
||||
'size' => 'sm',
|
||||
])
|
||||
|
||||
<table data-table data-size="{{ $size === 'xs' ? 'xs' : 'sm' }}" {{ $attributes }}>
|
||||
{{ $slot }}
|
||||
</table>
|
||||
Reference in New Issue
Block a user