{% extends "layout.html" %}

{% block error %}
    {%if error_item %}
    <div class="py5 alert alert-info" role="alert">
        l'item {{ error_item }} est déjà dans la liste
    </div>
    {% endif %}
{% endblock %}

{% block content %}
    <div class="container">
            <div class="py-1">
                <p>Bienvenue dans l'administration de votre blog</p>
            </div>

            <div class="py-1">
                <p class="text-right pb-1">
                    <a href="/admin/articles/add/" class="btn btn-primary">Ajouter un article</a>
                </p>

                <table class="table table-hover">
                  <thead>
                    <tr>
                      <th scope="col">#</th>
                      <th scope="col">Title</th>
                      <th scope="col">Excerpt</th>
                      <th scope="col text-center" colspan="2">Actions</th>
                    </tr>
                  </thead>

                  <tbody>
                    {% for article in articles %}
                    <tr>
                      <th scope="row">{{ article['id'] }}</th>
                      <td>{{ article['title'] }}</td>
                      <td>{{ article['excerpt']|truncate(70, '...') }}</td>
                      <td><a href="/admin/articles/{{ article['id'] }}/">modifier</a></td>
                      <td><a href="/admin/articles/{{ article['id'] }}/delete/" style="float:right; color: #ff4a4a">supprimer</a></td>
                    </tr>
                    {% endfor %}
                  </tbody>
                </table>

            </div>
    </div>
{% endblock %}