From efd5f3caecee24abadaf72ea9f3e02d51918af4d Mon Sep 17 00:00:00 2001
From: cmoinier <cmoinier@wrk208.wrk.prs.camptocamp.com>
Date: Fri, 17 Jan 2025 15:55:24 +0100
Subject: [PATCH] fix: fix thumbnail not opening by extracting css of
 basiclightbox

---
 apps/geoadmin-demo/src/styles.css | 58 +++++++++++++++++++++++++++++++
 1 file changed, 58 insertions(+)

diff --git a/apps/geoadmin-demo/src/styles.css b/apps/geoadmin-demo/src/styles.css
index 2ef289ba1..81a4c5120 100644
--- a/apps/geoadmin-demo/src/styles.css
+++ b/apps/geoadmin-demo/src/styles.css
@@ -127,3 +127,61 @@ html {
 .close-btn:hover {
   background: #d32f2f;
 }
+
+.basicLightbox {
+  position: fixed;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100vh;
+  background: rgba(0, 0, 0, 0.8);
+  opacity: 0.01;
+  transition: opacity 0.4s ease;
+  z-index: 1000;
+  will-change: opacity;
+}
+.basicLightbox--visible {
+  opacity: 1;
+}
+.basicLightbox__placeholder {
+  max-width: 100%;
+  transform: scale(0.9);
+  transition: transform 0.4s ease;
+  z-index: 1;
+  will-change: transform;
+}
+.basicLightbox__placeholder > iframe:first-child:last-child,
+.basicLightbox__placeholder > img:first-child:last-child,
+.basicLightbox__placeholder > video:first-child:last-child {
+  display: block;
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  margin: auto;
+  max-width: 95%;
+  max-height: 95%;
+}
+.basicLightbox__placeholder > iframe:first-child:last-child,
+.basicLightbox__placeholder > video:first-child:last-child {
+  pointer-events: auto;
+}
+.basicLightbox__placeholder > img:first-child:last-child,
+.basicLightbox__placeholder > video:first-child:last-child {
+  width: auto;
+  height: auto;
+}
+.basicLightbox--iframe .basicLightbox__placeholder,
+.basicLightbox--img .basicLightbox__placeholder,
+.basicLightbox--video .basicLightbox__placeholder {
+  width: 100%;
+  height: 100%;
+  pointer-events: none;
+}
+.basicLightbox--visible .basicLightbox__placeholder {
+  transform: scale(1);
+}