Select
Work in progressAn alternative to checkboxes and radio buttons. Useful when selcting from a long pre populated list (ie. when selecting a date range)
<label for="select-1" class="block margin-bottom--1">Select an option</label>
<div class="select-alt margin-bottom--2">
<select name="select-1" id="select-1" class="select">
<option value="value-1">First option</option>
<option value="value-2">Second option</option>
<option value="value-3">Third option</option>
<option value="value-4">Fourth option</option>
<option value="value-5">Fifth option</option>
<option value="value-6">Sixth option</option>
</select>
</div>