Work around a really fucking weird bug with iframes, bruuuuh

src/components/UVRegistrar.astro

@@ -15,15 +15,17 @@
         if (!isUrl(url)) url = 'https://www.google.com/search?q=' + url;
         else if (!(url.startsWith('https://') || url.startsWith('http://'))) url = 'http://' + url;
 
-        let iframe = document.createElement('iframe');
+        let iframe = document.getElementById('proxy-frame');
         iframe.src = window.__uv$config.prefix + window.__uv$config.encodeUrl(url);
+        iframe.style.pointerEvents = "auto";
         iframe.classList.add("proxy-frame");
-        iframe.style.opacity = 0;
         document.body.appendChild(iframe);
         iframe.addEventListener('load', () => {
+            let topBar = document.getElementById('top-bar');
             loadingContent.style.opacity = 0;
             iframe.style.opacity = 1;
-            let topBar = document.createElement('div');
+            topBar.style.opacity = 1;
+            topBar.innerHTML = "";
             topBar.classList.add("top-bar");
             let closeButton = document.createElement('button');
             closeButton.classList.add("close-button")
@@ -31,14 +33,13 @@
             closeButton.addEventListener('click', () => {
                 iframe.style.opacity = 0;
                 topBar.style.opacity = 0;
-                setTimeout(() => {
-                    iframe.remove();
-                    topBar.remove();
-                }, 500);
+                iframe.style.pointerEvents = "none";
+                topBar.style.pointerEvents = "none";
             });
             let urlText = document.createElement('p');
             urlText.classList.add("url-text");
             urlText.innerText = url
+            topBar.style.pointerEvents = "auto";
             topBar.appendChild(closeButton);
             topBar.appendChild(urlText);
             document.body.appendChild(topBar);

src/layouts/Layout.astro

@@ -83,23 +83,27 @@ body > * {
     width: 100%;
     height: 60vh;
 }
-.proxy-frame {
+#proxy-frame {
   display: block;
   position: absolute;
   z-index: 1000;
   width: 100vw;
-  height: 90vh;
-  top: 10vh;
+  height: 100vh;
+  top: 5vh;
   border: none;
   background-color: #080808;
-  transition: opacity 250ms ease-in-out
+  transition: opacity 250ms ease-in-out;
+  pointer-events: none;
+}
+#proxy-frame {
+  opacity: 0;
 }
 .top-bar {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 0 1rem;
-  height: 10vh;
+  height: 5vh;
   background-color: #080808;
   color: white;
   position: fixed;
@@ -108,6 +112,7 @@ body > * {
   width: 100vw;
   z-index: 100;
   transition: opacity 250ms ease-in-out;
+  pointer-events: none;
 }
 .close-button {
   padding: 5px;

src/pages/index.astro

@@ -9,6 +9,8 @@ import UVRegistrar from '../components/UVRegistrar.astro';
     <form class="url-input-form" id="url-input-form">
       <input class="url-input" type="text" placeholder="Search...">
       <div id="loading-content">Loading...</div>
+      <div id="top-bar"></div>
+      <iframe src="" id="proxy-frame"></iframe>
     </form>
 	</div>
   <UVRegistrar></UVRegistrar>