There are only two navigation patterns included in the framework. The first is a simple breadcrumb menu pattern that you can see right above this text. This is implemented rather simply, all things considered:

<nav class="breadcrumb">
    <ul>
        <li><a href="#">Nav Link 1</a></li>
        <li><a href="#">Nav Link 2</a></li>
        <li><a href="#">Nav Link 3</a></li>
        <li><a href="#">Nav Link 4</a></li>
        <li><a href="#">Nav Link 5</a></li>
    </ul>
</nav>

The accordion menu pattern is sort of used on this site, in the menu above that opens on every page except the home page. To see a more normal example, see the NewFolder Demo page on GitHub.

This menu pattern uses the "invisible checkbox" trick to make it possible to open and close menus without JavaScript. Here's what that looks like in the markup:

<nav class="accordion">
    <label for="accordion1">Accordion Level 1</label>
    <input type="checkbox" id="accordion1">

    <ul>
        <li><a href="#">Nav Link 1</a></li>
        <li><a href="#">Nav Link 2</a></li>
        <li><a href="#">Nav Link 3</a></li>
        <li><a href="#">Nav Link 4</a></li>
        <li><a href="#">Nav Link 5</a></li>
    </ul>


    <label for="accordion2">Accordion Level 2</label>
    <input type="checkbox" id="accordion2">

    <ul>
        <li><a href="#">Nav Link 1</a></li>
        <li><a href="#">Nav Link 2</a></li>
        <li><a href="#">Nav Link 3</a></li>
        <li><a href="#">Nav Link 4</a></li>
        <li><a href="#">Nav Link 5</a></li>
    </ul>

</nav>

And you can stack the levels... pretty much as much as you want.