Merge pull request #679 from Riyachauhan11/main

fixing button display issues and vote popup
YadavAkhileshh · Nov 6, 2024 · fb76197 · fb76197
2 parents f88122b + 81b0a22
commit fb76197
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 36 deletions.
diff --git a/index.html b/index.html
@@ -91,16 +91,27 @@
 
    }
 
-   .popup-content {
 
-       background: linear-gradient(rgb(3 0 28 / 80%), rgb(0 2 55 / 80%)), url(your-image-url.jpg);
-       padding: 20px;
-       border-radius: 5px;
-       max-width: 300px;
-       text-align: center;
+.popup-content {
+    background: linear-gradient(rgb(255 255 255 / 90%), rgb(240 240 240 / 90%)), url(your-image-url-light.jpg);
+    color: #333; /* Darker text color for readability */
+    padding: 20px;
+    border-radius: 5px;
+    max-width: 300px;
+    text-align: center;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Light shadow for subtle depth */
+}
+
+.dark-theme .popup-content {
+
+background: linear-gradient(rgb(3 0 28 / 80%), rgb(0 2 55 / 80%)), url(your-image-url.jpg);
+padding: 20px;
+border-radius: 5px;
+max-width: 300px;
+text-align: center;
+color: whitesmoke;
+}
 
-   }
-
    /* Set poll options to stack vertically */
    #pollOptions {
 
@@ -414,7 +425,7 @@ <h2 class="uppercase">What power-up do you find most helpful?</h2>
     }
 
     // Set timeout for poll display
-    setTimeout(checkAndDisplayPollPopup, 10000);
+    setTimeout(checkAndDisplayPollPopup, 6000);
 
     // Manage user selections and votes
     const pollButtons = document.querySelectorAll('.poll-button[data-value]');
@@ -1080,8 +1091,8 @@ <h2 class="primary-btn" id="logoutButton" style="display: none;">
         gsap.from("#header", { opacity: 0, duration: 1.5, delay: 1.5, ease: "power2.out" });
 
         // Sequential animations for interactive buttons and controls
-        gsap.from("#startButton", { scale: 0, duration: 0.8, delay: 2, ease: "elastic.out" });
-        gsap.from("#pauseBtn", { x: -50, opacity: 0, duration: 1, delay: 2.5, ease: "back.out" });
+        gsap.from("#startButton", { x: -50, duration: 0.8, delay: 2, ease: "elastic.out" });
+        gsap.from("#pauseBtn", { x: -50, duration: 1, delay: 2.5, ease: "back.out" });
         gsap.from("#levelSelect", { x: 50, opacity: 0, duration: 1, delay: 3, ease: "back.out" });
 
         // Staggered poll button animations

diff --git a/popup.js b/popup.js
@@ -1,39 +1,45 @@
 // Show the pop-up automatically when the page loads
-window.onload = function() {
-    document.getElementById('popup-nl').style.display = 'flex';
-  };
+window.onload = function () {
+  document.getElementById("popup-nl").style.display = "flex";
+};
 
-  // Close the pop-up when the user clicks the close button
-  document.querySelector('.close-nl').addEventListener('click', function() {
-    document.getElementById('popup-nl').style.display = 'none';
-  });
+// Close the pop-up when the user clicks the close button
+document.querySelector(".close-nl").addEventListener("click", function () {
+  document.getElementById("popup-nl").style.display = "none";
+});
 
-  if (localStorage.getItem("noThanksClicked") === "true") {
-    document.getElementById('popup-nl').style.visibility = 'hidden';
-  }
+if (localStorage.getItem("noThanksClicked") === "true") {
+  document.getElementById("popup-nl").style.visibility = "hidden";
+}
 
-  // // Close the pop-up when clicking outside the pop-up content
-  // window.addEventListener('click', function(event) {
-  //   const popupContent = document.querySelector('.popup-content'); // Select the popup content
-  //   if (event.target === document.getElementById('popup')) {
-  //       document.getElementById('popup').style.display = 'none';
-  //   }
-  // });
+// // Close the pop-up when clicking outside the pop-up content
+// window.addEventListener('click', function(event) {
+//   const popupContent = document.querySelector('.popup-content'); // Select the popup content
+//   if (event.target === document.getElementById('popup')) {
+//       document.getElementById('popup').style.display = 'none';
+//   }
+// });
 
-  // Handle form submission
-  document.getElementById('emailForm-nl').addEventListener('submit', function(event) {
+// Handle form submission
+document
+  .getElementById("emailForm-nl")
+  .addEventListener("submit", function (event) {
     event.preventDefault();
 
-    const email = document.getElementById('email-nl').value;
+    const email = document.getElementById("email-nl").value;
     if (email) {
-      alert(`Your email ID ${email} has been registered successfully for the newsletter.`);
-      document.getElementById('popup').style.display = 'none';
+      alert(
+        `Your email ID ${email} has been registered successfully for the newsletter.`
+      );
+      document.getElementById("popup").style.display = "none";
     }
   });
 
-  // Handle "No thanks" link
-  document.querySelector('.no-thanks-nl').addEventListener('click', function(event) {
+// Handle "No thanks" link
+document
+  .querySelector(".no-thanks-nl")
+  .addEventListener("click", function (event) {
     event.preventDefault();
-    document.getElementById('popup-nl').style.display = 'none';
+    document.getElementById("popup-nl").style.display = "none";
     localStorage.setItem("noThanksClicked", "true");
   });