Package Data | |
---|---|
Maintainer Username: | davidpiesse |
Package Create Date: | 2018-08-26 |
Package Last Update: | 2023-06-12 |
Language: | Vue |
License: | MIT |
Last Refreshed: | 2024-11-18 03:00:43 |
Package Statistics | |
---|---|
Total Downloads: | 944,452 |
Monthly Downloads: | 10,453 |
Daily Downloads: | 77 |
Total Stars: | 86 |
Total Watchers: | 3 |
Total Forks: | 30 |
Total Open Issues: | 29 |
A drop in replacement for the default Boolean field
Same as most other Nova Packages
composer require davidpiesse/nova-toggle
The Toggle has all the same options as the Boolean field so you can set the values to be stored in the Model.
use Davidpiesse\NovaToggle\Toggle;
Toggle::make('Active')
->trueValue('On')
->falseValue('Off')
In addition you can set visual parameters
You can show both, or each state label
Toggle::make('Active')
->showLabels() //Both labels
->showOnlyTrueLabel() //True label only
->showOnlyFalseLabel() //False label only
To set the text you can use either or both of the following. You must also set the visibility of the labels as described above.
Toggle::make('Active')
->showLabels()
->trueLabel('Tru Dat')
->falseLabel('Nah Dawg')
The defaults are 'True' and 'False'
You can set the width and height. Setting the width will auto scale the height, but you can override this with ->height(). Defaults are 60 (px) and 26 (px)
Toggle::make('Active')
->width(80)
->height(45) //To override scaling
You can set wither or both of the background colours for the Toggle. By default True is the Nova 'Success Green' [ var(--success) ] and false is a Grey 60 [ var(--60) ]
Toggle::make('Active')
->trueColor('pink')
->falseColor('#fcfcfc')
You can set the animation speed in ms with
Toggle::make('Active')
->speed(500)
The default is 300ms