3.3 - Navigation Bar
Source: organisms/_navigation-bar.scss, line 29
Resize me
Have accessible keys for mobile as well esc to close
and tab to navigate inside, using trapTabKey js function so we don't focus outside.
Example:
<header class="navigation-bar has-py-3">
<div class="navigation-bar-items" role="dialog">
<div class="brand">
<a href="#">Brand Name
<span>v1.0.0</span>
</a>
</div>
<nav id="main-navigation" class="navigation">
<button class="burger">
<span class="burger-icon">
<span></span>
</span> Menu</button>
<ul class="list-inline navigation-items">
<li>
<a href="#">Home</a>
</li>
<li>
<a href="#">Shop</a>
</li>
<li>
<a href="#">Space Bears</a>
</li>
<li>
<a href="#">Mars Cars</a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
</nav>
</div>
</header>