Navigation

Content navigation

This component provides the navigation element for index pages. The links allow the user to quickly navigate to a page within the index. The currently active link is in black text, the links to other pages are blue.

Open this content navigation example in a new tab
HTML
<aside class="occlss-content-navigation" role="complementary">
  <nav role="navigation" class="occlss-content-navigation__nav" aria-label="Pages in this guide">
    <h2 class="occlss-content-navigation__title">Contents</h2>
    <ol class="occlss-content-navigation__list">
      <li class="occlss-content-navigation__list-item " aria-current="true">
        Check if you are eligible for a Blue Badge
      </li>
      <li class="occlss-content-navigation__list-item ">
        <a href="javascript:void(0);" class="occlss-content-navigation__lnk ">Check your documents</a>
      </li>
      <li class="occlss-content-navigation__list-item ">
        <a href="javascript:void(0);" class="occlss-content-navigation__lnk ">How to supply your documents</a>
      </li>
      <li class="occlss-content-navigation__list-item ">
        <a href="javascript:void(0);" class="occlss-content-navigation__lnk ">Start your application</a>
      </li>
    </ol>
  </nav>
</aside>

Changelog

1.0.0

  • Component added