HTML-Prototype der OTH-Regensburg

<div class="c-search-filter">
  <div class="c-search-filter__heading-wrapper">
    <h2 class="c-search-filter__heading">Filter</h2><a class="c-search-filter__heading-link o-flex-line o-flex-line--items-center" href="#">
      <svg class="c-search-filter-icon" viewBox="0 0 36 38" role="img" aria-hidden="true" focusable="false">
        <use xlink:href="Images/svg/sprite.symbol.svg#icon-no-filter"></use>
      </svg><span>alle Filter löschen</span></a>
  </div>
  <ul class="c-search-filter__sections o-list-bare">
    <li class="c-search-filter__section">
      <div class="c-search-filter__section-heading-wrapper o-flex-line o-flex-line--items-center o-flex-line--between">
        <h3 class="c-search-filter__section-heading">Bereiche durchsuchen</h3><a class="o-flex-line o-flex-line--items-center" href="#" title="Bereichsfilter deaktivieren">
          <svg class="c-search-filter-icon" viewBox="0 0 36 38" role="img" aria-hidden="true" focusable="false">
            <use xlink:href="Images/svg/sprite.symbol.svg#icon-no-filter"></use>
          </svg></a>
      </div>
      <ul class="c-search-filter__section-content o-list-bare">
        <li>
          <input type="checkbox" id="solr-facet-1" name="filter-faculty" data-activate-facet="#activated" data-reset-all-facets="#deactivated"/>
          <label for="solr-facet-1"><span>Fakultäten und Einrichtungen</span></label>
        </li>
        <li>
          <input type="checkbox" id="solr-facet-2" name="filter-person" checked="checked" data-activate-facet="#activated" data-reset-all-facets="#deactivated"/>
          <label for="solr-facet-2"><span>Personen</span></label>
        </li>
        <li>
          <input type="checkbox" id="solr-facet-3" name="filter-news" data-activate-facet="#activated" data-reset-all-facets="#deactivated"/>
          <label for="solr-facet-3"><span>News</span></label>
        </li>
        <li>
          <input type="checkbox" id="solr-facet-4" name="filter-event" data-activate-facet="#activated" data-reset-all-facets="#deactivated"/>
          <label for="solr-facet-4"><span>Veranstaltungen</span></label>
        </li>
        <li>
          <input type="checkbox" id="solr-facet-5" name="filter-study-program" data-activate-facet="#activated" data-reset-all-facets="#deactivated"/>
          <label for="solr-facet-5"><span>Studiengänge</span></label>
        </li>
      </ul>
    </li>
  </ul>
</div>