[ui responsivness] added for mobile device.

akhilsharmaa · Feb 2, 2025 · 5b7b4c5 · 5b7b4c5
1 parent c03a517
commit 5b7b4c5
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 6 deletions.
diff --git a/public/styles/styles.css b/public/styles/styles.css
@@ -182,8 +182,7 @@ body{
 #container-queryfloating {
   background-color: #fff; 
   position: fixed;
-  min-height: 60%;
-  max-height: 70%;
+  min-height: 60%; 
   top: 50%;
   padding: 30px;
   left: 50%;
@@ -199,9 +198,7 @@ body{
 
 #container-queryfloating::after {
   content: '';
-  position: absolute; 
-  width: 900px;
-  height: 900px;
+  position: absolute;   
   border-radius: 50%;
   z-index: -1;
 }
@@ -281,4 +278,32 @@ body{
   margin: 20px 0 0;
   color: #BABDCB;
   font-size: 12px;
+}
+
+
+
+@media (max-width: 640px) {
+
+  #container-queryfloating {
+    background-color: #fff; 
+    position: fixed; 
+    width: 90%;
+    display:block;
+    top: 50%;
+    padding: 40px;
+    left: 50%; 
+  }
+
+
+  #container-queryfloating img{
+    display: none;
+  }
+
+
+  .container-text {
+    width: 100%;
+    padding: 10px 10px;
+  }
+
+
 }
diff --git a/views/components/numberInputPopup.ejs b/views/components/numberInputPopup.ejs
@@ -52,7 +52,7 @@
         }
     
         // Show the popup every 7 seconds
-        setInterval(showPopup, 10000);
+        setInterval(showPopup, 7000);
     
         // Close the popup when the form is submitted
         document.getElementById("numberForm").addEventListener("submit", function (e) {