{% extends "base.html" %}

{% block head %}
    {% block title %}
        <title>{{ _('Archivos de %(sitename)s', sitename=SITENAME) }}</title>
    {% endblock %}
    {{ super() }}
    {% block seo %}
        <meta name="description" content="{{ _('Lista de artículos publicados en %(sitename)s', sitename=SITENAME) }}"/>
        <meta name="keywords" content="{{ _('archivos,artículos,historia,lista de artículos') }}"/>
        <style>
         .content ul, .content ul ul, .content ul ul ul {
             list-style:none !important;
         }
         .content ul {
             margin-left: 0px !important;
         }
         .contenedor-arbol, .contenedor-arbol ul, .contenedor-arbol li {
             position: relative;
             margin: 0;
             padding-left: 2%;
             line-height: normal;
         }
         .contenedor-arbol ul {
             list-style: none;
         }
         .contenedor-arbol li::before, .contenedor-arbol li::after {
             content: "";
             position: absolute;
             left: -12px;
         }
         .contenedor-arbol li::before {
             border-top: 2px solid #000;
             top: 9px;
             width: 12px;
             height: 0;
         }
         .contenedor-arbol li::after {
             border-left: 2px solid black;
             height: 100%;
             width: 0px;
             top: 2px;
         }
         .contenedor-arbol ul > li:last-child::after {
             height: 8px;
         }
        </style>
    {% endblock %}
{% endblock %}

{% block content %}
<!-- Main -->
<div class="row mt-6 mt-10">
    <div class="col-md-9 mx-auto text-justify">
        <!-- dinamic page content  -->
        <div class="contenedor-arbol ml-3">
            <p>{{ ngettext('%(num)d artículo', '%(num)d artículos', dates|length) }}</p>
            <ul>
                {% for article in dates %}
                {% set current_year = article.date|strftime('%Y') %}
                {% set current_month = article.date|strftime('%m') %}
                {% if loop.previtem %}
                {% set previous_year = loop.previtem.date|strftime('%Y') %}
                {% set previous_month = loop.previtem.date|strftime('%m') %}
                {% endif %}
                {% if current_year != previous_year %}
                {% if loop.previtem %}
            </ul>
            </li> <!-- Cierra el mes -->
            </ul>
            </li> <!-- Cierra el año -->
            {% endif %}
            <li><a href="{{ SITEURL }}/archives/{{ current_year }}/">{{ current_year }}</a>
            <ul>
            <li><a href="{{ SITEURL }}/archives/{{ current_year }}/{{ current_month }}/">{{ article.date|strftime('%B') }}</a>
            <ul>
            {% elif current_month != previous_month %}
            {% if loop.previtem %}
            </ul>
            </li>
            {% endif %}
            <li><a href="{{ SITEURL }}/archives/{{ current_year }}/{{ current_month }}/">{{ article.date|strftime('%B') }}</a>
            <ul>
            {% endif %}
            <li><a href="{{ SITEURL }}/{{ article.url }}" title="{{ article.locale_date}}">{{ article.title }}</a></li>
            {% if loop.last %}
            </ul>
            </li> <!-- Cierra el mes -->
            </ul>
            </li> <!-- Cierra el año -->
            {% endif %}
            {% endfor %}
            </ul>
        </div>
        <!-- End dinamic page content  -->
    </div>
</div>
<!-- End Main -->
{% endblock %}