A toggle button with a sketchy hand drawn look

[ This description is mirrored from README.md at github.com/wiredjs/wired-toggle on 2019-05-10 ]

wired radio

wired-toggle

Hand-drawn sketchy toggle button web component.

For demo and view the complete set of wired-elememts: wiredjs.com

Learn about web components here.

Usage

Add wired-toggle to your project:

npm i wired-toggle

Import wired-toggle definition into your HTML page:

<script type="module" src="wired-toggle/wired-toggle.js"></script>

Or into your module script:

import { WiredToggle } from "wired-toggle"

Use it in your web page:

<wired-toggle></wired-toggle>
<wired-toggle checked></wired-toggle>

Properties

checked - Checked state (boolean).

disabled - disables the toggle button. Default value is false.

Custom CSS Variables

--wired-toggle-off-color Color of the knob when in off (false) position.

--wired-toggle-on-color Color of the knob when in on (true) position.

Events

change event fired when state of the toggle is changed by the user.

Install

Link to this version
ImportedReleased 30 August 2017MIT License
Framework Support
Polymer 2.0+
Browser Compatibility
Install with
bower install --save wiredjs/wired-toggle"#0.2.0"
Run the above Bower command in your project folder. If you have any issues installing, please contact the author.
Release notes - Version 0.2.0

Dependencies

  • polymer#Polymer/polymer#^2.0.0
  • wired-lib#^0.1.1