Merge branch 'main' into feedback

vimistify · Nov 7, 2024 · b9d20c3 · b9d20c3
2 parents da1e64e + ea22b3e
commit b9d20c3
Show file tree

Hide file tree

Showing 22 changed files with 1,160 additions and 272 deletions.
diff --git a/Contactus.html b/Contactus.html
@@ -170,6 +170,37 @@
       display: block;
       /* Show on hover */
     }
+
+    /* Navbar Styles */
+    .menu {
+      display: flex;
+      justify-content: center;
+      margin: 20px 0;
+    }
+
+    .nav-links {
+      list-style: none;
+      display: flex;
+      padding: 10px;
+      background-color: #f0f0f0; /* Light background color */
+      border-radius: 25px; /* Rounded corners */
+      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow */
+    }
+
+    .nav-links li {
+      margin: 0 15px; /* Space between links */
+    }
+
+    .nav-links a {
+      text-decoration: none;
+      color: #333; /* Dark text color */
+      font-weight: 500; /* Medium font weight */
+      transition: color 0.3s; /* Smooth color transition */
+    }
+
+    .nav-links a:hover {
+      color: #007bff; /* Change color on hover */
+    }
     </style>
 </head>
 <body>
@@ -193,12 +224,25 @@
           </div>
 
         <nav class="menu">
-            <ul>
-                <li><a href="index.html" id="home-link" onclick="changeContent('home')"><i class="fa-solid fa-house"></i> Home</a></li>
-                <li><a href="features.html" id="features-link" onclick="changeContent('features')"><i class="fa-solid fa-file"></i> Features</a></li>
-                <li><a href="team.html" id="team-link" onclick="changeContent('team')"><i class="fa-solid fa-user-group"></i> Team</a></li>
-                <li><a href="contact.html" id="contact-link" onclick="changeContent('contact')"><i class="fa-solid fa-phone"></i> Contact</a></li>
-                <li><a href="Feedback.html" id="feedback-link" onclick="changeContent('feedback')"><i class="fa-solid fa-clipboard"></i> Feedback</a></li>
+            <ul class="nav-links">
+                <li>
+                    <a href="./index.html" id="home-link" onclick="changeContent('home')">Home</a>
+                </li>
+                <li>
+                    <a href="features.html" id="features-link" onclick="changeContent('features')">Features</a>
+                </li>
+                <li>
+                    <a href="team.html" id="team-link" onclick="changeContent('team')">Team</a>
+                </li>
+                <li>
+                    <a href="contact.html" id="contact-link" onclick="changeContent('contact')">Contact</a>
+                </li>
+                <li>
+                    <a href="Feedback.html" id="feedback-link" onclick="changeContent('feedback')">Feedback</a>
+                </li>
+                <li>
+                    <a href="nearby.html" id="nearby-link" onclick="changeContent('nearby')">Nearby</a>
+                </li>
             </ul>
         </nav>
         <div class="buttons">

diff --git a/Feedback.html b/Feedback.html
@@ -466,6 +466,30 @@
     </div>
   </div>
 </header>
+<script>
+  // Select the button by its ID
+  const darkModeToggle = document.getElementById('dark-mode-toggle');
+
+  // Add an event listener for the 'click' event
+  darkModeToggle.addEventListener('click', () => {
+      // Toggle the 'dark-mode' class on the body element
+      document.body.classList.toggle('dark-mode');
+
+      // Save the dark mode preference in localStorage
+      if (document.body.classList.contains('dark-mode')) {
+          localStorage.setItem('theme', 'dark');
+      } else {
+          localStorage.setItem('theme', 'light');
+      }
+  });
+
+  // Check localStorage for saved theme preference on page load
+  document.addEventListener('DOMContentLoaded', () => {
+      if (localStorage.getItem('theme') === 'dark') {
+          document.body.classList.add('dark-mode');
+      }
+  });
+</script>
 
 
 <body>

diff --git a/README.md b/README.md
@@ -47,15 +47,29 @@
 <!--Line-->
 <img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
 
-## DESCRIPTION 📑
+## Table of Contents
+- [DESCRIPTION](#description)
+- [Why We Need This Application](#why-we-need-this-application)
+- [Problem Statement](#problem-statement)
+- [Solution](#solution)
+- [Key Features](#key-features)
+- [Contributing](#contributing)
+- [Contribution Guidelines](#contribution-guidelines)
+- [Tech Stack](#tech-stack)
+- [User-Friendly Experience](#user-friendly-experience)
+- [Future Enhancements](#future-enhancements)
+- [Our Valuable Contributors](#our-valuable-contributors)
+- [Team](#team)
+
+## DESCRIPTION
 A mobile app using HTML, CSS, JavaScript, and Google API that helps users find nearby hospitals and track ambulances in real-time. It shows hospital locations, provides directions, and helps manage ambulance routes based on traffic and distance.
 
 Please check out the [Screenshots.md](./Screenshots.md) for more clarity on the description of the project.
 
 <!--Line-->
 <img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
 
-## 🌟 Why We Need This Application
+## Why We Need This Application
 
 1. **Quick Emergency Response**: Ensures patients receive timely medical assistance by locating the nearest hospitals and ambulances.
 2. **Real-Time Tracking**: Provides real-time updates on ambulance locations and traffic conditions, optimizing route management.
@@ -66,7 +80,7 @@ Please check out the [Screenshots.md](./Screenshots.md) for more clarity on the
 <!--Line-->
 <img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
 
-## 🛠 Problem Statement
+## Problem Statement
 While having the name and address of a hospital is useful, visualizing it on a map with precise directions is even more effective. This app aims to bridge that gap by delivering real-time location data and navigation assistance, ensuring users find the nearest hospital quickly and with ease. 🚑
 
 ### 🌟 Quick Access to Hospitals
@@ -77,7 +91,7 @@ Visual information is key. Beyond just showing names and addresses, the app prov
 
 <img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
 
-## 💡 Solution
+## Solution
 
 ### 🚑 Quick Access to Hospitals
 This app offers a comprehensive list of nearby hospitals with essential details such as addresses, contact numbers, and user ratings. Users can filter based on hospital specialties, helping them find the appropriate medical help efficiently.
@@ -88,7 +102,7 @@ The built-in map feature shows exact hospital locations, provides directions, an
 <!--Line-->
 <img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
 
-## 🚀 Key Features
+## Key Features
 
 ### 🚑 Operator Interface
 - **🔐 Registration & Sign-In**: Operators can create accounts and securely log in for system access.
@@ -108,7 +122,7 @@ The built-in map feature shows exact hospital locations, provides directions, an
 <!--Line-->
 <img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
 
-## ✨ Contributing
+## Contributing
 
 We welcome all contributions from the open-source community! If you'd like to contribute, follow these steps:
 
@@ -155,7 +169,7 @@ node server.js
 
 6. make sure that both Backend and index.html file run togethere.
 
-## 🛠 Contribution Guidelines:
+## Contribution Guidelines:
 
 We welcome all contributions to improve **AmbuFlow**! If you would like to contribute, please follow the [Contributing.md](./Contributing.md) to know how to get started.
 
@@ -172,7 +186,7 @@ Refer to [CODE_OF_CONDUCT.md](CODE_OF_CONDUCT.md) for details on our community g
 <!--Line-->
 <img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
 
-## 🛠 Tech Stack
+## Tech Stack
 
 <a href="https://skillicons.dev">
     <img margin="8px" src="https://skillicons.dev/icons?i=html,css,js" />
@@ -184,11 +198,11 @@ Refer to [CODE_OF_CONDUCT.md](CODE_OF_CONDUCT.md) for details on our community g
 <!--Line-->
 <img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
 
-## 📱 User-Friendly Experience
+## User-Friendly Experience
 
 This app is designed to be user-friendly, ensuring a seamless experience for both patients and ambulance drivers. The intuitive interface and real-time updates make it easy to navigate and use, even in high-stress situations.
 
-## 📈 Future Enhancements
+## Future Enhancements
 
 - **Integration with Emergency Services** for faster response times.
 - **Real-Time Communication** between patients and ambulance drivers.
@@ -205,7 +219,7 @@ This app is designed to be user-friendly, ensuring a seamless experience for bot
 <!--Line-->
 <img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
 
-## 👥 Team
+## Team
 
 | <img title="Mansi Ruhil" src="https://avatars.githubusercontent.com/u/157950124?v=4&" alt="Mansi Ruhil" width="75"/> |
 |:--:|

diff --git a/SOS.html b/SOS.html
@@ -562,8 +562,9 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Follow Us</h
         <!-- Newsletter Subscription -->
         <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>
+          <form action="#" id="newsletter-form">
+            <i class="fas fa-envelope" style="position: absolute; bottom: -15.28rem; right: 21.6rem; color: gray; font-size: 13px;"></i>
+            <input type="email" placeholder="Your Email" style="padding: 10px; width: 80%; border: none; border-radius: 5px; 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>
         </div>

diff --git a/about.html b/about.html
@@ -151,6 +151,37 @@
           font-size: 1.8rem;
         }
       }
+
+      /* Navbar Styles */
+      .menu {
+        display: flex;
+        justify-content: center;
+        margin: 20px 0;
+      }
+
+      .nav-links {
+        list-style: none;
+        display: flex;
+        padding: 10px;
+        background-color: #f0f0f0; /* Light background color */
+        border-radius: 25px; /* Rounded corners */
+        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow */
+      }
+
+      .nav-links li {
+        margin: 0 15px; /* Space between links */
+      }
+
+      .nav-links a {
+        text-decoration: none;
+        color: #333; /* Dark text color */
+        font-weight: 500; /* Medium font weight */
+        transition: color 0.3s; /* Smooth color transition */
+      }
+
+      .nav-links a:hover {
+        color: #007bff; /* Change color on hover */
+      }
     </style>
   </head>
   <body>
@@ -166,21 +197,24 @@
 
           </div>
           <nav class="menu">
-            <ul>
+            <ul class="nav-links">
+              <li>
+                <a href="./index.html" id="home-link" onclick="changeContent('home')">Home</a>
+              </li>
               <li>
-                <a href="./index.html" id="home-link" onclick="changeContent('home')"><i class="fa-solid fa-house"></i> Home</a>
+                <a href="features.html" id="features-link" onclick="changeContent('features')">Features</a>
               </li>
               <li>
-                <a href="features.html" id="features-link" onclick="changeContent('features')"><i class="fa-solid fa-file"></i> Features</a>
+                <a href="team.html" id="team-link" onclick="changeContent('team')">Team</a>
               </li>
               <li>
-                <a href="team.html" id="team-link" onclick="changeContent('team')"><i class="fa-solid fa-user-group"></i> Team</a>
+                <a href="contact.html" id="contact-link" onclick="changeContent('contact')">Contact</a>
               </li>
               <li>
-                <a href="contact.html" id="contact-link" onclick="changeContent('contact')"><i class="fa-solid fa-phone"></i> Contact</a>
+                <a href="Feedback.html" id="feedback-link" onclick="changeContent('feedback')">Feedback</a>
               </li>
               <li>
-                <a href="Feedback.html" id="feedback-link" onclick="changeContent('feedback')"><i class="fa-solid fa-clipboard"></i> Feedback</a>
+                <a href="nearby.html" id="nearby-link" onclick="changeContent('nearby')">Nearby</a>
               </li>
             </ul>
           </nav>
@@ -333,8 +367,9 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Follow Us</h
           <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="#">
+              <i class="fas fa-envelope" style="position: absolute; top: 8.60rem; right: 23.5rem; color: gray; font-size: 13px;"></i>
               <input type="email" placeholder="Your Email"
-                style="padding: 10px; width: 80%; border: none; border-radius: 5px;" required><br><br>
+                style="padding: 10px; width: 80%; border: none; border-radius: 5px; 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>

diff --git a/contact.html b/contact.html
@@ -364,8 +364,9 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Follow Us</h
                 <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 id="newsletter-form" action="#">
+                        <i class="fas fa-envelope" style="position: absolute; top: 7.95rem; right: 23.5rem; color: gray; font-size: 13px;"></i>
                         <input type="email" id="newsletter-email" placeholder="Your Email"
-                            style="padding: 10px; width: 80%; border: none; border-radius: 5px;" required><br><br>
+                            style="padding: 10px; width: 80%; border: none; border-radius: 5px; padding-left: 26px;" required><br><br>
                         <button type="submit"
                             style="background-color: #e81a1a; color: white; padding: 10px 20px; border: none; cursor: pointer; border-radius: 5px;">
                             Subscribe