From baa73c0c2eafccac336517f10e13d80f1766b92e Mon Sep 17 00:00:00 2001
From: Maxim Slipenko <no-reply@maxim.slipenko.com>
Date: Sun, 9 Jun 2024 08:14:56 +0300
Subject: [PATCH] fix: hide map while popup is opened

---
 src/info-popup.js | 30 +++++++++++++++++-------------
 src/style.css     |  4 +++-
 2 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/src/info-popup.js b/src/info-popup.js
index 6e7daa6..44e8a66 100644
--- a/src/info-popup.js
+++ b/src/info-popup.js
@@ -1,22 +1,26 @@
 import Cookies from "js-cookie";
+import { el } from "./utils.js";
 
 const HIDE_INFO_POPUP = "hideInfoPopup";
 
 document.addEventListener("DOMContentLoaded", function () {
-    const infoPopup = document.querySelector(".info-popup");
-    const noShowCheckbox = document.querySelector('input[name="no-show"]');
-    const confirmButton = document.querySelector('.info-popup footer button');
+  const infoPopup = document.querySelector(".info-popup");
+  const noShowCheckbox = document.querySelector('input[name="no-show"]');
+  const confirmButton = document.querySelector(".info-popup footer button");
+  const map = el("map");
 
-    const hidePopupCookie = Cookies.get(HIDE_INFO_POPUP);
-    if (!hidePopupCookie) {
-        infoPopup.style.display = "block";
-      }
+  const hidePopupCookie = Cookies.get(HIDE_INFO_POPUP);
+  if (!hidePopupCookie) {
+    infoPopup.style.display = "block";
+    map.style.display = "none";
+  }
 
-    confirmButton.addEventListener("click", function () {
-        if (noShowCheckbox.checked) {
-          Cookies.set(HIDE_INFO_POPUP, "true", { expires: 400 });
-        }
+  confirmButton.addEventListener("click", function () {
+    if (noShowCheckbox.checked) {
+      Cookies.set(HIDE_INFO_POPUP, "true", { expires: 400 });
+    }
 
-        infoPopup.style.display = "none";
-      });
+    infoPopup.style.display = "none";
+    map.style.display = "block";
+  });
 });
diff --git a/src/style.css b/src/style.css
index 6841c27..2b20d74 100644
--- a/src/style.css
+++ b/src/style.css
@@ -75,4 +75,6 @@ body {
 .ol-attribution a:hover {
   color: var(--ol-brand-color);
   text-decoration: underline;
-}
\ No newline at end of file
+}
+
+.info-popup-content > p { text-align:justify; }
\ No newline at end of file