updated how to use aed

ctkqiang · Nov 4, 2024 · 97dfbdb · 97dfbdb
1 parent badb7ce
commit 97dfbdb
Showing 1 changed file with 56 additions and 61 deletions.
diff --git a/public/index.ejs b/public/index.ejs
@@ -15,64 +15,64 @@
     <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
     <style>
+      @media (max-width: 768px) {
 
-    @media (max-width: 768px) {
-      /* Hide screenshot column on mobile */
-      .hero-section .col-lg-6:last-child {
-        display: none;
-      }
+        /* Hide screenshot column on mobile */
+        .hero-section .col-lg-6:last-child {
+          display: none;
+        }
 
-      /* Make the text column full width */
-      .hero-section .col-lg-6:first-child {
-        width: 100%;
-        text-align: center;
-        padding: 40px 20px;
-      }
+        /* Make the text column full width */
+        .hero-section .col-lg-6:first-child {
+          width: 100%;
+          text-align: center;
+          padding: 40px 20px;
+        }
 
-      /* Adjust hero section height for mobile without image */
-      .hero-section {
-        min-height: 60vh;
-        padding: 60px 0;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-      }
+        /* Adjust hero section height for mobile without image */
+        .hero-section {
+          min-height: 60vh;
+          padding: 60px 0;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+        }
 
-      /* Center the button */
-      .hero-section .btn {
-        margin: 0 auto;
-        display: block;
-      }
+        /* Center the button */
+        .hero-section .btn {
+          margin: 0 auto;
+          display: block;
+        }
 
-      /* Adjust text sizes for better mobile readability */
-      .hero-section .display-4 {
-        font-size: 2.2rem;
-        margin-bottom: 1rem;
+        /* Adjust text sizes for better mobile readability */
+        .hero-section .display-4 {
+          font-size: 2.2rem;
+          margin-bottom: 1rem;
+        }
+
+        .hero-section .lead {
+          font-size: 1.1rem;
+          margin-bottom: 2rem;
+        }
       }
 
-      .hero-section .lead {
-        font-size: 1.1rem;
-        margin-bottom: 2rem;
+      .hero-section {
+        background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.7)), url('/assets/illustration/paramedic-giving-oxygen-injured-girl_107420-63759.webp');
+        background-size: cover;
+        background-position: center;
+        background-attachment: fixed;
+        color: white;
+        padding: 100px 0;
+        min-height: 100vh;
+        position: relative;
       }
-    }
-
-    .hero-section {
-            background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.7)), url('/assets/illustration/paramedic-giving-oxygen-injured-girl_107420-63759.webp');
-            background-size: cover;
-            background-position: center;
-            background-attachment: fixed;
-            color: white;
-            padding: 100px 0;
-            min-height: 100vh;
-            position: relative;
-        }
 
-        /* Add this for better text readability */
-        .hero-content {
-            position: relative;
-            z-index: 2;
-            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
-        }
+      /* Add this for better text readability */
+      .hero-content {
+        position: relative;
+        z-index: 2;
+        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
+      }
 
       .feature-card {
         transition: transform 0.3s ease;
@@ -100,7 +100,8 @@
 
       .screenshot:hover {
         border-radius: 20px;
-        transform: perspective(1000px) rotateY(15deg) translateY(-20px); /* Reduced rotation and translation for subtlety */
+        transform: perspective(1000px) rotateY(15deg) translateY(-20px);
+        /* Reduced rotation and translation for subtlety */
       }
 
       .screenshot img {
@@ -114,17 +115,20 @@
       .screenshot img:hover {
         border-radius: 20px;
         backdrop-filter: blur(30px);
-        transform: scale(1.1); /* Reduced scale for smoother effect */
+        transform: scale(1.1);
+        /* Reduced scale for smoother effect */
       }
 
       /* Add smooth animation */
       @keyframes float {
         0% {
           transform: perspective(1000px) rotateY(-5deg) translateY(0);
         }
+
         50% {
           transform: perspective(1000px) rotateY(5deg) translateY(-10px);
         }
+
         100% {
           transform: perspective(1000px) rotateY(-5deg) translateY(0);
         }
@@ -231,8 +235,6 @@
         font-size: var(--base-font-size);
       }
 
-
-
       @keyframes pulse {
         0% {
           transform: scale(1);
@@ -252,7 +254,7 @@
       }
     </style>
   </head>
-  <body onload='sessionStorage.removeItem('modalShown');'>
+  <body onload='sessionStorage.removeItem(' modalShown');'>
     <!-- Navigation -->
     <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
       <div class="container">
@@ -279,7 +281,6 @@
         </div>
       </div>
     </nav>
-
     <!-- Sponsorship Modal -->
     <div class="modal fade" id="sponsorshipModal" tabindex="-1" aria-labelledby="sponsorshipModalLabel" aria-hidden="true">
       <div class="modal-dialog modal-dialog-centered">
@@ -300,7 +301,6 @@
         </div>
       </div>
     </div>
-
     <!-- Hero Section -->
     <section class="hero-section d-flex align-items-center">
       <div class="container">
@@ -437,7 +437,6 @@
         // sponsorshipModal.show();
         // Show modal on scroll
         window.addEventListener('scroll', () => {
-
           if (!sessionStorage.getItem('modalShown') && window.scrollY > 1) {
             console.log("Showing modal");
             sponsorshipModal.show();
@@ -446,18 +445,14 @@
           }
         });
       });
-
       // Alternative trigger - you can remove this after confirming the modal works
       function testModal() {
         const modalEl = document.getElementById('sponsorshipModal');
         const modal = new bootstrap.Modal(modalEl);
         modal.show();
       }
-
       const userLanguage = navigator.language || navigator.userLanguage;
-
       console.log(userLanguage);
-
     </script>
   </body>
 </html>