oliverdavies.uk-old-sculpin/source/_includes/nav.html.twig

<header class="w-100 pa3 ph4-ns bg-white">
  <div class="db dt-ns mw9 center w-100">
    <div class="db dtc-ns v-mid tl w-50">
      <a href="/" class="dib f5 f4-ns mt0 mb1 link" title="Home">
        {{ site.title }}
      </a>
    </div>

    <nav class="db dtc-ns v-mid w-100 tl tr-ns mt2 mt0-ns">
      <a href="/" class="f6 hover-blue link ml2 ml-m ml4-l dib {{ page.url == '/.' ? 'black' : 'black-70' }}">
        About
      </a>

      <a href="/experience" class="f6 hover-blue link ml2 ml-m ml4-l dib {{ page.url == '/experience' ? 'black' : 'black-70' }}">
        Experience
      </a>

      <a href="/testimonials" class="f6 hover-blue link ml2 ml-m ml4-l dib {{ page.url == '/testimonials' ? 'black' : 'black-70' }}">
        Testimonials
      </a>

      <a href="/talks" class="f6 hover-blue link ml2 ml-m ml4-l dib {{ page.url matches '#^/talks/?#' ? 'black' : 'black-70' }}">
        Talks
      </a>

      <a href="/blog" class="f6 hover-blue link ml2 ml-m ml4-l dib {{ page.url matches '#^/blog/?#' ? 'black' : 'black-70' }}">
        Blog
      </a>

      <a href="/contact" class="f6 hover-blue link ml2 ml-m ml4-l dn dib-l {{ page.url matches '#^/contact/?#' ? 'black' : 'black-70' }}">
        Contact
      </a>
    </nav>
  </div>
</header>