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

{% block title %}Liste des motifs {{ parent() }} {% endblock %}

{% block body %}
<div class="container mx-auto">    
    <h1 class="text-center text-5xl lg:text-2xl mt-10 font-bold my-10">Liste des motifs</h1>
        
        <table class="table border-2 border-gray-200 text-center px-10 w-full lg:mx-auto lg:w-5/6">
            <thead class="bg-slate-950 text-white ">
                <tr class="border justify-center">
                    <th class="border text-4xl lg:text-base py-6">Nom du motif</th>
                    <th class="border text-4xl lg:text-base py-6">Description</th>
                    <th class="border text-4xl lg:text-base py-6">Actions</th>
                </tr>
            </thead>
            {% for reason in reasons %}
            

            <tr class="border justify-center">
                <td class="border text-4xl lg:text-base p-4">{{ reason.name }}</td>
                {% if reason.description %}
                <td class="border text-4xl lg:text-base p-4" >{{ reason.description }}</td>
                {% else %}
                <td class="border text-4xl lg:text-base p-4">Pas de description</td>
                {% endif %}
                
                <td class="text-4xl lg:text-base p-4 flex flex-col text-center">
                    <a href="{{ path('app_reason_show', { id: reason.id }) }}" class="font-semibold text-3xl lg:text-lg btn bg-blue-300 py-2 lg:py-4 px-4 m-2 rounded shadow-sm">Voir</a>
                    <a href="{{ path('app_reason_edit', { id: reason.id }) }}" class="font-semibold text-3xl lg:text-lg btn bg-orange-300 py-2 lg:py-4 px-4 m-2 rounded shadow-sm">Modifier</a>

                </td>
            </tr>
            {% else %}
            <tr>
                <td colspan="9">Aucun enregistrement trouvé</td>
            </tr>
            {% endfor %}
        </table>
    </div>


{% endblock %}