-
Notifications
You must be signed in to change notification settings - Fork 278
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #178 from devarsheecodess/main
Fixed Login Page and some minor issues #158
- Loading branch information
Showing
9 changed files
with
154 additions
and
119 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -128,7 +128,7 @@ | |
|
|
||
| <div class="content" id="main-content"> | ||
| <h1>Features</h1> | ||
| <p>Here are the features of the Ambulance Monitoring System:</p> | ||
| <p>Here are the features of AmbuFlow:</p> | ||
| <div class="features-grid"> | ||
| <div class="feature-card"> | ||
| <i class="fas fa-ambulance feature-icon"></i> | ||
|
|
@@ -186,7 +186,7 @@ <h2>Feedback System</h2> | |
| <!-- Footer --> | ||
| <footer> | ||
|
|
||
| <p>© 2024 Ambulance Monitoring System. All rights reserved.</p> | ||
| <p>© 2024 AmbuFlow. All rights reserved.</p> | ||
|
|
||
| <div style="background-color: #333; color: white; padding: 20px;"> | ||
| <div style="display: flex; justify-content: space-between; flex-wrap: wrap;"> | ||
|
|
@@ -201,14 +201,14 @@ <h3>Quick Links</h3> | |
| <li><a href="sitemap.html" style="color: white; text-decoration: none;">Site Map</a></li> | ||
| </ul> | ||
| </div> | ||
| <p>© 2024 Ambulance Tracking System. All rights reserved.</p> | ||
| <p>© 2024 AmbuFlow. All rights reserved.</p> | ||
|
|
||
| </footer> | ||
|
|
||
| <!-- Contact Information Section --> | ||
| <div style="flex: 1; min-width: 200px;"> | ||
| <h3>Contact Info</h3> | ||
| <p>Ambulance Monitoring System | ||
| <p>AmbuFlow | ||
| White road St, Newyork City, USA</p> | ||
| <p>Email:[email protected]</p> | ||
| <p>Phone: 9633700598</p> | ||
|
|
@@ -235,7 +235,7 @@ <h3>Subscribe to Our Newsletter</h3> | |
|
|
||
| <!-- Copyright Section --> | ||
| <div style="text-align: center; margin-top: 20px; border-top: 1px solid white; padding-top: 10px;"> | ||
| <p>© 2024 Ambulance Monitoring System. All rights reserved.</p> | ||
| <p>© 2024 AmbuFlow. All rights reserved.</p> | ||
| </div> | ||
| </div> | ||
|
|
||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,125 +1,135 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
|
|
||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <title>Register & Login</title> | ||
|
|
||
| <!-- Google Fonts --> | ||
| <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700;800&display=swap" rel="stylesheet"> | ||
| <link | ||
| href="https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700;800&display=swap" | ||
| rel="stylesheet" | ||
| /> | ||
|
|
||
| <!-- Boxicons --> | ||
| <link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'> | ||
| <link | ||
| href="https://unpkg.com/[email protected]/css/boxicons.min.css" | ||
| rel="stylesheet" | ||
| /> | ||
|
|
||
| <!-- Font Awesome --> | ||
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" | ||
| integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg==" | ||
| crossorigin="anonymous" referrerpolicy="no-referrer" /> | ||
| <link | ||
| rel="stylesheet" | ||
| href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" | ||
| integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg==" | ||
| crossorigin="anonymous" | ||
| referrerpolicy="no-referrer" | ||
| /> | ||
|
|
||
| <!-- Custom CSS --> | ||
| <link rel="stylesheet" href="src/css/login.css"> | ||
| <link rel="stylesheet" href="src/css/login.css" /> | ||
|
|
||
| <!-- EmailJS --> | ||
| <script src="https://cdn.jsdelivr.net/npm/@emailjs/browser@4/dist/email.min.js" type="text/javascript"></script> | ||
| </head> | ||
|
|
||
| <body> | ||
|
|
||
| <!-- Navbar Start --> | ||
| <div class="fixed-navbar"> | ||
| <nav class="navbar"> | ||
| <a href="index.html" class="logo"><i class="fa-solid fa-truck-medical"></i> Ambulance Tracking System</a> | ||
| <div class="navbar-nav"> | ||
| <a href="roles.html" class="nav-link">Home</a> | ||
| <a href="#" class="nav-link">About Us</a> | ||
| <a href="#" class="nav-link">Contact</a> | ||
| <a href="login.html" class="nav-link">Login</a> | ||
| </div> | ||
| </nav> | ||
| </div> | ||
| <!-- Navbar End --> | ||
| <script | ||
| src="https://cdn.jsdelivr.net/npm/@emailjs/browser@4/dist/email.min.js" | ||
| type="text/javascript" | ||
| ></script> | ||
| </head> | ||
|
|
||
| <body> | ||
| <!-- Login Form --> | ||
| <div class="wrapper"> | ||
| <span class="rotate-bg"></span> | ||
| <span class="rotate-bg2"></span> | ||
|
|
||
| <div class="form-box login" style="padding-top: 60px;"> | ||
| <h2 class="title animation" style="--i:0; --j:21">Login</h2> | ||
| <form id="loginForm"> | ||
| <div class="input-box animation" style="--i:1; --j:22"> | ||
| <input type="text" id="loginUsername" required> | ||
| <label>Username</label> | ||
| <i class='bx bxs-user'></i> | ||
| </div> | ||
| <div class="input-box animation" style="--i:2; --j:23"> | ||
| <input type="password" id="loginPassword" required> | ||
| <label>Password</label> | ||
| <i class='bx bxs-lock-alt'></i> | ||
| <i class="fas fa-eye toggle-password" id="togglePassword" onclick="togglePassword()"></i> | ||
| </div> | ||
| <button type="submit" class="btn animation" style="--i:3; --j:24">Login</button> | ||
| <div class="linkTxt animation" style="--i:5; --j:25"> | ||
| <p>Don't have an account? <a href="up.html">Sign Up</a></p> | ||
| </div> | ||
| </form> | ||
| </div> | ||
|
|
||
|
|
||
|
|
||
| <div class="form-box login" style="padding-top: 50px"> | ||
| <h2 class="title animation" style="margin-bottom: 30px">Login</h2> | ||
| <form id="loginForm"> | ||
| <div class="input-box animation" style="--i: 1; --j: 22"> | ||
| <input type="text" id="loginUsername" required /> | ||
| <label>Username</label> | ||
| <i class="bx bxs-user"></i> | ||
| </div> | ||
| <div class="input-box animation" style="--i: 2; --j: 23"> | ||
| <input type="password" id="loginPassword" required /> | ||
| <label>Password</label> | ||
| <i class="bx bxs-lock-alt"></i> | ||
| <i | ||
| class="fas fa-eye toggle-password" | ||
| id="togglePassword" | ||
| onclick="togglePassword()" | ||
| ></i> | ||
| </div> | ||
| <button type="submit" class="btn animation" style="--i: 3; --j: 24"> | ||
| Login | ||
| </button> | ||
| <div class="linkTxt animation" style="--i: 5; --j: 25"> | ||
| <p> | ||
| Don't have an account? | ||
| <a href="#" class="register-link">Sign Up</a> | ||
| </p> | ||
| </div> | ||
| </form> | ||
| </div> | ||
| <span class="rotate-bg"></span> | ||
| <span class="rotate-bg2"></span> | ||
| </div> | ||
|
|
||
| <script> | ||
| // Toggle password visibility | ||
| function togglePassword() { | ||
| const password = document.getElementById('loginPassword'); | ||
| const togglePassword = document.getElementById('togglePassword'); | ||
|
|
||
| if (password.type === 'password') { | ||
| password.type = 'text'; | ||
| togglePassword.classList.add('fa-eye-slash'); | ||
| togglePassword.classList.remove('fa-eye'); | ||
| } else { | ||
| password.type = 'password'; | ||
| togglePassword.classList.add('fa-eye'); | ||
| togglePassword.classList.remove('fa-eye-slash'); | ||
| } | ||
| // Toggle password visibility | ||
| function togglePassword() { | ||
| const password = document.getElementById("loginPassword"); | ||
| const togglePassword = document.getElementById("togglePassword"); | ||
|
|
||
| if (password.type === "password") { | ||
| password.type = "text"; | ||
| togglePassword.classList.add("fa-eye-slash"); | ||
| togglePassword.classList.remove("fa-eye"); | ||
| } else { | ||
| password.type = "password"; | ||
| togglePassword.classList.add("fa-eye"); | ||
| togglePassword.classList.remove("fa-eye-slash"); | ||
| } | ||
|
|
||
| // Handle form submission | ||
| document.getElementById('loginForm').addEventListener('submit', function (event) { | ||
| event.preventDefault(); // Prevent form submission | ||
|
|
||
| const loginUsername = document.getElementById('loginUsername').value; | ||
| const loginPassword = document.getElementById('loginPassword').value; | ||
|
|
||
| // Retrieve stored user data (mocked with localStorage for demonstration) | ||
| const storedUser = JSON.parse(localStorage.getItem('user')); | ||
|
|
||
| // Validate credentials | ||
| if (storedUser && loginUsername === storedUser.username && loginPassword === storedUser.password) { | ||
| alert('Login successful! Redirecting to home page...'); | ||
| localStorage.setItem('currentUser', loginUsername); | ||
| window.location.href = "index.html"; // Redirect to home page | ||
| } else { | ||
| alert('Invalid username or password.'); | ||
| } | ||
| } | ||
|
|
||
| // Handle form submission | ||
| document | ||
| .getElementById("loginForm") | ||
| .addEventListener("submit", function (event) { | ||
| event.preventDefault(); // Prevent form submission | ||
|
|
||
| const loginUsername = document.getElementById("loginUsername").value; | ||
| const loginPassword = document.getElementById("loginPassword").value; | ||
|
|
||
| // Retrieve stored user data (mocked with localStorage for demonstration) | ||
| const storedUser = JSON.parse(localStorage.getItem("user")); | ||
|
|
||
| // Validate credentials | ||
| if ( | ||
| storedUser && | ||
| loginUsername === storedUser.username && | ||
| loginPassword === storedUser.password | ||
| ) { | ||
| alert("Login successful! Redirecting to home page..."); | ||
| localStorage.setItem("currentUser", loginUsername); | ||
| window.location.href = "index.html"; // Redirect to home page | ||
| } else { | ||
| alert("Invalid username or password."); | ||
| } | ||
| }); | ||
|
|
||
| // Handle registration link click | ||
| document.querySelector('.register-link').addEventListener('click', function () { | ||
| document.querySelector('.form-box.login').style.display = 'none'; | ||
| document.querySelector('.form-box.register').style.display = 'block'; | ||
| // Handle registration link click | ||
| document | ||
| .querySelector(".register-link") | ||
| .addEventListener("click", function () { | ||
| document.querySelector(".form-box.login").style.display = "none"; | ||
| document.querySelector(".form-box.register").style.display = "block"; | ||
| }); | ||
|
|
||
| // Handle login link click | ||
| document.querySelector('.login-link').addEventListener('click', function () { | ||
| document.querySelector('.form-box.register').style.display = 'none'; | ||
| document.querySelector('.form-box.login').style.display = 'block'; | ||
| // Handle login link click | ||
| document | ||
| .querySelector(".login-link") | ||
| .addEventListener("click", function () { | ||
| document.querySelector(".form-box.register").style.display = "none"; | ||
| document.querySelector(".form-box.login").style.display = "block"; | ||
| }); | ||
| </script> | ||
|
|
||
| </body> | ||
|
|
||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.