{% extends 'base.html.twig' %}

{% block title %}{{category.title}}{% endblock %}

{% block body %}
    <main class="mt-5 pt-5">
        <div class="container">
            <h1 class="text-center h1-responsive m-5">{{category.title}}</h1>
            <p class="text-center dark-grey-text w-responsive mx-auto mb-5">
                {{category.description}}
            </p>

            {% if category.type == 2 %}
                {% set entity = category.articles %}
            {% else %}
                 {% set entity = category.courses %}
            {% endif %}
            {% for article in entity %}
                            
                    <div class="col-lg-4 col-md-6 col-sm-12 mb-lg-0 mb-4 text-justify">

                        <!-- Featured image -->
                        <div class="view overlay rounded z-depth-2 mb-4">
                                {{imgNoFile(article.cover.name, article.cover.title, 'auto', 'auto', 'img-fluid')|raw}}
                            <a>
                            <div class="mask rgba-white-slight">
                                
                            </div>
                            </a>
                        </div>

                        
                        <!-- Post title -->
                        <h3 class=" mb-3 text-center"><strong>{{ article.title}}</strong></h3>
                        <p class="small"><strong>Dernière modification :</strong> Il y a {{ relativeTime(article.updatedAt)}}</p>
                        <!-- Excerpt -->
                        <p class="dark-grey-text mt-2">{{ article.description}}</p>
                        <!-- Read more button -->
                        <div class="text-center">
                        <a class=" btn btn-sm  w-responsive btn-{{ category.color }} btn-rounded btn-md" href="{{path('article_show', { 'slug':article.slug})}}">Voir plus</a>
                        </div>

                    </div>
                    <!-- Grid column -->

            {% endfor %}
        </div>
    </main>
   


{% endblock %}