Navbar Component
Classes: .navbar
, .navbar-brand
, .navbar-nav
, .navbar-link
, .navbar-link.active
, .navbar-actions
Features:
- Horizontal navigation bar
- Brand area, nav links, and actions area
- Responsive and minimal
Example
Usage:
<nav class="navbar">
<a class="navbar-brand" href="#">Logo</a>
<ul class="navbar-nav">
<li><a class="navbar-link active" href="#">Home</a></li>
<li><a class="navbar-link" href="#">Docs</a></li>
<li><a class="navbar-link" href="#">Blog</a></li>
</ul>
<div class="navbar-actions">
<button class="btn btn-sm btn-primary">Sign In</button>
</div>
</nav>
Customization:
- Add utility classes for spacing, color, or layout