Navigation

The basic .nav pattern class throws elements inline, sets the project-defined $font-weight and $font-family values.

• Home
• Menu
• Drinks
• Meat

<ul class="nav">
  <li><a href="#">Home</a></li>
  <li><a href="#">Menu</a></li>
  <li class="active">Drinks</li>
  <li><a href="#">Meat</a></li>
</ul>

Optional section-specific classes target the element that represents the primary navigaton element, a specific section of your web page.

[role='navigation'] {

}

.nav--primary {

}