Author: | bantikyan |
---|---|
Views Total: | 7,951 views |
Official Page: | Go to website |
Last Update: | September 22, 2019 |
License: | MIT |
Preview:

Description:
icheck-material is a CSS/CSS3 library that lets you beautify & animate the regular checkboxes and radio buttons with Material Design styles.
See also:
How to use it:
Install the icheck-material package.
# NPM $ npm install icheck-material --save
Import the icheck-material.
import './icheck-material.min.css';
<link href="icheck-material.css" rel="stylesheet" type="text/css">
Create Material Design styled checkboxes & radio buttons:
<div class="icheck-material-red"> <input type="checkbox" checked id="red" /> <label for="red">red</label> </div> <div class="icheck-material-red"> <input type="radio" id="red1" name="red" /> <label for="red1">red 1</label> </div> <div class="icheck-material-red"> <input type="radio" checked id="red2" name="red" /> <label for="red2">red 2</label> </div>
To make the checkboxes & radio buttons inline, just add the class ‘icheck-inline’ to the parent container.
<div class="icheck-material-red icheck-inline"> <input type="checkbox" checked id="red" /> <label for="red">red</label> </div> <div class="icheck-material-red icheck-inline"> <input type="radio" id="red1" name="red" /> <label for="red1">red 1</label> </div> <div class="icheck-material-red icheck-inline"> <input type="radio" checked id="red2" name="red" /> <label for="red2">red 2</label> </div>
Changelog:
v1.0.1 (09/22/2019)
- Fixed Issue: Checkbox is not checked when click on the “background area”