www.moonwalks.be/theme/templates/partials/nav-menu.html

{# depends on the `current_lang` variable
   set in the article templates, and other custom pages template
   such as gallery and index using `article.lang` or `page.lang`.
   so it must be added after this variable is set using block insertion.
   This method allow to conserve lang preference switching between article and pages,
   Note that we can not have direct template with this method.
#}

<div class="top-header mono">
  <h1><a href="/">Moonwalks.be</a></h1>
  <nav class="lang-menu">
    <ul>
      {% if article %}
        {# the active one is the one that is currently not in the translation list #}
        {# this means we have to order those items in css, if we want a fixed order
          otherwise the current one is always going to be the first #}
        <li id="lang__{{ article.lang}}"  class="active">
          <a href="{{ article.url }}">
            <span>{{ article.lang }}</span>
          </a>
        </li>
        {% for translation in article.translations %}
          <li id="lang__{{ translation.lang}}">
            <a href="{{ translation.url }}" hreflang="{{ translation.lang }}">
              <span>{{ translation.lang }}</span>
            </a>
          </li>
        {% endfor %}
      {% elif page %}
        {# exactly the same but with page object #}
        <li id="lang__{{ page.lang}}" class="active">
          <a href="{{ page.url }}">
            <span>{{ page.lang }}</span>
          </a>
        </li>
        {% for translation in page.translations %}
          <li id="lang__{{ translation.lang}}">
            <a href="{{ translation.url }}" hreflang="{{ translation.lang }}">
              <span>{{ translation.lang }}</span>
            </a>
          </li>
        {% endfor %}
      {% endif %}
    </ul>
  </nav>
</div>

<nav class="nav-menu">

    <ul class="nav-menu__pages">

      {% for cat, arts in categories %}
        <li id="nav__{{ cat }}" {% if category and cat == category %} class="active" {% endif %}>
          {% if current_lang == DEFAULT_LANG %}
            {# take the last dated article #}
            <a href="{{ arts[0].url }}"><span>{{ multilang[cat] }}</span></a>
          {% else %}
            {% for translation in arts[0].translations %}
              {% if translation.lang == current_lang %}
                <a href="{{ translation.url }}">
                  <span>{{ multilang[cat] }}</span>
                </a>
              {% endif %}
            {% endfor %}
          {% endif %}
        </li>
      {% endfor %}

      {% for p in pages %}
        {% if not p.partial %}
          <li id="nav__{{ p.slug }}" {% if page and p.slug == page.slug %} class="active"{% endif %}>
          {% if current_lang == DEFAULT_LANG %}
            <a href="{{ p.url }}"><span>{{ p.title }}</span></a>
          {% else %}
            {% for translation in p.translations %}
              {% if translation.lang == current_lang %}
                <a href="{{ translation.url }}">
                  <span>{{ translation.title }}</span>
                </a>
              {% endif %}
            {% endfor %}
          {% endif %}
          </li>
        {% endif %}
      {% endfor %}
    </ul>

    <div class="nav-menu__footer">
      <button class="open-footer">?</button>
    </div>

</nav>