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

{% block title %}Ajouter une image{% endblock %}

{% block body %}
    <h1 class="wrap text-light font-h text-center">GALERIE DE {{article.getTitre()}}</h1>

    <div class="wrap admin-buttons mh-4">
        <div class="d-grid w-auto">
            <a class="button" href="{{ path('app_news_edit', {'id': article.getId()}) }}">
                <i class="fa-solid fa-arrow-left mr-1"></i> Annuler l'ajout
            </a>
        </div>
    </div>

    <section class="wrap mb-4">
        <h2 class="text-light font-h text-center">AJOUTER UNE NOUVELLE IMAGE</h2>

        {{ include('image/_form.html.twig') }}
    </section>

    <section class="wrap mh-4 pt-2">
        <h2 class="text-light font-h text-center mb-3">AJOUTER UNE IMAGE PRÉEXISTENTE</h2>
        <div class="text-white text-center m-0 mb-3 p-0 ph-1">
            Cliquez sur l'image que vous souhaitez ajouter à la galerie de l'article.
        </div>

        <div class="media-gallery mb-4">
            {% for image in images %}
                <div>
                    <a class="" href="{{ path('app_news_gallery_image_add', {'id': article.getId(), 'image': image.getId()}) }}">
                        <div class="border-highlight bg-white p-1">
                            <img class="media-thumbnail" src="{{ vich_uploader_asset(image) }}" alt="{{ image.getTexteAlt() }}">
                            <p class="m-0 p-1 pt-2">
                                {{image.getTexteAlt()}}
                            </p>
                        </div>
                    </a>
                </div>
            {% endfor %}
        </div>
    </section>
{% endblock %}