Tabs
A tabbed interface using ARIA roles and @utility tab-* classes.
Make changes to your account here. Click save when you're done.
Change your password here.
Manage your notification settings.
Usage
tabs.html
<div role="tablist" class="tab-list">
<button role="tab" aria-selected="true" aria-controls="panel-1" class="tab-trigger">Account</button>
<button role="tab" aria-selected="false" aria-controls="panel-2" class="tab-trigger">Password</button>
</div>
<div id="panel-1" role="tabpanel" tabindex="0" class="tab-panel">
<p>Make changes to your account here.</p>
</div>
<div id="panel-2" role="tabpanel" tabindex="0" class="tab-panel" hidden>
<p>Change your password here.</p>
</div>