From be370cbbe97b97b10d617778c70302d853a070c6 Mon Sep 17 00:00:00 2001
From: zepp <zepp@zepps.cafe>
Date: Mon, 3 Mar 2025 16:38:46 -0500
Subject: [PATCH] remove image enlarging script from project

---
 src/pages/life/self/entries/picrew.astro |  3 --
 src/scripts/image-enlarger.js            | 64 ------------------------
 2 files changed, 67 deletions(-)
 delete mode 100644 src/scripts/image-enlarger.js

diff --git a/src/pages/life/self/entries/picrew.astro b/src/pages/life/self/entries/picrew.astro
index 83158ee..b8f9699 100644
--- a/src/pages/life/self/entries/picrew.astro
+++ b/src/pages/life/self/entries/picrew.astro
@@ -85,7 +85,4 @@ const title = "emma's picrews"
             <figcaption><a href=`${imageFourCreditUrl}` target="_blank">{imageFourCreditText}</a></figcaption>
         </figure>
     </div>
-    <script>
-        import "../../../../scripts/image-enlarger"
-    </script>
 </BasicLayout>
\ No newline at end of file
diff --git a/src/scripts/image-enlarger.js b/src/scripts/image-enlarger.js
deleted file mode 100644
index 4b0b0ee..0000000
--- a/src/scripts/image-enlarger.js
+++ /dev/null
@@ -1,64 +0,0 @@
-const enlargeImg = document.querySelectorAll(".enlarge");
-const body = document.querySelector("body");
-const main = document.querySelector("main");
-const nav = document.querySelector("nav");
-const header = document.querySelector("header");
-// script tag needs defer attribute as footer is included by php
-// after script tag. defer makes sure the script is loaded after
-// everything else on the page has loaded
-const footer = document.querySelector("footer");
-
-enlargeImg.forEach((img) => {
-  img.style.cursor = "pointer";
-
-  img.addEventListener("click", () => {
-    // make background for image
-    let div = document.createElement("div");
-    div.style.display = "flex";
-    div.style.flexDirection = "column";
-    div.style.alignItems = "center";
-    div.style.justifyContent = "center";
-    div.style.height = "100vh";
-    div.style.width = "auto";
-    div.style.backgroundColor = "#000000";
-
-    // image element
-    let image = document.createElement("img");
-    image.src = img.src;
-    image.style.height = "80%";
-    image.style.width = "auto";
-    div.append(image);
-
-    let paragraph = document.createElement("p");
-    paragraph.textContent =
-      "Click anywhere on the image or the black background to close. You can also press the x key on your keyboard.";
-    paragraph.style.color = "#FFFFFF";
-    div.append(paragraph);
-    // hide current page contents
-    main.style.display = "none";
-    nav.style.display = "none";
-    footer.style.display = "none";
-    header.style.display = "none";
-
-    // remove display: grid from body and append div with enlarged image
-    body.style.display = "block";
-    body.append(div);
-
-    const removeDiv = () => {
-      div.remove();
-      body.style.display = "grid";
-      main.style.display = "block";
-      nav.style.display = "block";
-      header.style.display = "flex";
-      footer.style.display = "flex";
-    };
-
-    div.addEventListener("click", removeDiv);
-
-    body.addEventListener("keydown", (e) => {
-      if (e.key === "x") {
-        removeDiv();
-      }
-    });
-  });
-});