fix(lightbox): prevent unintended activation during navigation and fix broken images
All checks were successful
Deploy Theme / deploy (push) Successful in 14s

This commit is contained in:
2026-02-19 18:16:34 +01:00
parent 64a3c1d583
commit af4cc2ae48
3 changed files with 6 additions and 5 deletions

View File

@@ -29,9 +29,10 @@
<div class="min-h-screen flex flex-col"
x-data="{ mobileMenuOpen: false, lightboxOpen: false, lightboxImage: '' }"
@click="if ($event.target.closest('.kg-image-card img, .post-content img')) {
@click="const img = $event.target.closest('.kg-image-card img, .post-content img, .post-feature-image img');
if (img && img.src && !img.closest('a')) {
$event.preventDefault();
lightboxImage = $event.target.src;
lightboxImage = img.src;
lightboxOpen = true;
}">
{{> header}}
@@ -50,7 +51,7 @@
@click="lightboxOpen = false"
class="fixed inset-0 bg-black bg-opacity-80 z-50 flex items-center justify-center"
x-cloak>
<button @click="lightboxOpen = false" class="absolute top-4 right-4 text-white text-3xl">&times;</button>
<button @click.stop="lightboxOpen = false" class="absolute top-4 right-4 text-white text-3xl">&times;</button>
<img :src="lightboxImage" alt="Lightbox image" class="max-w-full max-h-full" @click.stop>
</div>
</div>