cruk-pattern-library/docs/_includes/sidenav.html

CRUK Pattern library.

<nav class="list-group docs-menu" role="navigation" aria-label="Secondary">
  <a class="list-group-item {% if page.title == "Getting Started" %}active{% endif %}" href="{{ site.baseurl }}/">
    Getting started
  </a>
  <a class="list-group-item {% if page.title == "Guidelines" %}active{% endif %}" href="{{ site.baseurl }}/guidelines/">
    Coding guidelines
  </a>
  <a class="list-group-item {% if page.title == "Browser Support" %}active{% endif %}" href="{{ site.baseurl }}/browser-support/">
    Browser Support
  </a>
</nav>

<nav class="list-group docs-menu" role="navigation" aria-label="Secondary">
  <a class="list-group-item {% if page.title == "Colours" %}active{% endif %}" href="{{ site.baseurl }}/colours/">
    Brand Colours
  </a>
</nav>

<nav class="list-group docs-menu" role="navigation" aria-label="Secondary">
  <a class="list-group-item {% if page.title == "Scaffolding" %}active{% endif %}" href="{{ site.baseurl }}/scaffolding/">
    Scaffolding
  </a>
  <a class="list-group-item {% if page.title == "Typography" %}active{% endif %}" href="{{ site.baseurl }}/type/">
    Type
  </a>
  <a class="list-group-item {% if page.title == "Icons" %}active{% endif %}" href="{{ site.baseurl }}/icons/">
    Icons
  </a>
  <a class="list-group-item {% if page.title == "Forms" %}active{% endif %}" href="{{ site.baseurl }}/forms/">
    Forms
  </a>
  <a class="list-group-item {% if page.title == "Dynamic Feedback" %}active{% endif %}" href="{{ site.baseurl }}/dynamic-feedback/">
    Dynamic Feedback
  </a>
  <a class="list-group-item {% if page.title == "Accordion" %}active{% endif %}" href="{{ site.baseurl }}/accordion/">
    Accordion
  </a>
  <a class="list-group-item {% if page.title == "Collapsible box" %}active{% endif %}" href="{{ site.baseurl }}/collapsible-box/">
    Collapsible box
  </a>
  <a class="list-group-item {% if page.title == "Alerts" %}active{% endif %}" href="{{ site.baseurl }}/alerts/">
    Alerts
  </a>
  <a class="list-group-item {% if page.title == "Loaders" %}active{% endif %}" href="{{ site.baseurl }}/loader/">
    Loaders
  </a>
  <a class="list-group-item {% if page.title == "Pagination" %}active{% endif %}" href="{{ site.baseurl }}/pagination/">
    Pagination
  </a>
  <a class="list-group-item {% if page.title == "Breadcrumb" %}active{% endif %}" href="{{ site.baseurl }}/breadcrumb/">
    Breadcrumb
  </a>
  <a class="list-group-item {% if page.title == "Progress Bar" %}active{% endif %}" href="{{ site.baseurl }}/progress-bar/">
    Progress Bar
  </a>
  <a class="list-group-item {% if page.title == "Search" %}active{% endif %}" href="{{ site.baseurl }}/search/">
    Search
  </a>
  <a class="list-group-item {% if page.title == "Animations" %}active{% endif %}" href="{{ site.baseurl }}/animations/">
    Animations
  </a>
  <a class="list-group-item {% if page.title == "Pattern Library" %}active{% endif %}" href="{{ site.baseurl }}/pattern-library/">
    Pattern Library
  </a>
  <a class="list-group-item {% if page.title == "Table" %}active{% endif %}" href="{{ site.baseurl }}/table/">
    Tables
  </a>
  <a class="list-group-item {% if page.title == "Calls To Action" %}active{% endif %}" href="{{ site.baseurl }}/calls-to-action/">
    Calls To Action
  </a>
  <a class="list-group-item {% if page.title == "Alphabetic List" %}active{% endif %}" href="{{ site.baseurl }}/alphabetic-list/">
    Alphabetic List
  </a>
  <a class="list-group-item {% if page.title == "Video" %}active{% endif %}" href="{{ site.baseurl }}/video/">
    Video
  </a>
</nav>