visual-radio:
[ This description is mirrored from README.md at github.com/miguelsmuller/visual-radio on 2019-01-07 ]
<visual-radio>
Visual radio ** Not use in production **
Install
Install the component using Bower:
$ bower install visual-radio --save
Usage
- Import Web Components’ polyfill, if needed:
<script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>
- Import Custom Element:
<link rel="import" href="/bower_components/visual-radio/visual-radio.html">
- Start using it!
<visual-radio value="bob" label="Bob Milton" image="http://i.pravatar.cc/300"></visual-radio>
<visual-radio value="mark" label="Mark Muller" image="http://i.pravatar.cc/300" selected></visual-radio>
<visual-radio value="patrick" label="Patrick Luis"></visual-radio>
<visual-radio value="josep" label="Li Topher" selected></visual-radio>
API reference
| Custom property | Description | Default |
|---|---|---|
--hover-color |
Main color of selected item | #1CAFF6 |
--hover-color-contrast |
Opposite color of selected item | #FFFFFF |
<style type="text/css">
visual-radio {
--hover-color: #ff0000;
--hover-color-contrast: #000000;
}
</style>