[Kimchi-devel] [PATCH] [Wok] Wok Toggle-Switch checkbox UI
From: Samuel Guimarães <sguimaraes943(a)gmail.com>
This patch adds a toggle switch inspired by iOS and Material Design checkboxes.
This widget will be used in Ginger System Services front-end.
HTML syntax:
<input type="checkbox" id="checkboxid" checked=""
class="wok-toggleswitch-checkbox">
<label for="checkboxid" class="wok-toggleswitch-label">
<span class="sr-only">Checkbox label hidden from
UI</span></label>
JS is necessary to update label text once checkbox status is changed - Screen reader
software reads the toggle switch as a regular checkbox! (you'll have to create your
own code for this as it may vary from use-case)
Samuel Guimarães (1):
Added Wok Toggle-Switch checkbox UI
ui/css/src/modules/_wok-toggleswitch.scss | 80 +++++++++++++++++++++++++++++++
ui/css/src/modules/_wok-variables.scss | 3 ++
ui/css/src/wok.scss | 2 +
ui/css/wok.css | 77 +++++++++++++++++++++++++++++
4 files changed, 162 insertions(+)
create mode 100644 ui/css/src/modules/_wok-toggleswitch.scss
--
1.9.3