KevinLecou
a1e24d1aa8
Palette affinée autour de l'accent brun/terracotta déjà en prod (continuité, pas de rupture) : tokens de couleur/rayon/ombre partagés entre la page upload et la galerie admin. Emoji remplacés par des icônes SVG inline (rendu cohérent multi-OS). Bloc de marque discret en en-tête des deux écrans invité/admin. Nouveau : carton imprimable A5 (src/admin/print-template/) qui génère le QR en direct via le module qrcode.js existant, prêt pour l'export PDF navigateur. Pas de police custom : stack système conservée pour rester sobre (zéro poids réseau supplémentaire).
66 lines
2.5 KiB
HTML
66 lines
2.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
|
<title>Galerie événement — admin</title>
|
|
<!--
|
|
Cette page est servie pour toute URL du type /admin/<slug> (le slug est lu
|
|
côté client depuis window.location.pathname, le token depuis les query
|
|
params ?token=..., voir gallery.js). Comme pour /e/<slug> (voir
|
|
src/e/index.html), ça suppose une règle de réécriture côté serveur qui
|
|
renvoie ce fichier pour toute requête sous /admin/* — hors scope de ce
|
|
fichier front, à mettre en place lors du déploiement.
|
|
-->
|
|
<meta name="robots" content="noindex, nofollow">
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
<body>
|
|
<main class="page">
|
|
<header class="page__header">
|
|
<p class="brand" aria-hidden="true">
|
|
<svg class="brand__mark" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" focusable="false">
|
|
<path d="M4 8h3l1.5-2h7L17 8h3a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1Z"/>
|
|
<circle cx="12" cy="13" r="3.5"/>
|
|
</svg>
|
|
<span class="brand__name">photobooth</span>
|
|
</p>
|
|
<h1 id="event-name">Galerie événement</h1>
|
|
<p id="event-meta" class="event-meta" hidden></p>
|
|
</header>
|
|
|
|
<section id="status-loading" class="state-block" role="status">
|
|
<p>Chargement de la galerie…</p>
|
|
</section>
|
|
|
|
<section id="status-error" class="state-block state-block--error" hidden role="alert">
|
|
<p id="status-error-message"></p>
|
|
<button type="button" id="retry-btn" hidden>Réessayer</button>
|
|
</section>
|
|
|
|
<section id="gallery-content" hidden>
|
|
<p id="status-banner" class="status-banner" hidden></p>
|
|
|
|
<div class="toolbar">
|
|
<button type="button" id="refresh-btn" class="btn btn--secondary">Actualiser</button>
|
|
<button type="button" id="download-zip-btn" class="btn">Télécharger tout (ZIP)</button>
|
|
</div>
|
|
<p id="zip-status" class="zip-status" aria-live="polite" hidden></p>
|
|
|
|
<p id="empty-state" class="state-block" hidden></p>
|
|
|
|
<ul id="photo-grid" class="photo-grid"></ul>
|
|
</section>
|
|
</main>
|
|
|
|
<!--
|
|
config.js n'est PAS commité (voir .gitignore) : copier config.example.js
|
|
en config.js et renseigner les vraies valeurs avant déploiement. Chargé en
|
|
script classique (donc synchrone, avant le module) pour garantir que
|
|
window.__PHOTOBOOTH_CONFIG__ existe avant l'exécution de gallery.js.
|
|
-->
|
|
<script src="config.js"></script>
|
|
<script type="module" src="gallery.js"></script>
|
|
</body>
|
|
</html>
|