From c9113cebbc31a72df33d7861547e9ac1a05391fb Mon Sep 17 00:00:00 2001
From: KAUSHIKRM-36 <kaushikmahajan36@gmail.com>
Date: Fri, 18 Oct 2024 13:42:19 +0530
Subject: [PATCH 1/9] files have been changed [ about.html, privacy.html, and
 terms.html ] under QUICK LINKS

---
 about.html   |  48 +++++++++++-------
 privacy.html | 138 ++++++++++++++++++++++++++++++---------------------
 terms.html   |  24 +++++----
 3 files changed, 125 insertions(+), 85 deletions(-)

diff --git a/about.html b/about.html
index 1ef5ec7..1573d0a 100644
--- a/about.html
+++ b/about.html
@@ -28,49 +28,57 @@
     <style>
       body {
         font-family: "Roboto", sans-serif;
-        background-color: #0b0e11;
-        color: #d1d1d1;
+        background-color: #f3f4f6; /* Change from #0b0e11 */
+        color: #000000; /* Change from #d1d1d1 */
         margin: 0;
         padding: 0;
         overflow-x: hidden;
       }
+
       header {
-        background: linear-gradient(90deg, #b2d1ff, #93b6d3, #42a5f5);
+        background: linear-gradient(90deg, #A7CCF0, #F3F4F6, #A7CCF0); /* Change from #b2d1ff, #93b6d3, #42a5f5 */
         padding: 30px 0 0 0;
         text-align: center;
         box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
       }
+
       header h1 {
-        color: #fff;
+        color: #000000; /* Change from #fff */
         font-size: 2.4rem;
         text-transform: uppercase;
         letter-spacing: 3px;
       }
+
       main {
         padding: 50px 20px;
         max-width: 1200px;
         margin: 0 auto;
-        background: #10141b;
+        background: #ffffff; /* Change from #10141b */
         border-radius: 15px;
         box-shadow: 0 0 20px rgba(0, 0, 0, 0.6);
+        border: 2px solid rgba(0, 0, 0, 0.2); /* Change from rgba(66, 165, 245, 0.2) */
       }
+
       h2 {
-        color: #1e88e5;
+        color: black; /* Change from #1e88e5 */
         font-size: 2.5rem;
-        border-bottom: 2px solid #1e88e5;
+        /* border-bottom: 2px solid #000000; Change from #1e88e5 */
         padding-bottom: 10px;
         margin-bottom: 20px;
         text-transform: uppercase;
       }
+
       p {
         line-height: 1.8;
         font-size: 1.1rem;
         margin-bottom: 30px;
       }
+
       .highlight {
-        color: #f50057;
+        color: #e53935; /* Change from #f50057 */
         font-weight: bold;
       }
+
       ul {
         margin-left: 40px;
         list-style: none;
@@ -81,21 +89,24 @@
         padding-left: 25px;
         font-size: 1.1rem;
       }
+
       ul li::before {
-        color: #1e88e5;
+        color: #000000; /* Change from #1e88e5 */
         position: absolute;
         left: 0;
         top: 0;
       }
+
       footer {
-        background-color: #0d47a1;
-        color: white;
+        background-color: #333333; /* Change from #0d47a1 */
+        color: #f3f4f6; /* Change from #ffffff */
         text-align: center;
         padding: 20px 0;
         position: relative;
         bottom: 0;
         width: 100%;
       }
+
       footer p {
         margin: 0;
       }
@@ -122,15 +133,16 @@
       }
 
       /* Futuristic glow effect for text */
-      h1,
+      /* h1,
       h2 {
         text-shadow: 0 0 10px rgba(30, 136, 229, 0.8),
           0 0 20px rgba(66, 165, 245, 0.5);
-      }
+      } */
 
       /* Futuristic neon glow for sections */
       main {
         border: 2px solid rgba(66, 165, 245, 0.2);
+        color:#0344f6;
       }
 
       /* Responsive Design */
@@ -278,8 +290,8 @@ <h2>Support Us</h2>
         >Contribute on GitHub</a
       >
     </main>
-    <footer style="background-color:black; color:#f3f4f6; text-align: center; width: 100%; margin-top: 20px;">
-      <div style="background-color: #C4D7FF; color: #f3f4f6; ">
+    <footer style="background-color:#A7CCF0; color:#000000; text-align: center; width: 100%; margin-top: 20px;">
+        <div style="background-color: #A7CCF0; color: #000000; ">      
         <div style="display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 1200px; margin: 0 auto;">
   
           <!-- Quick Links Section -->
@@ -359,8 +371,10 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Subscribe to
   
       </div>
     </footer>
-    <div style="background-color: black;">
-      <p>© 2024 AmbuFlow - All Rights Reserved</p>
+
+    <div style="background-color: #000000;">
+        <p>© 2024 AmbuFlow - All Rights Reserved</p>
     </div>
+      
   </body>
 </html>
diff --git a/privacy.html b/privacy.html
index 2952e09..ce0e54c 100644
--- a/privacy.html
+++ b/privacy.html
@@ -14,56 +14,64 @@
     <style>
       body {
         font-family: "Roboto", sans-serif;
-        background-color: #0b0e11;
-        color: #d1d1d1;
+        background-color: white; /* Change from #0b0e11 */
+        color: #000000; /* Change from #d1d1d1 */
         margin: 0;
         padding: 0;
         overflow-x: hidden;
-      }
+        }
+
       header {
-        background: linear-gradient(90deg, #8fe5f4, #93b6d3, #42a5f5);
+        background: linear-gradient(90deg, #A7CCF0, #F3F4F6, #A7CCF0); /* Change from #b2d1ff, #93b6d3, #42a5f5 */
         padding: 30px 0 0 0;
         text-align: center;
         box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
-      }
-      header h1 {
-        color: #fff;
+        }
+
+        header h1 {
+        color: #000000; /* Change from #fff */
         font-size: 2.4rem;
         text-transform: uppercase;
         letter-spacing: 3px;
-      }
+        }
 
       /* Navigation Menu */
-      nav.menu ul {
+      nav.menu {
+        background: transparent; /* Change from linear-gradient */
+        }
+
+        nav.menu ul {
         display: flex;
-        justify-content: space-around; /* Distribute items evenly */
-        list-style: none;
-        padding: 0;
+        list-style-type: none;
+        justify-content: center; /* Center the items in the navbar */
+        padding: 10px 0; /* Adjust padding for better spacing */
         margin: 0;
-      }
+        }
 
-      nav.menu ul li {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        padding: 10px;
-        font-size: 16px;
-      }
+        nav.menu ul li {
+        padding: 10px 20px; /* Add horizontal padding for spacing */
+        }
 
-      nav.menu ul li a {
+        nav.menu ul li a {
         text-decoration: none;
-        color: #d1d1d1;
-      }
+        color: blue; /* Change link color to match about.html */
+        font-weight: bold; /* Make links bold */
+        transition: color 0.3s ease; /* Smooth transition for hover effect */
+        }
+
+        nav.menu ul li a:hover {
+        color: #1e88e5; /* Change hover color to match about.html */
+        }
+
+        nav.menu ul li i {
+        font-size: 20px; /* Adjust icon size if needed */
+        }
+
+        nav.menu ul li::before {
+        content: none; /* Removes the generated content */
+        }
 
-      nav.menu ul li a:hover {
-        color: #2f9bf4; /* Hover color effect */
-        transition: color 0.3s ease;
-      }
 
-      nav.menu ul li i {
-        font-size: 24px; /* Size of the icons */
-        margin-bottom: 5px;
-      }
 
       /* Responsive Design */
       @media (max-width: 768px) {
@@ -91,71 +99,87 @@
         padding: 50px 20px;
         max-width: 1200px;
         margin: 0 auto;
-        background: #10141b;
+        background: #ffffff; /* Keep this for a light background */
         border-radius: 15px;
         box-shadow: 0 0 20px rgba(0, 0, 0, 0.6);
-      }
+        color:blue;
+        }
+
       h2 {
-        color: #1e88e5;
+        color: black; /* Keep this */
         font-size: 2.5rem;
-        border-bottom: 2px solid #1e88e5;
+        border-bottom: 2px solid #1e88e5; /* Keep this */
         padding-bottom: 10px;
         margin-bottom: 20px;
         text-transform: uppercase;
-      }
+        }
+
       p {
         line-height: 1.8;
         font-size: 1.1rem;
+        color: blue; /* Change from #d1d1d1 */
         margin-bottom: 30px;
-      }
+        }
+
       .highlight {
         color: #f50057;
         font-weight: bold;
       }
+      
       ul {
         margin-left: 40px;
-        list-style: none;
-      }
-      ul li {
+        list-style-type: none;
+        }
+
+        ul li {
         margin-bottom: 15px;
         position: relative;
         padding-left: 25px;
         font-size: 1.1rem;
-      }
-      ul li::before {
+        color: blue; /* Change from original color */
+        }
+
+        ul li::before {
         content: "•";
-        color: #1e88e5;
+        color: #1e88e5; /* Keep this */
         position: absolute;
         left: 0;
         top: 0;
-      }
+        }
+
+        ul li::before {
+        content: none; /* Removes the generated content */
+        }
+
       footer {
-        background-color: #0d47a1;
-        color: white;
+        background-color: #A7CCF0; /* Change from #0d47a1 */
+        color: #000000; /* Change from white */
         text-align: center;
         padding: 20px 0;
         position: relative;
         bottom: 0;
         width: 100%;
-      }
-      footer p {
+        }
+
+        footer p {
         margin: 0;
-      }
+        }
 
       /* Buttons */
       .btn {
         display: inline-block;
-        background-color: #1e88e5;
-        color: white;
+        background-color: #1e88e5; /* Keep this */
+        color: white; /* Keep this */
         padding: 10px 20px;
         text-decoration: none;
         border-radius: 25px;
         transition: 0.3s;
-      }
-      .btn:hover {
-        background-color: #42a5f5;
+        }
+
+        .btn:hover {
+        background-color: #42a5f5; /* Keep this */
         transform: scale(1.05);
-      }
+        }
 
       /* Hover effect */
       main:hover {
@@ -164,11 +188,11 @@
       }
 
       /* Futuristic glow effect for text */
-      h1,
+      /* h1,
       h2 {
         text-shadow: 0 0 10px rgba(30, 136, 229, 0.8),
           0 0 20px rgba(66, 165, 245, 0.5);
-      }
+      } */
 
       /* Futuristic neon glow for sections */
       main {
diff --git a/terms.html b/terms.html
index 845f4bb..206af5d 100644
--- a/terms.html
+++ b/terms.html
@@ -28,20 +28,20 @@
     <style>
       body {
         font-family: "Roboto", sans-serif;
-        background-color: #0b0e11;
+        background-color: #f8f9fa; /* Change from #0b0e11 to #f8f9fa */
         color: #d1d1d1;
         margin: 0;
         padding: 0;
         overflow-x: hidden;
       }
       header {
-        background: linear-gradient(90deg, #b2d1ff, #93b6d3, #42a5f5);
+        background: linear-gradient(90deg, #e3f2fd, #bbdefb, #90caf9);        
         padding: 30px 0 0 0;
         text-align: center;
         box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
       }
       header h1 {
-        color: #fff;
+        color: black;        
         font-size: 2.4rem;
         text-transform: uppercase;
         letter-spacing: 3px;
@@ -50,12 +50,13 @@
         padding: 50px 20px;
         max-width: 1200px;
         margin: 0 auto;
-        background: #10141b;
+        background: #ffffff;
         border-radius: 15px;
         box-shadow: 0 0 20px rgba(0, 0, 0, 0.6);
+        color: blue;
       }
       h2 {
-        color: #1e88e5;
+        color: black;
         font-size: 2.5rem;
         border-bottom: 2px solid #1e88e5;
         padding-bottom: 10px;
@@ -63,6 +64,7 @@
         text-transform: uppercase;
       }
       p {
+        color: blue;
         line-height: 1.8;
         font-size: 1.1rem;
         margin-bottom: 30px;
@@ -103,7 +105,7 @@
       /* Buttons */
       .btn {
         display: inline-block;
-        background-color: #1e88e5;
+        background-color: #1e88e5;        
         color: white;
         padding: 10px 20px;
         text-decoration: none;
@@ -111,7 +113,7 @@
         transition: 0.3s;
       }
       .btn:hover {
-        background-color: #42a5f5;
+        background-color: #42a5f5;        
         transform: scale(1.05);
       }
 
@@ -122,11 +124,11 @@
       }
 
       /* Futuristic glow effect for text */
-      h1,
+      /* h1,
       h2 {
         text-shadow: 0 0 10px rgba(30, 136, 229, 0.8),
           0 0 20px rgba(66, 165, 245, 0.5);
-      }
+      } */
 
       /* Futuristic neon glow for sections */
       main {
@@ -152,8 +154,8 @@
         }
       }
       footer {
-        background-color: #0d47a1;
-        color: white;
+        background-color: #A7CCF0; /* Change from #0d47a1 */
+        color: #000000; /* Change from white */
         text-align: center;
         padding: 20px 0;
         position: relative;

From 0c1e210cf1199705285ae461b8c7ca224b7b1783 Mon Sep 17 00:00:00 2001
From: Deeksha Varshney <varshneydeeksha71@gmail.com>
Date: Mon, 21 Oct 2024 22:33:39 +0530
Subject: [PATCH 2/9] successfully change up.html

---
 up.html | 369 ++++++++++++++++++++++++++++++--------------------------
 1 file changed, 197 insertions(+), 172 deletions(-)

diff --git a/up.html b/up.html
index d42e4e7..5116f81 100644
--- a/up.html
+++ b/up.html
@@ -100,7 +100,7 @@ <h2 class="title">Sign up</h2>
                         <i class="fas fa-lock" id="toggle-password-signup"></i>
                         <input type="password" placeholder="Password" id="password-input-signup" />
                     </div>
-                    <!-- Strong password recommendations -->
+                     Strong password recommendations 
                     <div class="password-recommendations">
                         <small style="color: red;">* Password must be at least 8 characters long, contain at least one uppercase letter, one lowercase letter, one number, and one special character.</small>
                     </div>
@@ -666,201 +666,226 @@ <h3>One of us ?</h3>
 <html lang="en">
 
 <head>
-  <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Register & Login</title>
-  <link rel="stylesheet" href="preloaderStyle.css">
-  <link rel="stylesheet" href="src/css/up.css" />
-  <link rel="shortcut icon" href="ambulance.png" type="image/x-icon" />
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" />
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Register & Login</title>
+    <link rel="stylesheet" href="preloaderStyle.css">
+    <link rel="stylesheet" href="src/css/up.css" />
+    <link rel="shortcut icon" href="ambulance.png" type="image/x-icon" />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" />
 </head>
 
 <body>
-  <div class="gtranslate_wrapper"></div>
-  <script>window.gtranslateSettings = { "default_language": "en", "detect_browser_language": true, "wrapper_selector": ".gtranslate_wrapper" }</script>
-  <script src="https://cdn.gtranslate.net/widgets/latest/float.js" defer></script>
-
-  <!-- Preloader -->
-  <div id="preloader">
-    <div class="wrapper">
-      <div class="box-wrap">
-        <div class="box one"></div>
-        <div class="box two"></div>
-        <div class="box three"></div>
-        <div class="box four"></div>
-        <div class="box five"></div>
-        <div class="box six"></div>
-      </div>
-    </div>
-  </div>
-
-  <div class="container">
-    <div class="forms-container">
-      <div class="signin-signup">
-        <!-- Sign In Form -->
-        <form action="#" class="sign-in-form">
-          <h2 class="title">Sign in</h2>
-          <div class="input-field">
-            <i class="fas fa-user"></i>
-            <input type="text" placeholder="Username" required />
-          </div>
-          <div class="input-field">
-            <i class="fas fa-lock" id="toggle-password"></i>
-            <input type="password" placeholder="Password" id="password-input" required />
-          </div>
-          <input type="submit" value="Login" class="btn solid" />
-          <p class="social-text">Or Sign in with social platforms</p>
-          <div class="social-media">
-            <a href="https://www.google.com" target="_blank" class="social-icon"><i class="fab fa-google"
-                style="font-size: 24px; color: #4285f4"></i></a>
-            <a href="https://facebook.com/YourPage" target="_blank" class="social-icon"><i class="fab fa-facebook-f"
-                style="font-size: 24px; color: #4267b2"></i></a>
-            <a href="https://github.com/YourGitHubProfile" target="_blank" class="social-icon"><i class="fab fa-github"
-                style="font-size: 24px; color: #333"></i></a>
-          </div>
-        </form>
-
-        <!-- Sign Up Form -->
-        <form action="#" class="sign-up-form">
-          <h2 class="title">Sign up</h2>
-          <div class="input-field">
-            <i class="fas fa-user"></i>
-            <input type="text" placeholder="Username" required />
-          </div>
-          <div class="input-field">
-            <i class="fas fa-envelope"></i>
-            <input type="email" placeholder="Email" required />
-          </div>
-          <div class="input-field">
-            <i class="fas fa-lock" id="toggle-password-signup"></i>
-            <input type="password" placeholder="Password" id="password-input-signup" required />
-          </div>
-          <input type="submit" class="btn" value="Sign up" />
-        </form>
-      </div>
+    <div class="gtranslate_wrapper"></div>
+    <script>
+        window.gtranslateSettings = {
+            "default_language": "en",
+            "detect_browser_language": true,
+            "wrapper_selector": ".gtranslate_wrapper"
+        };
+    </script>
+    <script src="https://cdn.gtranslate.net/widgets/latest/float.js" defer></script>
+
+    <!-- Preloader -->
+    <div id="preloader">
+        <div class="wrapper">
+            <div class="box-wrap">
+                <div class="box one"></div>
+                <div class="box two"></div>
+                <div class="box three"></div>
+                <div class="box four"></div>
+                <div class="box five"></div>
+                <div class="box six"></div>
+            </div>
+        </div>
     </div>
 
-    <div class="panels-container">
-      <div class="panel left-panel">
-        <div class="content">
-          <h3>New here ?</h3>
-          <p>Discover new experiences with AmbuFlow! <br />Get access to exclusive content and features. <br />Create
-            your account.</p>
-          <button class="btn transparent" id="sign-up-btn">Sign up</button>
+    <div class="container">
+        <div class="forms-container">
+            <div class="signin-signup">
+                <!-- Sign In Form -->
+                <form class="sign-in-form" id="signInForm">
+                    <h2 class="title">Sign in</h2>
+                    <div class="input-field">
+                        <i class="fas fa-user"></i>
+                        <input type="text" placeholder="Username" required />
+                    </div>
+                    <div class="input-field">
+                        <i class="fas fa-lock" id="toggle-password"></i>
+                        <input type="password" placeholder="Password" id="password-input" required />
+                    </div>
+                    <input type="submit" value="Login" class="btn solid" />
+                    <p class="social-text">Or Sign in with social platforms</p>
+                    <div class="social-media">
+                        <a href="#" class="social-icon" onclick="socialLogin('google')"><i class="fab fa-google" style="font-size: 24px; color: #4285f4"></i></a>
+                        <a href="#" class="social-icon" onclick="socialLogin('facebook')"><i class="fab fa-facebook-f" style="font-size: 24px; color: #4267b2"></i></a>
+                        <a href="#" class="social-icon" onclick="socialLogin('github')"><i class="fab fa-github" style="font-size: 24px; color: #333"></i></a>
+                    </div>
+                </form>
+
+                <!-- Sign Up Form -->
+                <form class="sign-up-form" id="signUpForm">
+                    <h2 class="title">Sign up</h2>
+                    <div class="input-field">
+                        <i class="fas fa-user"></i>
+                        <input type="text" placeholder="Username" required />
+                    </div>
+                    <div class="input-field">
+                        <i class="fas fa-envelope"></i>
+                        <input type="email" placeholder="Email" required />
+                    </div>
+                    <div class="input-field">
+                        <i class="fas fa-lock" id="toggle-password-signup"></i>
+                        <input type="password" placeholder="Password" id="password-input-signup" required />
+                    </div>
+                    <input type="submit" class="btn" value="Sign up" />
+                </form>
+            </div>
         </div>
-      </div>
-      <div class="panel right-panel">
-        <div class="content">
-          <h3>One of us ?</h3>
-          <p>Welcome to our community</p>
-          <button class="btn transparent" id="sign-in-btn">Sign in</button>
+
+        <div class="panels-container">
+            <div class="panel left-panel">
+                <div class="content">
+                    <h3>New here?</h3>
+                    <p>Discover new experiences with AmbuFlow! <br />Get access to exclusive content and features. <br />Create your account.</p>
+                    <button class="btn transparent" id="sign-up-btn">Sign up</button>
+                </div>
+            </div>
+            <div class="panel right-panel">
+                <div class="content">
+                    <h3>One of us?</h3>
+                    <p>Welcome to our community</p>
+                    <button class="btn transparent" id="sign-in-btn">Sign in</button>
+                </div>
+            </div>
         </div>
-      </div>
     </div>
-  </div>
 
-  <script src="preloader.js"></script>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/uuid/8.3.2/uuid.min.js">
+    <script src="preloader.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/uuid/8.3.2/uuid.min.js"></script>
+    <script>
+        const sign_in_btn = document.querySelector("#sign-in-btn");
+        const sign_up_btn = document.querySelector("#sign-up-btn");
+        const container = document.querySelector(".container");
 
-  </script>
-  <script>
-    const sign_in_btn = document.querySelector("#sign-in-btn");
-    const sign_up_btn = document.querySelector("#sign-up-btn");
-    const container = document.querySelector(".container");
+        // Toggle between sign up and sign in
+        sign_up_btn.addEventListener("click", () => {
+            container.classList.add("sign-up-mode");
+        });
 
-    // Toggle between sign up and sign in
-    sign_up_btn.addEventListener("click", () => {
-      container.classList.add("sign-up-mode");
-    });
+        sign_in_btn.addEventListener("click", () => {
+            container.classList.remove("sign-up-mode");
+        });
 
-    sign_in_btn.addEventListener("click", () => {
-      container.classList.remove("sign-up-mode");
-    });
+        // Sign in form submission
+        document.getElementById("signInForm").addEventListener('submit', function (event) {
+            event.preventDefault();
+
+            const username = this.querySelector("input[type='text']").value;
+            const password = this.querySelector("input[type='password']").value;
+
+            // Retrieve stored credentials
+            const storedUsername = localStorage.getItem('username');
+            const storedPassword = localStorage.getItem('password');
+
+            // Validate input against stored credentials
+            if (username === storedUsername && password === storedPassword) {
+                alert('Login successful!');
+                window.location.href = 'index.html'; // Redirect to homepage after successful login
+            } else {
+                alert('Invalid username or password');
+            }
+        });
 
-    // Sign in form submission
-    document.querySelector(".sign-in-form").addEventListener('submit', function (event) {
-      event.preventDefault();
+        // Sign up form submission
+        document.getElementById("signUpForm").addEventListener('submit', function (event) {
+            event.preventDefault();
 
-      const username = document.querySelector(".sign-in-form input[type='text']").value;
-      const password = document.querySelector(".sign-in-form input[type='password']").value;
+            const username = this.querySelector("input[type='text']").value;
+            const email = this.querySelector("input[type='email']").value;
+            const password = this.querySelector("input[type='password']").value;
 
-      // Retrieve stored credentials
-      const storedUsername = localStorage.getItem('username');
-      const storedPassword = localStorage.getItem('password');
+            if (username === '' || email === '' || password === '') {
+                alert('Please fill in all fields');
+                return;
+            }
 
-      console.log(`Stored Username: ${storedUsername}, Input Username: ${username}`);
-      console.log(`Stored Password: ${storedPassword}, Input Password: ${password}`);
+            // Store the username and password in localStorage
+            localStorage.setItem('username', username);
+            localStorage.setItem('password', password);
 
-      // Validate input against stored credentials
-      if (username === storedUsername && password === storedPassword) {
-        alert('Login successful!');
-        window.location.href = 'index.html';
-      } else {
-        alert('Invalid username or password');
-      }
-    });
+            alert('Your account is created successfully. Please login to access the website.');
+            container.classList.remove("sign-up-mode"); // Switch to sign in mode
+        });
 
-    // Sign up form submission
-    document.querySelector(".sign-up-form").addEventListener('submit', function (event) {
-      event.preventDefault();
+        // Social media authentication (Dummy function for demo purposes)
+        function socialLogin(platform) {
+            // Here you would typically initiate the OAuth process for the given platform
+            switch (platform) {
+                case 'google':
+                    alert('Successfully login with Google..');
+                    window.location.href = 'index.html';
+                    // Add your Google OAuth logic here
+                    break;
+                case 'facebook':
+                    alert('Successfully login with Facebook...');
+                    window.location.href = 'index.html';
+                    // Add your Facebook OAuth logic here
+                    break;
+                case 'github':
+                    alert('Successfully login with GitHub...');
+                    window.location.href = 'index.html';
+                    // Add your GitHub OAuth logic here
+                    break;
+                default:
+                    alert('Unknown platform');
+                    break;
+            }
+        }
 
-      const username = document.querySelector(".sign-up-form input[type='text']").value;
-      const email = document.querySelector(".sign-up-form input[type='email']").value;
-      const password = document.querySelector(".sign-up-form input[type='password']").value;
+        // Toggle password visibility
+        function togglePassword(fieldId, icon) {
+            const field = document.getElementById(fieldId);
+            field.type = field.type === 'password' ? 'text' : 'password';
+            icon.classList.toggle('fa-lock-open');
+            icon.classList.toggle('fa-lock');
+        }
 
-      if (username === '' || email === '' || password === '') {
-        alert('Please fill in all fields');
-        return;
-      }
+        document.getElementById("toggle-password").addEventListener("click", function () {
+            togglePassword("password-input", this);
+        });
 
-      // Store the username and password in localStorage
-      localStorage.setItem('username', username);
-      localStorage.setItem('password', password); // Ensure you're storing the password
+        document.getElementById("toggle-password-signup").addEventListener("click", function () {
+            togglePassword("password-input-signup", this);
+        });
 
-      alert('Your account is created successfully. Please login to access the website.');
-      container.classList.remove("sign-up-mode"); // Optionally switch to sign in mode
-    });
+        // Circle animation
+        const coords = { x: 0, y: 0 };
+        const circles = document.querySelectorAll(".circle");
+        const colors = [
+            "#ffb56b", "#fdaf69", "#f89d63", "#f59761", "#ef865e",
+            "#ec805d", "#e36e5c", "#df685c", "#d5585c", "#d1525c",
+            "#c5415d", "#c03b5d", "#b22c5e", "#ac265e", "#9c155f",
+            "#950f5f", "#830060", "#7c0060", "#680060", "#60005f",
+            "#48005f", "#3d005e",
+        ];
+
+        // Set up circle colors and positions
+        circles.forEach(function (circle, index) {
+            circle.x = 0;
+            circle.y = 0;
+            circle.style.backgroundColor = colors[index % colors.length];
+        });
 
+        // Track mouse movement
+        window.addEventListener("mousemove", function (e) {
+            coords.x = e.clientX;
+            coords.y = e.clientY;
+        });
 
-    // Toggle password visibility
-    function togglePassword(fieldId, icon) {
-      const field = document.getElementById(fieldId);
-      field.type = field.type === 'password' ? 'text' : 'password';
-      icon.classList.toggle('fa-lock-open');
-      icon.classList.toggle('fa-lock');
-    }
 
-    document.getElementById("toggle-password").addEventListener("click", function () {
-      togglePassword("password-input", this);
-    });
-
-    document.getElementById("toggle-password-signup").addEventListener("click", function () {
-      togglePassword("password-input-signup", this);
-    });
-
-    // Circle animation
-    const coords = { x: 0, y: 0 };
-    const circles = document.querySelectorAll(".circle");
-    const colors = [
-      "#ffb56b", "#fdaf69", "#f89d63", "#f59761", "#ef865e",
-      "#ec805d", "#e36e5c", "#df685c", "#d5585c", "#d1525c",
-      "#c5415d", "#c03b5d", "#b22c5e", "#ac265e", "#9c155f",
-      "#950f5f", "#830060", "#7c0060", "#680060", "#60005f",
-      "#48005f", "#3d005e",
-    ];
-
-    circles.forEach(function (circle, index) {
-      circle.x = 0;
-      circle.y = 0;
-      circle.style.backgroundColor = colors[index % colors.length];
-    });
-
-    window.addEventListener("mousemove", function (e) {
-      coords.x = e.clientX;
-      coords.y = e.clientY;
-    });
-
-    function animateCircles() {
+        // Animate circles based on mouse position
+        function animateCircles() {
       let x = coords.x;
       let y = coords.y;
 
@@ -884,4 +909,4 @@ <h3>One of us ?</h3>
   </script>
 </body>
 
-</html>
\ No newline at end of file
+</html> 
\ No newline at end of file

From ec27c83994ef52995d34a65ec7415d25f0f261cd Mon Sep 17 00:00:00 2001
From: kunal <kunalsingh5431@gmail.com>
Date: Fri, 25 Oct 2024 20:42:52 +0530
Subject: [PATCH 3/9] modification in the footer of home page

---
 index.html | 92 ++++++++++++++++++++++++++++++++++++++++++++++++------
 1 file changed, 83 insertions(+), 9 deletions(-)

diff --git a/index.html b/index.html
index a6419b3..4bd8822 100644
--- a/index.html
+++ b/index.html
@@ -143,11 +143,15 @@
       /* Icon color change to orangered on hover */
     }
 
-    .fa-linkedin-in:hover {
-      color: rgb(16, 13, 195);
+    .fa-linkedin:hover {
+      color: darkblue;
       /* Icon color change to rgb(16, 13, 195) on hover */
     }
 
+    .fa-pinterest:hover{
+      color: red;
+    }
+
     .feature p {
       color: #555;
     }
@@ -351,6 +355,78 @@
       padding: 20px;
       /* Optional: add padding for better spacing */
     }
+
+    .search-box {
+          display: flex;
+          align-items: center; /* Center vertically */
+          gap: 3px; /* Space between input and button */
+          max-width: 400px; /* Optional: Set a max-width for the container */
+          margin: 0 auto; /* Optional: Center the search box container */
+        }
+    .search-box input {
+          width: 70%;
+          padding: 10px 15px;
+          border: 2px solid #007BFF; 
+          margin-bottom: 25px;
+          border-top-left-radius: 25px;
+          border-bottom-left-radius: 25px;
+          outline: none;
+          transition: 0.3s; 
+          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+          font-size: 16px;
+          color: #333;
+        }
+        .search-box input:focus {
+          border-color: #0056b3; /* Darker border color on focus */
+          box-shadow: 0 4px 12px rgba(0, 91, 187, 0.3); /* Slightly darker shadow */
+        }
+        .search-box input::placeholder {
+          color: #999;
+        }
+
+        .btn {
+          padding: 10px 20px;
+          background: linear-gradient(135deg, #007BFF, #0056b3); 
+          color: white;
+          border: none;
+          border-top-right-radius: 25px;
+          border-bottom-right-radius: 25px;
+          margin-bottom: 25px;
+          cursor: pointer;
+          font-size: 16px;
+          font-weight: bold;
+          transition: all 0.3s ease;
+          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); 
+        }
+
+        .btn:hover {
+          background: linear-gradient(135deg, #0056b3, #004080); 
+          box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3); 
+          transform: scale(1.05); 
+        }
+
+        .btn:active {
+          background: linear-gradient(135deg, #004080, #003366);
+          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2); 
+          transform: scale(0.98); 
+        }
+
+        .footer-column h2{
+          margin-bottom: 20px;
+        }
+
+        .footer-column .social-icons a{
+          border-radius: 50%;
+        }
+
+        .use{
+          text-align: center;
+        }
+
+       .l3{
+        margin-right: 50px;
+       }
+    
   </style>
 </head>
 
@@ -611,7 +687,6 @@ <h2>Contact Us</h2>
   <!-- footer start here -->
   <footer class="fot">
 
-
     <div class="l1">
       <h2>About</h2>
       <p>AmbuFlow is ambulance tracking site which helps you to find the nearest hospitals and get access to nearest
@@ -620,13 +695,13 @@ <h2>About</h2>
 
 
     <div class="l2">
-      <div>
-        <h2 style="margin-left: 1vw;">Usefull link</h2>
+      <div class="use">
+        <h2>Usefull link</h2>
         <p>Home</p>
-        <p style="margin-left: 1.3vw;">Features</p>
+        <p>Features</p>
         <p>Team</p>
-        <p style="margin-left: 3.5vw;">Privacy Policy</p>
-        <p style="margin-left: 4.5vw;">Terms of Service</p>
+        <p>Privacy Policy</p>
+        <p>Terms of Service</p>
       </div>
       <div class="l21">
         <h2>Help Desk</h2>
@@ -648,7 +723,6 @@ <h2>News Later</h2>
         </div>
       </form>
 
-
       <!-- Child div for 'Follow Us' -->
       <div class="footer-column">
         <h2>Follow Us</h2>

From 04a3b4fd0855f025f044e944534a11bcf077aea6 Mon Sep 17 00:00:00 2001
From: piyusdev2006 <piyushsingh955583@gmail.com>
Date: Tue, 5 Nov 2024 18:08:13 +0530
Subject: [PATCH 4/9] AmbuFlow name Language changed

---
 index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 14cd8e7..0d40611 100644
--- a/index.html
+++ b/index.html
@@ -424,7 +424,7 @@
     <div class="main_content">
       <div class="main_heading">
         <h1>Start Saving lives with </h1>
-        <h2 data-link_h2="एमबुफलो...">एमबुफलो...</h2>
+        <h2 data-link_h2="AmbuFlow...">AmbuFlow...</h2>
         <p>AmbuFlow is ambulance tracking site which helps you to find the nearest hospitals and get access to nearest
           ambulances and save lives</p>
         <div class="buttons">

From bb29f02f96e307dc00a93be6d1299ee0a48a3352 Mon Sep 17 00:00:00 2001
From: unknown <dindishriya@gmail.com>
Date: Tue, 5 Nov 2024 19:31:14 +0530
Subject: [PATCH 5/9] scroll-back

---
 Feedback.html | 143 ++++++++++++++++++++++++++++++++++++++++++++++++
 contact.html  | 148 +++++++++++++++++++++++++++++++++++++++++++++++++-
 features.html | 147 +++++++++++++++++++++++++++++++++++++++++++++++++
 index.html    | 147 +++++++++++++++++++++++++++++++++++++++++++++++++
 nearby.html   | 147 +++++++++++++++++++++++++++++++++++++++++++++++++
 team.html     | 147 +++++++++++++++++++++++++++++++++++++++++++++++++
 6 files changed, 878 insertions(+), 1 deletion(-)

diff --git a/Feedback.html b/Feedback.html
index 2728182..5a6c651 100644
--- a/Feedback.html
+++ b/Feedback.html
@@ -693,6 +693,149 @@ <h3>Connect with us!</h3>
     // Add event listener to a dark mode toggle button (if implemented)
     document.querySelector('.dark-mode-toggle').addEventListener('click', toggleDarkMode);
   </script>
+  <button id="scrollToTopBtn" class="scroll-top" aria-label="Scroll to top">
+      <div class="scroll-top-icon">
+          <i class="fa-solid fa-arrow-up"></i>
+      </div>
+      <svg class="progress-ring" width="60" height="60">
+          <circle class="progress-ring__circle" stroke="#ffffff" stroke-width="4" fill="transparent" r="28" cx="30"
+              cy="30"></circle>
+      </svg>
+  </button>
+  <style>
+      .scroll-top {
+          position: fixed;
+          right: 1.6%;
+          background: linear-gradient(100deg, #1ca6f0, #3c7aff, #05deff);
+          color: white;
+          width: 60px;
+          height: 60px;
+          border-radius: 50%;
+          border: none;
+          cursor: pointer;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          font-size: 24px;
+          opacity: 0;
+          visibility: hidden;
+          transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
+          box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+          overflow: visible;
+          z-index: 10;
+          bottom: 75px;
+          /* Ensure button is on top */
+      }
+  
+      .scroll-top.show {
+          opacity: 1;
+          visibility: visible;
+      }
+  
+      .scroll-top:hover {
+          transform: scale(1.1);
+          /* Subtle scaling instead of expanding */
+          box-shadow: 0 8px 20px rgba(255, 69, 159, 0.6);
+          /* Slightly larger shadow */
+      }
+  
+      .scroll-top:active {
+          transform: scale(1.05);
+          /* Minor scale reduction on click */
+      }
+  
+      .scroll-top-icon {
+          position: relative;
+          z-index: 2;
+          transition: transform 0.3s ease;
+      }
+  
+      .scroll-top:hover .scroll-top-icon {
+          transform: translateY(-3px);
+      }
+  
+      /* Progress Ring Styling */
+      .progress-ring {
+          position: absolute;
+          top: 0;
+          left: 0;
+          width: 100%;
+          height: 100%;
+          transform: rotate(-90deg);
+          /* To start from the top */
+      }
+  
+      .progress-ring__circle {
+          transition: stroke-dashoffset 0.35s;
+          transform-origin: 50% 50%;
+      }
+  
+      /* Pulse Animation */
+      @keyframes pulse {
+          0% {
+              box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+          }
+  
+          50% {
+              box-shadow: 0 5px 15px rgba(255, 69, 159, 0.7);
+          }
+  
+          100% {
+              box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+          }
+      }
+  
+      .scroll-top:hover {
+          animation: pulse 1.5s infinite;
+      }
+  
+      .scroll-top.show {
+          animation: none;
+          /* No animation when showing the button */
+      }
+  
+      .scroll-top.show:hover {
+          animation: pulse 1.5s infinite;
+          /* Pulse on hover */
+      }
+  </style>
+  <script>
+      const scrollToTopBtn = document.getElementById("scrollToTopBtn");
+      const progressCircle = document.querySelector(".progress-ring__circle");
+      const radius = progressCircle.r.baseVal.value;
+      const circumference = 2 * Math.PI * radius;
+      progressCircle.style.strokeDasharray = `${circumference} ${circumference}`;
+      progressCircle.style.strokeDashoffset = circumference;
+  
+      function toggleScrollButton() {
+          if (window.scrollY > 100) {
+              scrollToTopBtn.classList.add("show");
+          } else {
+              scrollToTopBtn.classList.remove("show");
+          }
+      }
+  
+      // Function to set the scroll progress on the button ring
+      function setProgress(percent) {
+          const offset = circumference - (percent / 100) * circumference;
+          progressCircle.style.strokeDashoffset = offset;
+      }
+  
+      // Listen for scroll events to update button visibility and progress
+      window.addEventListener("scroll", () => {
+          toggleScrollButton();
+          const scrollPercent = (window.scrollY / (document.documentElement.scrollHeight - window.innerHeight)) * 100;
+          setProgress(scrollPercent);
+      });
+  
+      // Smooth scroll to top when the button is clicked
+      scrollToTopBtn.addEventListener("click", () => {
+          window.scrollTo({
+              top: 0,
+              behavior: "smooth"
+          });
+      });
+    </script>
 </body>
 
 </html>
diff --git a/contact.html b/contact.html
index 7b2f552..448d083 100644
--- a/contact.html
+++ b/contact.html
@@ -470,7 +470,153 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Subscribe to
     </script>
 
     <!-- Add this div for the translator popup -->
-
+    <button id="scrollToTopBtn" class="scroll-top" aria-label="Scroll to top">
+        <div class="scroll-top-icon">
+            <i class="fa-solid fa-arrow-up"></i>
+        </div>
+        <svg class="progress-ring" width="60" height="60">
+            <circle class="progress-ring__circle" stroke="#ffffff" stroke-width="4" fill="transparent" r="28" cx="30"
+                cy="30"></circle>
+        </svg>
+    </button>
+    <style>
+        .scroll-top {
+            position: fixed;
+            right: 1.6%;
+            background: linear-gradient(100deg, #1ca6f0, #3c7aff, #05deff);
+            color: white;
+            width: 60px;
+            height: 60px;
+            border-radius: 50%;
+            border: none;
+            cursor: pointer;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 24px;
+            opacity: 0;
+            visibility: hidden;
+            transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
+            box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+            overflow: visible;
+            z-index: 10;
+            bottom: 75px;
+            /* Ensure button is on top */
+        }
+    
+        .scroll-top.show {
+            opacity: 1;
+            visibility: visible;
+        }
+    
+        .scroll-top:hover {
+            transform: scale(1.1);
+            /* Subtle scaling instead of expanding */
+            box-shadow: 0 8px 20px rgba(255, 69, 159, 0.6);
+            /* Slightly larger shadow */
+        }
+    
+        .scroll-top:active {
+            transform: scale(1.05);
+            /* Minor scale reduction on click */
+        }
+    
+        .scroll-top-icon {
+            position: relative;
+            z-index: 2;
+            transition: transform 0.3s ease;
+        }
+    
+        .scroll-top:hover .scroll-top-icon {
+            transform: translateY(-3px);
+        }
+    
+        /* Progress Ring Styling */
+        .progress-ring {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            transform: rotate(-90deg);
+            /* To start from the top */
+        }
+    
+        .progress-ring__circle {
+            transition: stroke-dashoffset 0.35s;
+            transform-origin: 50% 50%;
+        }
+    
+        /* Pulse Animation */
+        @keyframes pulse {
+            0% {
+                box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+            }
+    
+            50% {
+                box-shadow: 0 5px 15px rgba(255, 69, 159, 0.7);
+            }
+    
+            100% {
+                box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+            }
+        }
+    
+        .scroll-top:hover {
+            animation: pulse 1.5s infinite;
+        }
+    
+        .scroll-top.show {
+            animation: none;
+            /* No animation when showing the button */
+        }
+    
+        .scroll-top.show:hover {
+            animation: pulse 1.5s infinite;
+            /* Pulse on hover */
+        }
+    </style>
+    <script>
+        // Get the button
+        const scrollToTopBtn = document.getElementById("scrollToTopBtn");
+        const progressCircle = document.querySelector(".progress-ring__circle");
+        const radius = progressCircle.r.baseVal.value;
+        const circumference = 2 * Math.PI * radius;
+    
+        // Set the circle progress properties
+        progressCircle.style.strokeDasharray = `${circumference} ${circumference}`;
+        progressCircle.style.strokeDashoffset = circumference;
+    
+        // Function to show or hide the button based on scroll position
+        function toggleScrollButton() {
+            if (window.scrollY > 100) {
+                scrollToTopBtn.classList.add("show");
+            } else {
+                scrollToTopBtn.classList.remove("show");
+            }
+        }
+    
+        // Function to set the scroll progress on the button ring
+        function setProgress(percent) {
+            const offset = circumference - (percent / 100) * circumference;
+            progressCircle.style.strokeDashoffset = offset;
+        }
+    
+        // Listen for scroll events to update button visibility and progress
+        window.addEventListener("scroll", () => {
+            toggleScrollButton();
+            const scrollPercent = (window.scrollY / (document.documentElement.scrollHeight - window.innerHeight)) * 100;
+            setProgress(scrollPercent);
+        });
+    
+        // Smooth scroll to top when the button is clicked
+        scrollToTopBtn.addEventListener("click", () => {
+            window.scrollTo({
+                top: 0,
+                behavior: "smooth"
+            });
+        });
+      </script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/features.html b/features.html
index 2232ad4..f26f5bd 100644
--- a/features.html
+++ b/features.html
@@ -607,6 +607,153 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Subscribe to
       document.getElementById('emailInput').value = '';
     });
   </script>
+  <button id="scrollToTopBtn" class="scroll-top" aria-label="Scroll to top">
+    <div class="scroll-top-icon">
+        <i class="fa-solid fa-arrow-up"></i>
+    </div>
+    <svg class="progress-ring" width="60" height="60">
+        <circle class="progress-ring__circle" stroke="#ffffff" stroke-width="4" fill="transparent" r="28" cx="30"
+            cy="30"></circle>
+    </svg>
+</button>
+<style>
+    .scroll-top {
+        position: fixed;
+        right: 1.6%;
+        background: linear-gradient(100deg, #1ca6f0, #3c7aff, #05deff);
+        color: white;
+        width: 60px;
+        height: 60px;
+        border-radius: 50%;
+        border: none;
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 24px;
+        opacity: 0;
+        visibility: hidden;
+        transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
+        box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+        overflow: visible;
+        z-index: 10;
+        bottom: 75px;
+        /* Ensure button is on top */
+    }
+
+    .scroll-top.show {
+        opacity: 1;
+        visibility: visible;
+    }
+
+    .scroll-top:hover {
+        transform: scale(1.1);
+        /* Subtle scaling instead of expanding */
+        box-shadow: 0 8px 20px rgba(255, 69, 159, 0.6);
+        /* Slightly larger shadow */
+    }
+
+    .scroll-top:active {
+        transform: scale(1.05);
+        /* Minor scale reduction on click */
+    }
+
+    .scroll-top-icon {
+        position: relative;
+        z-index: 2;
+        transition: transform 0.3s ease;
+    }
+
+    .scroll-top:hover .scroll-top-icon {
+        transform: translateY(-3px);
+    }
+
+    /* Progress Ring Styling */
+    .progress-ring {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        transform: rotate(-90deg);
+        /* To start from the top */
+    }
+
+    .progress-ring__circle {
+        transition: stroke-dashoffset 0.35s;
+        transform-origin: 50% 50%;
+    }
+
+    /* Pulse Animation */
+    @keyframes pulse {
+        0% {
+            box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+        }
+
+        50% {
+            box-shadow: 0 5px 15px rgba(255, 69, 159, 0.7);
+        }
+
+        100% {
+            box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+        }
+    }
+
+    .scroll-top:hover {
+        animation: pulse 1.5s infinite;
+    }
+
+    .scroll-top.show {
+        animation: none;
+        /* No animation when showing the button */
+    }
+
+    .scroll-top.show:hover {
+        animation: pulse 1.5s infinite;
+        /* Pulse on hover */
+    }
+</style>
+<script>
+    // Get the button
+    const scrollToTopBtn = document.getElementById("scrollToTopBtn");
+    const progressCircle = document.querySelector(".progress-ring__circle");
+    const radius = progressCircle.r.baseVal.value;
+    const circumference = 2 * Math.PI * radius;
+
+    // Set the circle progress properties
+    progressCircle.style.strokeDasharray = `${circumference} ${circumference}`;
+    progressCircle.style.strokeDashoffset = circumference;
+
+    // Function to show or hide the button based on scroll position
+    function toggleScrollButton() {
+        if (window.scrollY > 100) {
+            scrollToTopBtn.classList.add("show");
+        } else {
+            scrollToTopBtn.classList.remove("show");
+        }
+    }
+
+    // Function to set the scroll progress on the button ring
+    function setProgress(percent) {
+        const offset = circumference - (percent / 100) * circumference;
+        progressCircle.style.strokeDashoffset = offset;
+    }
+
+    // Listen for scroll events to update button visibility and progress
+    window.addEventListener("scroll", () => {
+        toggleScrollButton();
+        const scrollPercent = (window.scrollY / (document.documentElement.scrollHeight - window.innerHeight)) * 100;
+        setProgress(scrollPercent);
+    });
+
+    // Smooth scroll to top when the button is clicked
+    scrollToTopBtn.addEventListener("click", () => {
+        window.scrollTo({
+            top: 0,
+            behavior: "smooth"
+        });
+    });
+  </script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/index.html b/index.html
index 14cd8e7..e6b2567 100644
--- a/index.html
+++ b/index.html
@@ -939,6 +939,153 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">
       animateCircles();
     });
   </script>
+  <button id="scrollToTopBtn" class="scroll-top" aria-label="Scroll to top">
+    <div class="scroll-top-icon">
+        <i class="fa-solid fa-arrow-up"></i>
+    </div>
+    <svg class="progress-ring" width="60" height="60">
+        <circle class="progress-ring__circle" stroke="#ffffff" stroke-width="4" fill="transparent" r="28" cx="30"
+            cy="30"></circle>
+    </svg>
+</button>
+<style>
+    .scroll-top {
+        position: fixed;
+        right: 1.6%;
+        background: linear-gradient(100deg, #1ca6f0, #3c7aff, #05deff);
+        color: white;
+        width: 60px;
+        height: 60px;
+        border-radius: 50%;
+        border: none;
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 24px;
+        opacity: 0;
+        visibility: hidden;
+        transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
+        box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+        overflow: visible;
+        z-index: 10;
+        bottom: 75px;
+        /* Ensure button is on top */
+    }
+
+    .scroll-top.show {
+        opacity: 1;
+        visibility: visible;
+    }
+
+    .scroll-top:hover {
+        transform: scale(1.1);
+        /* Subtle scaling instead of expanding */
+        box-shadow: 0 8px 20px rgba(255, 69, 159, 0.6);
+        /* Slightly larger shadow */
+    }
+
+    .scroll-top:active {
+        transform: scale(1.05);
+        /* Minor scale reduction on click */
+    }
+
+    .scroll-top-icon {
+        position: relative;
+        z-index: 2;
+        transition: transform 0.3s ease;
+    }
+
+    .scroll-top:hover .scroll-top-icon {
+        transform: translateY(-3px);
+    }
+
+    /* Progress Ring Styling */
+    .progress-ring {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        transform: rotate(-90deg);
+        /* To start from the top */
+    }
+
+    .progress-ring__circle {
+        transition: stroke-dashoffset 0.35s;
+        transform-origin: 50% 50%;
+    }
+
+    /* Pulse Animation */
+    @keyframes pulse {
+        0% {
+            box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+        }
+
+        50% {
+            box-shadow: 0 5px 15px rgba(255, 69, 159, 0.7);
+        }
+
+        100% {
+            box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+        }
+    }
+
+    .scroll-top:hover {
+        animation: pulse 1.5s infinite;
+    }
+
+    .scroll-top.show {
+        animation: none;
+        /* No animation when showing the button */
+    }
+
+    .scroll-top.show:hover {
+        animation: pulse 1.5s infinite;
+        /* Pulse on hover */
+    }
+</style>
+<script>
+    // Get the button
+    const scrollToTopBtn = document.getElementById("scrollToTopBtn");
+    const progressCircle = document.querySelector(".progress-ring__circle");
+    const radius = progressCircle.r.baseVal.value;
+    const circumference = 2 * Math.PI * radius;
+
+    // Set the circle progress properties
+    progressCircle.style.strokeDasharray = `${circumference} ${circumference}`;
+    progressCircle.style.strokeDashoffset = circumference;
+
+    // Function to show or hide the button based on scroll position
+    function toggleScrollButton() {
+        if (window.scrollY > 100) {
+            scrollToTopBtn.classList.add("show");
+        } else {
+            scrollToTopBtn.classList.remove("show");
+        }
+    }
+
+    // Function to set the scroll progress on the button ring
+    function setProgress(percent) {
+        const offset = circumference - (percent / 100) * circumference;
+        progressCircle.style.strokeDashoffset = offset;
+    }
+
+    // Listen for scroll events to update button visibility and progress
+    window.addEventListener("scroll", () => {
+        toggleScrollButton();
+        const scrollPercent = (window.scrollY / (document.documentElement.scrollHeight - window.innerHeight)) * 100;
+        setProgress(scrollPercent);
+    });
+
+    // Smooth scroll to top when the button is clicked
+    scrollToTopBtn.addEventListener("click", () => {
+        window.scrollTo({
+            top: 0,
+            behavior: "smooth"
+        });
+    });
+  </script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/nearby.html b/nearby.html
index 759a213..b7b05da 100644
--- a/nearby.html
+++ b/nearby.html
@@ -329,6 +329,153 @@ <h2>Track or call an ambulance and check nearby hospitals for emergency services
         // Initial render
         renderHospitals(hospitals);
     </script>
+    <button id="scrollToTopBtn" class="scroll-top" aria-label="Scroll to top">
+        <div class="scroll-top-icon">
+            <i class="fa-solid fa-arrow-up"></i>
+        </div>
+        <svg class="progress-ring" width="60" height="60">
+            <circle class="progress-ring__circle" stroke="#ffffff" stroke-width="4" fill="transparent" r="28" cx="30"
+                cy="30"></circle>
+        </svg>
+    </button>
+    <style>
+        .scroll-top {
+            position: fixed;
+            right: 1.6%;
+            background: linear-gradient(100deg, #1ca6f0, #3c7aff, #05deff);
+            color: white;
+            width: 60px;
+            height: 60px;
+            border-radius: 50%;
+            border: none;
+            cursor: pointer;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 24px;
+            opacity: 0;
+            visibility: hidden;
+            transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
+            box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+            overflow: visible;
+            z-index: 10;
+            bottom: 75px;
+            /* Ensure button is on top */
+        }
+    
+        .scroll-top.show {
+            opacity: 1;
+            visibility: visible;
+        }
+    
+        .scroll-top:hover {
+            transform: scale(1.1);
+            /* Subtle scaling instead of expanding */
+            box-shadow: 0 8px 20px rgba(255, 69, 159, 0.6);
+            /* Slightly larger shadow */
+        }
+    
+        .scroll-top:active {
+            transform: scale(1.05);
+            /* Minor scale reduction on click */
+        }
+    
+        .scroll-top-icon {
+            position: relative;
+            z-index: 2;
+            transition: transform 0.3s ease;
+        }
+    
+        .scroll-top:hover .scroll-top-icon {
+            transform: translateY(-3px);
+        }
+    
+        /* Progress Ring Styling */
+        .progress-ring {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            transform: rotate(-90deg);
+            /* To start from the top */
+        }
+    
+        .progress-ring__circle {
+            transition: stroke-dashoffset 0.35s;
+            transform-origin: 50% 50%;
+        }
+    
+        /* Pulse Animation */
+        @keyframes pulse {
+            0% {
+                box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+            }
+    
+            50% {
+                box-shadow: 0 5px 15px rgba(255, 69, 159, 0.7);
+            }
+    
+            100% {
+                box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+            }
+        }
+    
+        .scroll-top:hover {
+            animation: pulse 1.5s infinite;
+        }
+    
+        .scroll-top.show {
+            animation: none;
+            /* No animation when showing the button */
+        }
+    
+        .scroll-top.show:hover {
+            animation: pulse 1.5s infinite;
+            /* Pulse on hover */
+        }
+    </style>
+    <script>
+        // Get the button
+        const scrollToTopBtn = document.getElementById("scrollToTopBtn");
+        const progressCircle = document.querySelector(".progress-ring__circle");
+        const radius = progressCircle.r.baseVal.value;
+        const circumference = 2 * Math.PI * radius;
+    
+        // Set the circle progress properties
+        progressCircle.style.strokeDasharray = `${circumference} ${circumference}`;
+        progressCircle.style.strokeDashoffset = circumference;
+    
+        // Function to show or hide the button based on scroll position
+        function toggleScrollButton() {
+            if (window.scrollY > 100) {
+                scrollToTopBtn.classList.add("show");
+            } else {
+                scrollToTopBtn.classList.remove("show");
+            }
+        }
+    
+        // Function to set the scroll progress on the button ring
+        function setProgress(percent) {
+            const offset = circumference - (percent / 100) * circumference;
+            progressCircle.style.strokeDashoffset = offset;
+        }
+    
+        // Listen for scroll events to update button visibility and progress
+        window.addEventListener("scroll", () => {
+            toggleScrollButton();
+            const scrollPercent = (window.scrollY / (document.documentElement.scrollHeight - window.innerHeight)) * 100;
+            setProgress(scrollPercent);
+        });
+    
+        // Smooth scroll to top when the button is clicked
+        scrollToTopBtn.addEventListener("click", () => {
+            window.scrollTo({
+                top: 0,
+                behavior: "smooth"
+            });
+        });
+      </script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/team.html b/team.html
index 771933c..ac96438 100644
--- a/team.html
+++ b/team.html
@@ -553,6 +553,153 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Subscribe to
 
             <script src="script.js">
             </script>
+            <button id="scrollToTopBtn" class="scroll-top" aria-label="Scroll to top">
+                <div class="scroll-top-icon">
+                    <i class="fa-solid fa-arrow-up"></i>
+                </div>
+                <svg class="progress-ring" width="60" height="60">
+                    <circle class="progress-ring__circle" stroke="#ffffff" stroke-width="4" fill="transparent" r="28" cx="30"
+                        cy="30"></circle>
+                </svg>
+            </button>
+            <style>
+                .scroll-top {
+                    position: fixed;
+                    right: 1.6%;
+                    background: linear-gradient(100deg, #1ca6f0, #3c7aff, #05deff);
+                    color: white;
+                    width: 60px;
+                    height: 60px;
+                    border-radius: 50%;
+                    border: none;
+                    cursor: pointer;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    font-size: 24px;
+                    opacity: 0;
+                    visibility: hidden;
+                    transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
+                    box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+                    overflow: visible;
+                    z-index: 10;
+                    bottom: 75px;
+                    /* Ensure button is on top */
+                }
+            
+                .scroll-top.show {
+                    opacity: 1;
+                    visibility: visible;
+                }
+            
+                .scroll-top:hover {
+                    transform: scale(1.1);
+                    /* Subtle scaling instead of expanding */
+                    box-shadow: 0 8px 20px rgba(255, 69, 159, 0.6);
+                    /* Slightly larger shadow */
+                }
+            
+                .scroll-top:active {
+                    transform: scale(1.05);
+                    /* Minor scale reduction on click */
+                }
+            
+                .scroll-top-icon {
+                    position: relative;
+                    z-index: 2;
+                    transition: transform 0.3s ease;
+                }
+            
+                .scroll-top:hover .scroll-top-icon {
+                    transform: translateY(-3px);
+                }
+            
+                /* Progress Ring Styling */
+                .progress-ring {
+                    position: absolute;
+                    top: 0;
+                    left: 0;
+                    width: 100%;
+                    height: 100%;
+                    transform: rotate(-90deg);
+                    /* To start from the top */
+                }
+            
+                .progress-ring__circle {
+                    transition: stroke-dashoffset 0.35s;
+                    transform-origin: 50% 50%;
+                }
+            
+                /* Pulse Animation */
+                @keyframes pulse {
+                    0% {
+                        box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+                    }
+            
+                    50% {
+                        box-shadow: 0 5px 15px rgba(255, 69, 159, 0.7);
+                    }
+            
+                    100% {
+                        box-shadow: 0 5px 15px rgba(255, 69, 159, 0.4);
+                    }
+                }
+            
+                .scroll-top:hover {
+                    animation: pulse 1.5s infinite;
+                }
+            
+                .scroll-top.show {
+                    animation: none;
+                    /* No animation when showing the button */
+                }
+            
+                .scroll-top.show:hover {
+                    animation: pulse 1.5s infinite;
+                    /* Pulse on hover */
+                }
+            </style>
+            <script>
+                // Get the button
+                const scrollToTopBtn = document.getElementById("scrollToTopBtn");
+                const progressCircle = document.querySelector(".progress-ring__circle");
+                const radius = progressCircle.r.baseVal.value;
+                const circumference = 2 * Math.PI * radius;
+            
+                // Set the circle progress properties
+                progressCircle.style.strokeDasharray = `${circumference} ${circumference}`;
+                progressCircle.style.strokeDashoffset = circumference;
+            
+                // Function to show or hide the button based on scroll position
+                function toggleScrollButton() {
+                    if (window.scrollY > 100) {
+                        scrollToTopBtn.classList.add("show");
+                    } else {
+                        scrollToTopBtn.classList.remove("show");
+                    }
+                }
+            
+                // Function to set the scroll progress on the button ring
+                function setProgress(percent) {
+                    const offset = circumference - (percent / 100) * circumference;
+                    progressCircle.style.strokeDashoffset = offset;
+                }
+            
+                // Listen for scroll events to update button visibility and progress
+                window.addEventListener("scroll", () => {
+                    toggleScrollButton();
+                    const scrollPercent = (window.scrollY / (document.documentElement.scrollHeight - window.innerHeight)) * 100;
+                    setProgress(scrollPercent);
+                });
+            
+                // Smooth scroll to top when the button is clicked
+                scrollToTopBtn.addEventListener("click", () => {
+                    window.scrollTo({
+                        top: 0,
+                        behavior: "smooth"
+                    });
+                });
+              </script>
 </body>
 
 </html>

From 713761fddcf7b08516ab22cf9a9b29f34748b04a Mon Sep 17 00:00:00 2001
From: Sahitya317 <sahityasingh730@gmail.com>
Date: Thu, 7 Nov 2024 12:54:09 +0530
Subject: [PATCH 6/9] Updated grid section

One prominent feature was missing from the grid section . Added that in same format
---
 index.html | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/index.html b/index.html
index 14cd8e7..416e61c 100644
--- a/index.html
+++ b/index.html
@@ -480,6 +480,15 @@ <h2>Resource Management</h2>
           critical information and analytics.
         </p>
       </div>
+      <div class="feature" style="cursor: pointer;">
+     <img src="images/ambulance-w.jpg" alt="Driver Performance Monitoring" />
+        <h2>Driver Performance Management</h2>
+        <p>
+          Looks after the behaviour of driver and performance 
+          on the road, live tracking is done to avoid any kind of traffic problems
+        </p>
+      </div>
+
 
       <!-- Team Section in Full Row -->
       <div class="team-feature">

From 877b5651a7930093c152c9d7d9f55660e79a6413 Mon Sep 17 00:00:00 2001
From: Riya Chauhan <96919050+Riyachauhan11@users.noreply.github.com>
Date: Fri, 8 Nov 2024 17:55:19 +0530
Subject: [PATCH 7/9] adding dark mode styling to elements of home and contact
 page

---
 contact.html |  15 ++++++++
 index.html   | 105 +++++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 120 insertions(+)

diff --git a/contact.html b/contact.html
index 3bb12f6..4134ca8 100644
--- a/contact.html
+++ b/contact.html
@@ -204,6 +204,21 @@
             margin: 20px auto;
             object-fit: cover;
         }
+        .dark-mode .contact-item {
+            background-color: rgba(40, 40, 40, 0.9); 
+            color: #e0e0e0; 
+            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.6); 
+            border: 1px solid #555; 
+        }
+
+        .dark-mode .contact-item:hover {
+            transform: translateY(-5px);
+            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.7);
+        }
+
+        .dark-mode .contact-item img {
+            border-color: #8ab4f8;
+        }
     </style>
 </head>
 
diff --git a/index.html b/index.html
index e91953f..8b9cbea 100644
--- a/index.html
+++ b/index.html
@@ -400,6 +400,111 @@
       padding: 20px;
       /* Optional: add padding for better spacing */
     }
+    /* Dark mode for profile icon */
+.dark-mode .profile-icon {
+  border: 1px solid #ccc;
+}
+
+/* Dark mode dropdown menu */
+.dark-mode .dropdown-menu {
+  background-color: #333;
+  color: #f3f4f6;
+  border: 1px solid #555;
+}
+
+.dark-mode .dropdown-menu a {
+  color: #f3f4f6;
+}
+
+.dark-mode .dropdown-menu a:hover {
+  background-color: #444;
+}
+
+/* Dark mode for content */
+.dark-mode .content {
+  background-color: #333;
+  color: #f3f4f6;
+}
+
+/* Dark mode for h1 */
+.dark-mode h1 {
+  color: #f3f4f6;
+}
+
+/* Dark mode for feature */
+.dark-mode .feature {
+  background-color: #444;
+  color: #f3f4f6;
+  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
+}
+
+/* Dark mode for feature images */
+.dark-mode .feature img {
+  border-color: #555;
+}
+
+/* Dark mode for feature titles and paragraphs */
+.dark-mode .feature h2 {
+  color: #8ab4f8;
+}
+
+.dark-mode .feature p {
+  color: #d1d5db;
+}
+
+/* Dark mode for team-feature and contact-feature */
+.dark-mode .team-feature,
+.dark-mode .contact-feature {
+  background-color: #333;
+  color: #e0e0e0;
+  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
+}
+
+/* Dark mode for FAQ section */
+.dark-mode .faq-section {
+  background-color: #333;
+}
+
+.dark-mode .faq-h2 {
+  color: #f3f4f6;
+}
+
+.dark-mode .faq {
+  background-color: #444;
+  border-color: #555;
+}
+
+.dark-mode .faq-question {
+  background-color: #555;
+  color: #f3f4f6;
+}
+
+.dark-mode .faq-question:hover {
+  background-color: #666;
+  color: #8ab4f8;
+}
+
+.dark-mode .faq-answer {
+  background-color: #333;
+  color: #d1d5db;
+  border-top: 1px solid #555;
+}
+
+/* Dark mode for footer */
+.dark-mode footer {
+  background-color: #222;
+  color: #f3f4f6;
+}
+
+.dark-mode footer a {
+  color: #8ab4f8;
+}
+
+/* Dark mode for social icons */
+.dark-mode .social-icon:hover {
+  color: #8ab4f8;
+}
+
   </style>
 </head>
 

From bf7bffb5dbb32898365fee44ad52730f74d24a88 Mon Sep 17 00:00:00 2001
From: Anushka Mahajan <anushkambtech@gmail.com>
Date: Fri, 8 Nov 2024 18:40:20 +0530
Subject: [PATCH 8/9] Changed footer on home page

---
 index.html | 133 +++++++++++++++++++++++------------------------------
 1 file changed, 58 insertions(+), 75 deletions(-)

diff --git a/index.html b/index.html
index e91953f..e79c489 100644
--- a/index.html
+++ b/index.html
@@ -140,16 +140,20 @@
 
     footer {
       background-color: #C4D7FF;
-      color: #f3f4f6;
+      color: white;
       text-align: center;
-      padding: 15px 0;
+      padding: 10px 0;
+      position: relative;
+      bottom: 0;
       width: 100%;
     }
-    footer a{
-      text-decoration: none;
-      color: #f3f4f6;
+
+    .social-icon {
+      transition: transform 0.3s ease;
+      /* Smooth transition effect */
     }
 
+
     .checkbtn {
       font-size: 30px;
       color: #333;
@@ -703,80 +707,59 @@ <h2>Contact Us</h2>
 
 
   <!-- footer start here -->
-  <footer class="fot">
-
-
-    <div class="l1">
-      <h2>About</h2>
-      <p>AmbuFlow is ambulance tracking site which helps you to find the nearest hospitals and get access to nearest
-        ambulances and save lives</p>
-    </div>
-
+  <footer style=" color: #f3f4f6; text-align: center; width: 100%;">
+    <div style="background-color: #C4D7FF; color: #f3f4f6; ">
+      <div style="display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 1200px; margin: 0 auto;">
+        <div style="flex: 1; min-width: 200px; margin-bottom: 20px;">
+          <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Quick Links</h3>
+          <ul style="list-style-type: none; padding: 0;">
+            <li><a href="about.html" style="color: #000000; text-decoration: none;">About Us</a></li>
+            <li><a href="contact.html" style="color: #000000; text-decoration: none;">Contact Us</a></li>
+            <li><a href="privacy.html" style="color: #000000; text-decoration: none;">Privacy Policy</a></li>
+            <li><a href="terms.html" style="color: #000000; text-decoration: none;">Terms of Service</a></li>
+            <li><a href="sitemap.html" style="color: #000000; text-decoration: none;">Site Map</a></li>
+          </ul>
+        </div>
+        <div style="flex: 1; min-width: 200px; margin-bottom: 10px;">
+          <h3 style="font-size: 1.5rem; color: #2980b9;">Contact Info</h3>
+          <p style="color: #000;">123 Emergency Lane, Mumbai, India</p>
+          <a href="mailto:emergency@ambulanceservice.in" style="color: #000000;">emergency@ambulanceservice.in</a></p>
+          <p style="color: #000000;">Phone: <a href="tel:+91-911-1234567" style="color: #000000;">+91-911-1234567</a>
+          </p>
+        </div>
+        <div style="text-align: center; min-width: 200px; color: black;">
+          <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Follow Us</h3>
+          <div style="display: flex; justify-content: center; align-items: center; gap: 15px; height: 50px;">
+            <a href="https://www.facebook.com" class="social-icon facebook"
+              style="color: black; text-decoration: none; font-size: 1.5rem;"><i class="fab fa-facebook"></i></a>
+            <a href="https://www.twitter.com" class="social-icon twitter"
+              style="color: black; text-decoration: none; font-size: 1.5rem;"><i class="fa-brands fa-x-twitter"></i></a>
+            <a href="https://www.instagram.com" class="social-icon instagram"
+              style="color: black; text-decoration: none; font-size: 1.5rem;"><i class="fab fa-instagram"></i></a>
+            <a href="https://www.linkedin.com" class="social-icon linkedin"
+              style="color: black; text-decoration: none; font-size: 1.5rem;"><i class="fab fa-linkedin-in"></i></a>
+          </div>
+        </div>
+        <div style="flex: 1; min-width: 200px; margin-bottom: 20px;">
+          <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Subscribe to Our Newsletter</h3>
+          <form action="#">
+            <input type="email" placeholder="Your Email"
+              style="padding: 10px; width: 80%; border: none; border-radius: 5px;" required><br><br>
+            <button type="submit"
+              style="background-color: #e81a1a; color: white; padding: 10px 20px; border: none; cursor: pointer; border-radius: 5px;">Subscribe</button>
+          </form>
+        </div>
 
-    <div class="l2">
-      <div>
-        <h2 style="margin-left: 1vw;">Usefull link</h2>
-        <p><a href="index.html">Home</a></p>
-        <p style="margin-left: 1.3vw;"><a href="features.html">Features</a></p>
-        <p><a href="team.html">Team</a></p>
-        <p style="margin-left: 3.5vw;"><a href="privacy.html">Privacy Policy</a></p>
-        <p style="margin-left: 4.5vw;"><a href="terms.html">Terms of Service</a></p>
       </div>
-      <div class="l21">
-        <h2>Help Desk</h2>
-        <p><a href="contact.html">Support</a></p>
-        <p><a href="Contactus.html">Contact Us</a></p>
-        <p><a href="#faq-section">FAQ</a></p>
-        <p><a href="nearby.html">Near by</a></p>
-        <p><a href="contact.html">Phone</a></p>
-      </div>
-    </div>
 
-      <!-- Newsletter Subscription -->
-      <div style="min-width: 200px; margin-bottom: 20px;">
-        <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: darkorange;">
-          Subscribe to Our Newsletter</h3>
-        <form id="newsletter-form" novalidate>
-          <i class="fas fa-envelope" style="position: absolute; bottom: -142.6rem; right: 18.3rem; color: rgb(129, 128, 128); font-size: 13px;"></i>
-          <input type="email" placeholder="Your Email" style="padding: 10px; width: 80%; border: none; border-radius: 7px; padding-left: 27px;"
-            required><br><br>
-          <button type="submit"
-            style="background-color: #e81a1a; color: white; padding: 10px 20px; border: none; cursor: pointer; border-radius: 5px;">Subscribe</button>
-        </form>
-        <!-- Toast Notification -->
-        <div id="toast"
-          style="display: none; position: fixed; bottom: 20px; right: 60px; background-color: #333; color: white; padding: 10px; border-radius: 5px; z-index: 1000;">
-        </div>
-      </div>
     </div>
-  <script>
-    function showToast(message,type) {
-      const toast = document.getElementById('toast');
-      toast.textContent = message;
-      toast.style.display = "block"; // Show the toast
-      toast.style.backgroundColor = type==='success' ? 'green':'red'
-      toast.style.color = 'white';
-      setTimeout(() => {
-        toast.style.display = "none"; // Hide after 3 seconds
-      }, 3000);
-    }
-
-    document.getElementById('newsletter-form').addEventListener('submit', function (event) {
-      event.preventDefault(); // Prevent form submission
-      const emailInput = this.querySelector('input[type="email"]');
-      const email = emailInput.value;
-
-      // Basic email validation
-      const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-
-      if (emailPattern.test(email)) {
-        showToast("Thank you for subscribing!",'success'); // Show success message
-        emailInput.value = ""; // Clear the input field
-      } else {
-        showToast("Please enter a valid email address.",'error'); // Show error message
-      }
-    });
-  </script>
+    <hr>
+    <div
+      style="background-color: #C4D7FF; color: #000000; display: flex; justify-content: space-between; align-items: center; padding: 10px 20px;">
+      <strong>
+        <p>&copy; 2024 AmbuFlow. All rights reserved.</p>
+      </strong>
+    </div>
   </footer>
 
 

From 2a34d1f7d1963e7a6dc0e77ac370ec2fae64e384 Mon Sep 17 00:00:00 2001
From: Subhajit-2023-44 <subhajit2006patra@gmail.com>
Date: Sat, 9 Nov 2024 03:08:31 +0530
Subject: [PATCH 9/9] done

---
 contributors/contributors.css | 11 ++++---
 contributors/contributors.js  | 59 +++++++++++++++++++++++++++++------
 2 files changed, 55 insertions(+), 15 deletions(-)

diff --git a/contributors/contributors.css b/contributors/contributors.css
index 9ba84a2..8306152 100644
--- a/contributors/contributors.css
+++ b/contributors/contributors.css
@@ -460,7 +460,6 @@
   margin: 0 auto;
   padding: 2rem 2rem;
   text-align: center;
-  background-color: rgba(255,255,255,0.3);
   border-radius: 25px;
   margin-top: 60px;
   }
@@ -477,10 +476,12 @@
   }
   
   .contributor-stat-card {
-  background-color: rgba(0,0,0,0.4);
-  border-radius: 10px;
-  padding: 1.5rem;
-  text-align: center;
+
+  background-color: rgb(37 55 69);
+  border-radius:  10px;
+  padding:  1.5rem;
+  text-align:  center;
+
   }
   
   .contributor-stat-card .contributor-icon {
diff --git a/contributors/contributors.js b/contributors/contributors.js
index e453ab7..c7af093 100644
--- a/contributors/contributors.js
+++ b/contributors/contributors.js
@@ -1,29 +1,61 @@
 const repoOwner = "mansiruhil13";
 const repoName = "Bobble-AI";
-const contributorsUrl = `https://api.github.com/repos/${repoOwner}/${repoName}/contributors`;
+const contributorsUrl = `https://api.github.com/repos/${repoOwner}/${repoName}/contributors?per_page=100&page=`;  // Set per_page to 100 (max allowed) and use pagination
 const repoUrl = `https://api.github.com/repos/${repoOwner}/${repoName}`;
 
 async function fetchContributorData() {
   try {
-    const [contributorsRes, repoRes] = await Promise.all([
-      fetch(contributorsUrl),
-      fetch(repoUrl)
-    ]);
 
-    const contributors = await contributorsRes.json();
+    // Fetch repository data to get star and fork counts
+    const repoRes = await fetch(repoUrl);
     const repoData = await repoRes.json();
 
-    const statsGrid = document.getElementById("statsGrid");
 
+    // Initialize variables
+    let allContributors = [];
+    let totalContributions = 0;
+    let page = 1;
+
+
+    // Fetch contributors in a loop to handle pagination
+    while (true) {
+      const contributorsRes = await fetch(contributorsUrl + page);
+      const contributors = await contributorsRes.json();
+
+
+      // If no more contributors, break the loop
+      if (contributors.length === 0) {
+        break;
+      }
+
+
+      // Add the current page's contributors to the allContributors array
+      allContributors = [...allContributors, ...contributors];
+
+
+      // Update total contributions
+      totalContributions += contributors.reduce((sum, { contributions }) => sum + contributions, 0);
+
+
+      // Move to the next page
+      page++;
+
+    }
+
+
+    // Update the stats grid
+    const statsGrid = document.getElementById("statsGrid");
     statsGrid.innerHTML = `
-      <div class="contributor-stat-card"><h3>${contributors.length}</h3><p>Contributors</p></div>
-      <div class="contributor-stat-card"><h3>${contributors.reduce((sum, { contributions }) => sum + contributions, 0)}</h3><p>Total Contributions</p></div>
+      <div class="contributor-stat-card"><h3>${allContributors.length}</h3><p>Contributors</p></div>
+      <div class="contributor-stat-card"><h3>${totalContributions}</h3><p>Total Contributions</p></div>
       <div class="contributor-stat-card"><h3>${repoData.stargazers_count}</h3><p>GitHub Stars</p></div>
       <div class="contributor-stat-card"><h3>${repoData.forks_count}</h3><p>Forks</p></div>
     `;
 
+
+    // Display all contributors
     const contributorsContainer = document.getElementById("contributors");
-    contributorsContainer.innerHTML = contributors.map(({ login, contributions, avatar_url, html_url }) => `
+    contributorsContainer.innerHTML = allContributors.map(({ login, contributions, avatar_url, html_url }) => `
       <div class="contributor-card">
         <img src="${avatar_url}" alt="${login}'s avatar">
         <p><strong>${login}</strong></p>
@@ -31,9 +63,16 @@ async function fetchContributorData() {
         <a href="${html_url}" target="_blank">GitHub Profile</a>
       </div>
     `).join('');
+    
+
   } catch (error) {
     console.error("Error fetching data:", error);
   }
+
 }
 
+
 fetchContributorData();
+
+
+