Skip to content

Forward class:button and class:close to the sidebar collapse and toast close buttons - #2830

Open
edalzell wants to merge 1 commit into
livewire:mainfrom
edalzell:class-button-passthrough
Open

edalzell wants to merge 1 commit into
livewire:mainfrom
edalzell:class-button-passthrough

Conversation

@edalzell

Copy link
Copy Markdown

flux:sidebar.collapse and flux:toast render an inner <button> whose classes are hard-coded (size-10, and h-8 w-8), and class lands on the wrapper, so an app cannot enlarge those two controls. That matters for touch targets: WCAG 2.5.5 asks for 44×44 on mobile screens, and today the only way to get there is publishing the two stubs.

This forwards class:button on sidebar.collapse and class:close on toast to the inner button, the same shape as class:input and class:icon elsewhere, appended after the defaults. Nothing changes for callers that don't pass them.

Usage: <flux:sidebar.collapse class="lg:hidden" class:button="min-h-11 min-w-11" />, <flux:toast class:close="min-h-11 min-w-11" />.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant