Update index.html

imskumarj · May 9, 2024 · e6366c9 · e6366c9
1 parent edfe4aa
commit e6366c9
Showing 1 changed file with 36 additions and 1 deletion.
diff --git a/index.html b/index.html
@@ -62,17 +62,52 @@ <h2>To Be Announced Soon</h2>
             </div>
         </div>
     </main>
+<!-- Add this code inside the <body> tag, after the <main> element -->
+<div id="myModal" class="modal">
+  <div class="modal-content">
+    <span class="close">&times;</span>
+    <h2>Select a Platform:</h2>
+    <div class="platform-buttons">
+      <a href="URL_FOR_FLIPKART" class="custom-button">Flipkart</a>
+      <a href="URL_FOR_AMAZON" class="custom-button">Amazon</a>
+      <a href="https://notionpress.com/read/chaos" target="_blank" class="custom-button">Notion Press</a>
+    </div>
+  </div>
+</div>
 
     <footer>
         <p>© 2024 Sudhansu Kumar • Find Github repository <a href="https://github.com/imskumarj/sidgrey.git/">here</a></p>
     </footer>
-<script>
+
+    <script>
     document.addEventListener("DOMContentLoaded", function () {
         const fadeElements = document.querySelectorAll(".fade-in");
         fadeElements.forEach((element) => {
             element.classList.add("visible");
         });
     });
 </script>
+
+    <script>
+  document.addEventListener("DOMContentLoaded", function () {
+    const modal = document.getElementById("myModal");
+    const btn = document.querySelector(".book-details a");
+    const span = document.getElementsByClassName("close")[0];
+
+    btn.onclick = function () {
+      modal.style.display = "block";
+    }
+
+    span.onclick = function () {
+      modal.style.display = "none";
+    }
+
+    window.onclick = function (event) {
+      if (event.target == modal) {
+        modal.style.display = "none";
+      }
+    }
+  });
+</script>
 </body>
 </html>