<!-- Footer -->
<footer class="md-footer">

  <!-- Link to previous and/or next page -->
  {% if page.previous_page or page.next_page %}
    {% if page.meta and page.meta.hide %}
      {% set hidden = "hidden" if "footer" in page.meta.hide %}
    {% endif %}
    <nav
      class="md-footer__inner md-grid"
      aria-label="{{ lang.t('footer.title') }}"
      {{ hidden }}
    >

      <!-- Link to previous page -->
      {% if page.previous_page %}
        {% set direction = lang.t("footer.previous") %}
        <a
          href="{{ page.previous_page.url | url }}"
          class="md-footer__link md-footer__link--prev"
          aria-label="{{ direction }}: {{ page.previous_page.title | e }}"
          rel="prev"
        >
          <div class="md-footer__button md-icon">
            {% include ".icons/material/arrow-left.svg" %}
          </div>
          <div class="md-footer__title">
            <div class="md-ellipsis">
              <span class="md-footer__direction">
                {{ direction }}
              </span>
              {{ page.previous_page.title }}
            </div>
          </div>
        </a>
      {% endif %}

      <!-- Link to next page -->
      {% if page.next_page %}
        {% set direction = lang.t("footer.next") %}
        <a
          href="{{ page.next_page.url | url }}"
          class="md-footer__link md-footer__link--next"
          aria-label="{{ direction }}: {{ page.next_page.title | e }}"
          rel="next"
        >
          <div class="md-footer__title">
            <div class="md-ellipsis">
              <span class="md-footer__direction">
                {{ direction }}
              </span>
              {{ page.next_page.title }}
            </div>
          </div>
          <div class="md-footer__button md-icon">
            {% include ".icons/material/arrow-right.svg" %}
          </div>
        </a>
      {% endif %}
    </nav>
  {% endif %}

  <!-- Further information -->
  <div class="md-footer-meta md-typeset">
    <div class="md-footer-meta__inner md-grid">
      <div class="links">
        <ul>
          <li><a href="https://github.com/dosbox-staging/dosbox-staging">GitHub</a></li>
          <li><a href="https://discord.gg/WwAg3Xf">Discord</a></li>
          <li><a href="https://opencollective.com/dosbox-staging">Open Collective</a></li>
          <!-- Mastodon verification -->
	  <li><a rel="me" href="https://corteximplant.com/@DOSBox_Staging">Mastodon</a></li>
        </ul>

      </div>

     <div class="credits">
       Powered by <a href="https://www.mkdocs.org/">MkDocs</a>, <a href="https://squidfunk.github.io/mkdocs-material/">MkDocs Material</a>, and <a href="https://pages.github.com/">GitHub Pages</a>
     </div>
    </div>
  </div>
</footer>
