tests / feature (8.4) (push) Successful in 1m5s
tests / feature (8.5) (push) Successful in 1m4s
tests / lint (push) Successful in 59s
tests / browser (chrome, chromium) (push) Successful in 2m54s
tests / browser (firefox, firefox) (push) Successful in 3m3s
tests / browser (safari, webkit) (push) Successful in 4m13s
Outlined and filled text fields (input, password, auto-growing textarea, native select with the customizable select menu, file), checkbox with an indeterminate state, radio buttons, the M3 switch and form, ported from ReStride and extended. The first half of Phase 6. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V9NnLxnPp8vaaurb3Z1MFy
27 lines
893 B
PHP
27 lines
893 B
PHP
{{-- A form: its fields in one column, and its actions at the foot.
|
|
|
|
`gap-4` between fields, because a text field floats its label half above its outline: any less
|
|
and the hint under one field runs into the label of the next. The `actions` slot takes a class
|
|
of its own; `separator` draws a divider above it.
|
|
|
|
`grid-cols-1`, because a bare `grid` has no columns and its implicit one floors at the
|
|
content's min-content: on a phone a wide field would push the form past its column. --}}
|
|
|
|
@props([
|
|
'separator' => false,
|
|
])
|
|
|
|
<form {{ $attributes->class(['grid grid-cols-1 auto-rows-min gap-4']) }}>
|
|
{{ $slot }}
|
|
|
|
@isset($actions)
|
|
@if ($separator)
|
|
<x-divider />
|
|
@endif
|
|
|
|
<div {{ $actions->attributes->class(['flex flex-wrap items-center justify-end gap-2']) }}>
|
|
{{ $actions }}
|
|
</div>
|
|
@endisset
|
|
</form>
|