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

{% block dashboardHome %}

    <div class="col-3" ></div>
        
    <div class="col-6" > 
        <table class="table table-hover table-striped mt-4 shadow">
            <thead class="">
                <tr>
                    <th class="col-3 border-start" scope="col">Opción</th>
                    <th class="col-6 border-start" scope="col">Valor</th>
                    <th class="col-2" scope="col"></th>
                </tr>
            </thead>
            <tbody class="table-group-divider align-middle">
                {% for field in configuration_fields %}
                    <tr>
                        <th class="border-start">{{ field.name| upper }}</th>
                        <td class="border-start">{{ field.value }}</td>
                        <td>
                            <a class="btn btn-warning" href="{{ path('configuration_edit', {'id': field.id} ) }}"><i class="fa-regular fa-pen-to-square"></i> </a>
                            <a class="btn btn-danger" href="{{ path('configuration_delete', {'id': field.id} ) }}"><i class="fa-solid fa-xmark"></i> </a>
                        </td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>

    <div class="col-3">
        <a href="{{ path('configuration_add') }}" class="btn btn-success mt-5 ms-5 shadow-sm"> <i class="fa-regular fa-square-plus"></i> Añadir opción</a>
    </div>

{% endblock %}