Tabs
Tabs keeps related content in a single container that is shown and hidden through navigation. Please note that the interactivity for a tab-component is not provided by this toolkit.
To use these styles with react-tabs, add the dl-tab class to the <Tabs> component.
Examples
- Label
- Label
- Label
- Label 12
- Label
- Another tab
- Label 12
- Label
- Another tab
- Label 12
- Tab nº 4
<div class="dl-tab">
<ul class="tablist">
<li class="selected">Label</li>
<li>Label</li>
</ul>
</div>
<div class="dl-tab">
<ul class="tablist">
<li class="selected">Label</li>
<li>
Label
<span class="dl-badge count">12</span>
</li>
</ul>
</div>
<div class="dl-tab">
<ul class="tablist">
<li class="selected">Label</li>
<li>Another tab</li>
<li>
Label
<span class="dl-badge count">12</span>
</li>
</ul>
</div>
<div class="dl-tab">
<ul class="tablist">
<li>Label</li>
<li>Another tab</li>
<li class="selected">
Label
<span class="dl-badge count">12</span>
</li>
<li>Tab nº 4</li>
</ul>
</div>