-<nav id="menu">
- <header class="major">
- <h2>Menu</h2>
- </header>
- <ul class="links">
- {{#foreach navigation}}
- <li class="nav-{{slug}} {{#if current}}active{{/if}}"><a href="{{url absolute="true"}}">{{label}}</a></li>
- {{/foreach}}
- </ul>
-</nav>
\ No newline at end of file
+<!-- start nav -->
+{{#if isSecondary}}
+ <!-- start secondary -->
+ {{#foreach navigation}}
+ <li class="nav-{{slug}}" role="menuitem">
+ <a href="{{url}}"><span class="icon">
+ <svg class="icon" width="16" height="16" role="img" aria-label="{{slug}} icon">
+ <title>{{slug}}</title>
+ <use xlink:href="#{{slug}}"></use>
+ </svg>
+ </span>
+ </a>
+ </li>
+ {{/foreach}}
+ <!-- end secondary -->
+{{else}}
+ <!-- start primary -->
+ <nav id="menu">
+ <header class="major">
+ <h2>Menu</h2>
+ </header>
+ <ul class="links">
+ {{#foreach navigation}}
+ <li class="nav-{{slug}} {{#if current}}active{{/if}}"><a href="{{url absolute="true"}}"><span class="word">{{label}}</span></a></li>
+ {{/foreach}}
+ </ul>
+ </nav>
+ <!-- end primary -->
+{{/if}}
+<!-- end nav -->