Open OlsonDev opened 9 years ago
I'm open to suggestions. The checkbox control can only really be resized natively in chrome.
Having used replacement checkbox systems in the past, I pretty much hate them. Have you had success with a library that you'd like to propose?
I wasn't even thinking a library-based one. Pretty simple to roll your own <div tabindex="0">
that toggles a CSS class on click
, touchend
, and spacebar
changing it from grey to green or something.
Otherwise, that bootstrap-switch would even be an improvement, even though it isn't that visually appealing to me. I just hate having to snipe native checkboxes that much. :-P
There's bindings under the hood that writes it back to localStorage though, which depends on a check event. It's not just visual since there's persistence involved.
That's fine, you can do all that without a change
event.
<input type="checkbox" data-bind="checked:isCubedSeason"/>
becomes <div tabindex="0" data-bind="css: { checked: isCubedSeason }, event: { click: toggleIsCubedSeason, touchend: toggleIsCubedSeason, keydown: toggleIsCubedSeasonIfEventDotWhichEqualsSpacebar }"/>
Making them bigger will save time when looking, and make clicking easier.
https://en.wikipedia.org/wiki/Fitts%27s_law