Skip to content

toggle.md

Latest commit

 

History

History
31 lines (22 loc) · 652 Bytes

toggle.md

File metadata and controls

31 lines (22 loc) · 652 Bytes

Toggle

Tag: <x-nb-mobile::toggle>

iOS-style switch / Material-style switch.

Usage

<x-nb-mobile::toggle :checked="true" />
<x-nb-mobile::toggle wire:model.live="notifications" />

{{-- With dark mode hookup --}}
<x-nb-mobile::toggle
    wire:model.live="darkMode"
    x-on:change="nb.darkMode($el.querySelector('input').checked)"
/>

Props

Prop Default Description
checked false Initial state
name null
disabled false

Theme

  • iOS: h-7 w-12 track with floating thumb, primary color when on
  • Material: smaller h-5 w-9 track, thumb pops out 6px on either side