[Kimchi-devel] [PATCH] [Wok] Wok Toggle-Switch checkbox UI

[sguimaraes943 at gmail.com]

From: Samuel Guimarães <sguimaraes943 at 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