Tabs

A filter component for showing and hiding content

Tabs

Tabs are used to filter content. Add the modifier --active to indicate which content is currently being filtered.

<ul class="tabs">
    <a href="#" class="tab tab--active">
        <li class="tab__item">
            <span>Alla resultat</span>
            <span class="tab__counter">24</span>
        </li>
    </a>
    <a href="#" class="tab">
        <li class="tab__item">
            <span>Sidor</span>
            <span class="tab__counter">16</span>
        </li>
    </a>
    <a href="#" class="tab">
        <li class="tab__item">
            <span>Styrda dokument</span>
            <span class="tab__counter">8</span>
        </li>
    </a>
</ul>
Copy