Filters
Example
<div class="filterList">
<h3 class="filterList-heading">Project</h3>
<ul>
<li>
<div class="radio">
<input type="radio" name="radiogroup_id" id="project-any" value="" checked="">
<label for="project-any"><span class="radio-icon"></span> Any project</label>
</div>
</li>
<li>
<div class="radio">
<input type="radio" name="radiogroup_id" id="project-ted-talks" value="">
<label for="project-ted-talks"><span class="radio-icon"></span> TED Talks</label>
</div>
</li>
<li>
<div class="radio">
<input type="radio" name="radiogroup_id" id="project-ted-ed" value="">
<label for="project-ted-ed"><span class="radio-icon"></span> TED-Ed</label>
</div>
</li>
<li>
<div class="radio">
<input type="radio" name="radiogroup_id" id="project-otp-resources" value="">
<label for="project-otp-resources"><span class="radio-icon"></span> OTP Resources</label>
</div>
</li>
</ul>
</div>
Example
<div class="filterList">
<h3 class="filterList-heading">Assignmnent State</h3>
<div class="filterList-select">
<div class="select">
<select name="" id="" class="select_autofill" style="width:100%;">
<option>In progress</option>
<optgroup label="Available">
<option>Any available</option>
<option>Subtitles needed</option>
<option>Review needed</option>
<option>Approval needed</option>
</optgroup>
<optgroup label="Assigned">
<option>Any assigned</option>
<option>Subtitles in progress</option>
<option>Review in progress</option>
<option>Approval in progress</option>
</optgroup>
</select>
</div>
</div>
</div>
Assignmnent State
Example
<div class="filters row">
<div class="col-xs-12 col-sm-8">
<div class="searchbar"><label class="sr-only">Search</label><input id="id_filters_q" name="q" placeholder="Search for videos" type="text"></div>
</div>
<div class="col-xs-12 col-sm-4">
<select class="select select2-hidden-accessible" data-clear="false" id="id_filters_sort" name="sort" tabindex="-1" aria-hidden="true">
<option value="due" selected="selected">Due first</option>
<option value="-due">Due last</option>
</select>
</div>
</div>