{% set links = [
  {
    title: 'Tickets',
    href: site['tickets']['url'],
    active: false,
    enabled: site['tickets']['available'],
  },
  {
    title: 'Submit a session',
    href: site['cfp']['url'],
    active: false,
    enabled: site['cfp']['open'],
  },
  {
    title: 'Speakers',
    href: '/#speakers',
    active: page.layout == 'speaker',
    enabled: true,
  },
  {
    title: 'Schedule',
    href: '/#schedule',
    active: page.url == '/schedule' or page.layout == 'session',
    enabled: true,
  },
  {
    title: 'Sponsor us',
    href: '/sponsor-us',
    active: page.url == '/sponsor-us',
    enabled: now|date('U') < site['date'],
  }
] %}

<nav role="navigation" aria-labelledby="block-dcb2017-main-menu-menu" id="block-dcb2017-main-menu" class="block block-menu navigation menu--main">
  <h2 class="visually-hidden" id="block-dcb2017-main-menu-menu">Main navigation</h2>
  <ul class="tw-list-reset tw-flex tw-flex-wrap tw-justify-center tw--ml-8">
    {% for link in links if link.enabled %}
      <li class="tw-mb-2 tw-mx-4 md:tw-m-0 md:tw-ml-8">
        <a class="tw-uppercase tw-no-underline hocus:tw-text-green-600 {{ link.active ? 'tw-text-green-600' : 'tw-text-black' }}" href="{{ link.href|raw }}">
          {{ link.title }}
        </a>
      </li>
    {% endfor %}
  </ul>
</nav>