UI Library

Checkbox (UI states)

Toggle example guides Toggle HTML markup

Input checkbox user-interaction state.

<insert-markup>checkbox.uistates-</insert-markup>
:focus
an element that received focus
<insert-markup>checkbox.uistates-0</insert-markup>
:hover
an element with mouse-over state
<insert-markup>checkbox.uistates-1</insert-markup>
Markup 
<div class="m-ip-checkbox">
    <input type="checkbox" class="m-ip-checkbox__input" id="my-checkbox">
    <label class="m-ip-checkbox__label [modifier class]" for="my-checkbox" tabindex="0">Checkbox</label>
</div>
Source: static/css/src/_m-ip-checkbox.scss, line 1