The toggle switch is semantically a checkbox, but mimics a tactile switch that can be turned on or off.
To make a checkbox appear as a toggle switch, use the '.sme-toggle-switch'
class instead of '.sme-checkbox'.
The intermediate state is invalid for toggle switches. They should always be on or off.
<div class="sme-toggle-switch">
<label>
<input aria-label="Control label" type="checkbox" aria-checked="false">
<span aria-hidden="true">Control label</span>
</label>
</div>
<div class="sme-toggle-switch">
<label>
<input aria-label="Control label" type="checkbox" checked="checked" aria-checked="true">
<span aria-hidden="true">Control label</span>
</label>
</div>
<div class="sme-toggle-switch">
<label>
<input aria-label="Control label" type="checkbox" disabled="disabled" aria-checked="false">
<span aria-hidden="true">Control label</span>
</label>
</div>
<div class="sme-toggle-switch sme-documentation-example">
<label>
<input aria-label="Control label" type="checkbox" checked="checked" disabled="disabled" aria-checked="true">
<span aria-hidden="true">Control label</span>
</label>
</div>