-
Notifications
You must be signed in to change notification settings - Fork 289
/
roles.html
138 lines (123 loc) · 5.97 KB
/
roles.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Select Your Role</title>
<link rel="stylesheet" href="src/css/roles.css">
<link rel="shortcut icon" href="ambulance.png" type="image/x-icon">
<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 href="https://cdn.jsdelivr.net/npm/[email protected]/fonts/remixicon.css" rel="stylesheet" />
</head>
<body>
<div class="header">
<div class="logo">
<a href="./index.html"><i class="fa-solid fa-truck-medical"></i></a>
<a href="index.html" class="logo">AmbuFlow </a>
</div>
<nav class="navbar">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Contact</a></li>
<li><a href="login.html">Login</a></li>
</ul>
</nav>
<div class="cta-button">
<a href="get-started.html" class="btn">Get Started</a>
</div>
</div>
</div>
<div class="role-selection">
<h1>Select Your Role</h1>
<div class="role-buttons">
<div class="role">
<i class="fa-solid fa-user"></i>
<a href="user.html" class="role-btn user-btn">User</a>
<p class="role-description">Track ambulances and get updates.</p>
</div>
<div class="role">
<i class="fa-solid fa-hospital"></i>
<a href="hospital.html" class="role-btn hospital-btn">Hospital</a>
<p class="role-description">Manage patient notifications.</p>
</div>
<div class="role">
<i class="fa-solid fa-car"></i>
<a href="driver.html" class="role-btn driver-btn">Driver</a>
<p class="role-description">Optimize routes with real-time data.</p>
</div>
</div>
</div>
<section class="faq" id="faq"></section>
<div class="container_1">
<div class="accordion__wrapper">
<h1 class="accordion__title">Frequently Asked Questions</h1>
<br>
<div class="accordion">
<div class="accordion__header">
<h2 class="accordion__question">How does the app notify me about nearby hospitals?</h2>
<span class="accordion__icon">
<i id="accordion-icon" class="ri-add-line"></i>
</span>
</div>
<div class="accordion__content">
<p class="accordion__answer">The app uses GPS data and Google Maps API to track your location and
provides notifications of nearby hospitals based on your current location.</p>
</div>
</div>
<div class="accordion">
<div class="accordion__header">
<h2 class="accordion__question">How do I track the ambulance in real-time?</h2>
<span class="accordion__icon">
<i id="accordion-icon" class="ri-add-line"></i>
</span>
</div>
<div class="accordion__content">
<p class="accordion__answer">Once an ambulance is dispatched, the app provides real-time tracking
via GPS, showing its location on the map along with the estimated time of arrival (ETA).</p>
</div>
</div>
<div class="accordion">
<div class="accordion__header">
<h2 class="accordion__question">Can hospitals and drivers see my location?</h2>
<span class="accordion__icon">
<i id="accordion-icon" class="ri-add-line"></i>
</span>
</div>
<div class="accordion__content">
<p class="accordion__answer">Yes, with your consent, your location is shared with the hospital and
ambulance driver to ensure a quicker response and accurate routing.</p>
</div>
</div>
<div class="accordion">
<div class="accordion__header">
<h2 class="accordion__question">Does the app provide real-time traffic updates?</h2>
<span class="accordion__icon">
<i id="accordion-icon" class="ri-add-line"></i>
</span>
</div>
<div class="accordion__content">
<p class="accordion__answer">Yes, the app integrates with Google Maps to provide real-time traffic
information to the ambulance driver, helping to optimize the fastest route.</p>
</div>
</div>
<div class="accordion">
<div class="accordion__header">
<h2 class="accordion__question">How do I contact customer support for technical issues?</h2>
<span class="accordion__icon">
<i id="accordion-icon" class="ri-add-line"></i>
</span>
</div>
<div class="accordion__content">
<p class="accordion__answer">You can reach our customer support team through the contact form in the
app or by calling our helpline at 123-456-7890 for immediate assistance.</p>
</div>
</div>
</div>
</div>
</section>
<script src="script.js"></script>
</body>
</html>