<!DOCTYPE html>
<html lang="{{ config.language }}">

{%- macro make_nav_link(name, id, page, site) %}
  {% set aria = "" %}
  {% set class = "nav-link" %}
  {% if page.id == id %}
    {% set class = class + " active" %}
    {% set aria = 'aria-current="page"' %}
  {% endif %}
  <a class="{{ class }}" {{ aria }} href="/{{ site[id].path|replace('index.html', '') }}">{{ name }}</a>
{%- endmacro %}

<head>
  <meta charset="utf-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />

  {%- if page.custom_page_title is defined %}
    {%- set title = page.custom_page_title|striptags|e %}
  {%- else %}
    {%- set title = page.title|striptags|e + " | " + config.site_name|striptags|e %}
  {%- endif %}
  <title>{{ title }}</title>

  {%- if config.favicon is defined %}
  <link rel="shortcut icon" href="/{{ config.favicon|e }}"/>
  {%- endif %}

  <!-- Bootstrap CSS -->
  <link rel="stylesheet" href="/css/bootstrap-5.1/bootstrap.min.css">
  <!-- FontAwsome icons -->
  <link rel="stylesheet" href="/css/fontawesome/css/all.css">
  <!-- Main CSS stylesheet -->
  <link rel="stylesheet" href="/css/style.css">

  {%- block extrahead %}{% endblock %}
</head>

<body>
  <header class="shadow-sm">
    <nav class="navbar navbar-expand-lg navbar-light" aria-labelledby="primary-navigation">
      <div class="container align-middle">
        <a class="navbar-brand" href="/">
          <img aria-hidden="true" alt="Project logo" src="/{{ config.logo }}">
          {{ config.site_name }}
        </a>
        <button class="navbar-toggler" type="button"
                data-bs-toggle="collapse" data-bs-target="#navbarNav"
                aria-controls="navbarNav" aria-expanded="false"
                aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse align-middle"  id="navbarNav">
          <ul class="navbar-nav flex-row flex-wrap">
            {%- for name, id in config.menu %}
              <li class="nav-item col-6 col-md-auto">
                {{ make_nav_link(name, id, page, site) }}
              </li>
            {%- endfor %}
          </ul>
          <ul class="navbar-nav ms-md-auto">
            <li class="nav-item">
              <a class="nav-link" aria-label="GitHub" href="https://github.com/{{ config.repository }}" target="_blank"><i class="fab fa-github fa-lg me-1" title="GitHub" aria-hidden="true"></i> GitHub</a>
            </li>
          </ul>
        </div>
      </div>
    </nav>
  </header>

  <main>
    {%- block content %}
      <section class="container page-content">
        {%- if page.exclude_h1 is defined and page.exclude_h1 %}
        {%- else %}
          <h1>{{ page.title }}</h1>
        {%- endif %}
        {{ page.body }}
      </section>
    {%- endblock %}
  </main>

  <footer>
    <div class="container">
      <p>
        Last updated {{ build.today.strftime('%Y/%m/%d') }} from commit
        <a href="https://github.com/{{ config.repository }}/commit/{{ build.commit }}"><code>{{ build.commit }}</code></a>
      </p>
      <p>
        Built with <a href="https://nene.leouieda.com">Nēnē</a> {{ build.nene_version }}
      </p>
      <p>
        Copyright &copy; 2021 {{ config.author }}
      </p>
    </div>
  </footer>

  <!-- Bootstrap bundled Javascript (with their dependencies) -->
  <script src="/js/bootstrap-5.1/bootstrap.bundle.min.js"
    integrity="sha384-/bQdsTh/da6pkI1MST/rWKFNjaCP5gBSY4sEBT38Q/9RBh9AH40zEOg7Hlq2THRZ"
    crossorigin="anonymous"></script>

</body>
</html>
