66 lines
2.8 KiB
Plaintext
66 lines
2.8 KiB
Plaintext
<!doctype html>
|
|
<html lang="en" class="dark">
|
|
{{ head_html|safe }}
|
|
<body class="noir-page noir-surface antialiased min-h-screen flex flex-col" data-noir-template="full-width">
|
|
{{ admin_banner_html|safe }}
|
|
<header class="w-full hairline-b">
|
|
<div class="max-w-5xl mx-auto px-6">{{ slots.header|safe }}</div>
|
|
</header>
|
|
<main class="flex-grow w-full">
|
|
{% if slots.main %}{{ slots.main|safe }}{% else %}<div class="max-w-5xl mx-auto py-24 px-6 text-center"><p class="tracked-mono" style="color: hsl(var(--mutedForeground));">No photographs assigned to this page.</p></div>{% endif %}
|
|
</main>
|
|
<footer class="w-full mt-auto">{{ slots.footer|safe }}</footer>
|
|
<script>
|
|
(function() {
|
|
if (window.__noirLightboxInit) return;
|
|
window.__noirLightboxInit = true;
|
|
var overlay = null;
|
|
function ensureOverlay() {
|
|
if (overlay) return overlay;
|
|
overlay = document.createElement('div');
|
|
overlay.setAttribute('data-noir-lightbox', '');
|
|
overlay.setAttribute('aria-hidden', 'true');
|
|
overlay.setAttribute('role', 'dialog');
|
|
overlay.setAttribute('aria-modal', 'true');
|
|
overlay.innerHTML = '<button type="button" class="noir-lightbox-close tracked-mono" aria-label="Close">Close</button><img alt="" /><div class="noir-lightbox-caption tracked-mono"></div>';
|
|
document.body.appendChild(overlay);
|
|
overlay.addEventListener('click', function(e) { if (e.target === overlay) close(); });
|
|
overlay.querySelector('.noir-lightbox-close').addEventListener('click', close);
|
|
document.addEventListener('keydown', function(e) {
|
|
if (overlay.getAttribute('aria-hidden') === 'false' && e.key === 'Escape') close();
|
|
});
|
|
return overlay;
|
|
}
|
|
function open(src, alt, caption) {
|
|
var o = ensureOverlay();
|
|
var img = o.querySelector('img');
|
|
img.src = src;
|
|
img.alt = alt || '';
|
|
o.querySelector('.noir-lightbox-caption').textContent = caption || '';
|
|
o.setAttribute('aria-hidden', 'false');
|
|
o.querySelector('.noir-lightbox-close').focus();
|
|
}
|
|
function close() {
|
|
if (!overlay) return;
|
|
overlay.setAttribute('aria-hidden', 'true');
|
|
}
|
|
document.addEventListener('click', function(e) {
|
|
var t = e.target.closest('[data-noir-lightbox-trigger]');
|
|
if (!t) return;
|
|
e.preventDefault();
|
|
open(t.getAttribute('data-src'), t.getAttribute('data-alt'), t.getAttribute('data-caption'));
|
|
});
|
|
document.addEventListener('keydown', function(e) {
|
|
if (e.key !== 'Enter' && e.key !== ' ') return;
|
|
var t = document.activeElement;
|
|
if (t && t.matches && t.matches('[data-noir-lightbox-trigger]')) {
|
|
e.preventDefault();
|
|
open(t.getAttribute('data-src'), t.getAttribute('data-alt'), t.getAttribute('data-caption'));
|
|
}
|
|
});
|
|
})();
|
|
</script>
|
|
{{ body_end_html|safe }}
|
|
</body>
|
|
</html>
|