{% extends "base.html" %}

{% block html_lang %}{{ article.lang }}{% endblock %}
{% set current_lang = article.lang %}

{% block head %}
  {{ super() }}
  <link rel="stylesheet" type="text/css" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/article.css" />
{% endblock %}

{% block body_class %}article{% endblock %}

{% block content %}

<section id="projects-section" class="data-section" data-box-title="{{ multilang.projects }}">
  <nav class="nav-projects mono">
    <ul>
      {# ---> list all the 'projects' article in the current language #}
      {% for art in articles %}
        {% if art.category == 'projects' %}
          {% if current_lang == DEFAULT_LANG %}
            <li {% if art == article %} class="active" {% endif %}>
              <a href="{{ art.url }}">{{ art.title }}</a>
            </li>
          {% else %}
            {% for translation in art.translations %}
              {% if translation.lang == current_lang %}
                <li {% if translation == article %} class="active" {% endif %}>
                  <a href="{{ translation.url }}" hreflang="{{ translation.lang }}">{{ translation.title }}</a>
                </li>
              {% endif %}
            {% endfor %}
          {% endif %}
        {% endif %}
      {% endfor %}
    </ul>
  </nav>
</section>

<section id="{{ article.title }}-section" class="data-section" data-box-title="{{ article.title }}">
  <div class="text-content moon-phased-typo">
    {{ article.content }}
  </div>
</section>

{% if article.quotes %}
  <section id="{{ article.title }}-quotes-section" class="data-section" data-box-title="{{ multilang.quotes }}">
    <div class="text-content article-quotes">
      {{ article.quotes }}
    </div>
  </section>
{% endif %}

{% endblock %}