Files
arts-ticule/templates/image/add.html.twig
2026-01-11 16:19:42 +01:00

42 lines
2.5 KiB
Twig

{% extends 'base_admin.html.twig' %}
{% block body %}
<main class="lg:pl-72">
<div class="xl:pr-96">
<div
class="px-4 py-10 sm:px-6 lg:px-8 lg:py-6 ">
<!-- Main area -->
<div class="col-span-full mt-60">
<div id="drop-zone" data-controller="image--drop-zone" data-image--drop-zone-target="dropZone" class="flex justify-center rounded-lg border border-dashed border-gray-900/25 px-6 py-10">
<div class="text-center">
<svg viewbox="0 0 24 24" fill="currentColor" data-slot="icon" aria-hidden="true" class="mx-auto size-12 text-gray-300">
<path d="M1.5 6a2.25 2.25 0 0 1 2.25-2.25h16.5A2.25 2.25 0 0 1 22.5 6v12a2.25 2.25 0 0 1-2.25 2.25H3.75A2.25 2.25 0 0 1 1.5 18V6ZM3 16.06V18c0 .414.336.75.75.75h16.5A.75.75 0 0 0 21 18v-1.94l-2.69-2.689a1.5 1.5 0 0 0-2.12 0l-.88.879.97.97a.75.75 0 1 1-1.06 1.06l-5.16-5.159a1.5 1.5 0 0 0-2.12 0L3 16.061Zm10.125-7.81a1.125 1.125 0 1 1 2.25 0 1.125 1.125 0 0 1-2.25 0Z" clip-rule="evenodd" fill-rule="evenodd"/>
</svg>
<div class="mt-4 flex justify-center text-sm/6 text-gray-600">
<label for="file-upload" onclick="event.stopPropagation()" class="relative cursor-pointer rounded-md bg-white font-semibold text-amber-600 focus-within:outline-2 focus-within:outline-offset-2 focus-within:outline-amber-600 hover:text-amber-500">
<span>Télécharger des fichiers</span>
<input id="file-upload" type="file" name="file-upload[]" class="sr-only" multiple data-image--drop-zone-target="input"/>
</label>
<p class="pl-1">ou glisser-déposer</p>
</div>
<div>
<p class="text-xs/5 text-gray-600">PNG, JPG, GIF jusqu'à 10 Mo</p>
</div>
<div data-image--drop-zone-target="preview" class="mt-4 flex flex-wrap gap-2"></div>
<div class="mt-4 flex justify-center">
{% include "component/loader.html.twig" %}
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<aside
class="fixed inset-y-0 right-0 hidden w-96 overflow-y-auto border-l border-gray-200 px-4 py-6 sm:px-6 lg:px-8 xl:block dark:border-white/10">
<!-- Secondary column (hidden on smaller screens) -->
<a href="{{ path('admin_image_index') }}" class="rounded-md bg-amber-600 px-4 py-2.5 text-sm font-semibold text-white shadow-xs hover:bg-amber-500 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-amber-600 dark:bg-amber-500 dark:shadow-none dark:hover:bg-amber-400 dark:focus-visible:outline-amber-500">Mes images</a>
</aside>
{% endblock %}