-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
282 lines (259 loc) · 11.6 KB
/
index.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
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Self Drive Car Rentals | Rent a Car | Car Hire @ Zoomcar</title>
<link rel="stylesheet" href="./styles/index.css">
<link href="https://www.zoomcar.com/fav/favicon.png" rel="shortcut icon" type="image/png">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<link rel="stylesheet" href="./styles/navbar.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
</head>
<body>
<nav class="navbar" id="mainNav">
</nav>
<div id="backgroundImg">
<section class="search">
<!-- back-ground image and form//upper part -->
<form>
<div id="ride-selection">
<div id="road" onclick="changeToRoad()">
<div id="div-content">
<div><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRmd0o37WqMvSONzvAKMis6yj2O2jAUvXeF5w&usqp=CAU"></div>
<div style="font-stretch:ultra-expanded">Round Trip</div>
</div>
</div>
<div id="air" onclick="changeToAir()">
<div id="div-content">
<div><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSlBaog8E36pK6W53G2-wTlR6KxsGibNyZd4g&usqp=CAU"></div>
<div style="font-stretch:ultra-expanded">Airport</div>
</div>
</div>
</div>
<div id="city-selection">
<div>
<div id="circle"></div>
<select id="select" required>
<option id="show-airport">Pick Up City, Airport, Address or Hotel</option>
<option value="Pune">Pune</option>
<option value="Hyderabad">Hyderabad</option>
<option value="Delhi">Delhi NCR</option>
<option value="Mumbai">Mumbai</option>
<option value="Chennai">Chennai</option>
<option>Air Port</option>
</select>
</div>
</div>
<div class="input-date">
<div>
<label for="start-date">From</label>
<input type="datetime-local" id="start" required>
</div>
<div>
<label for="end-date">Till</label>
<input type="datetime-local" id="end" required>
</div>
</div>
<input type="submit" value="FIND CARS">
</form>
</section>
</div>
<!-- divs and images//middle part -->
<div id="container">
<div id="wh-content">
<div id="flex-content">
<div><h3>Do your friend like weekend gateway</h3>
<p style="margin-top:26px;font-size:17px">You earn 500 in z-point. Your friends get 20% off on first booking</p>
</div>
<div><img src="https://zoomcar-assets.zoomcar.com/images/original/1e3becafed3e6151b17c104858b336bb7e076c11.jpeg?1658213048"></div>
</div>
<div id="footerImg">
<img src="https://www.zoomcar.com/img/right-arrow-green.svg">
<div><h3> Refer Friend</h3></div>
</div>
</div>
<div id="wh-content">
<div id="flex-content">
<div><h2>Up to 20% off</h2>
<p style="font-size:18px; color:grey">on your first booking from the app</p>
<div><p style="color:grey; font-size: 22px; border:1px dashed grey;padding:7px">Use Code : ZOOMNEW</p></div>
</div>
<div><img src="https://www.zoomcar.com/img/cellphone.png"></div>
</div>
<div><h2 style="color:green">Install Zoomcar App Now</h2></div>
</div>
</div>
<!-- promo cards//third part -->
<div id="promo">
<div id="promo-div">
<a href="#mainNav">
<div>
<img src="https://zoomcar-assets.zoomcar.com/pictures/original/d70e7f58da384df0f3ba169cf19e8e931879c66c.jpeg?1652354515">
</div>
</a>
<a href="#mainNav">
<div>
<img src="https://zoomcar-assets.zoomcar.com/pictures/original/55c3970a33c8f4d10dd3c9ace39d20e32af5c8ba.jpg?1651758755">
</div>
</a>
<a href="#mainNav">
<div>
<img src="https://zoomcar-assets.zoomcar.com/pictures/original/bf00a1ae4448e84bbd2ef285970c2cc8527dc305.jpg?1660131373">
</div>
</a>
<a href="#mainNav">
<div>
<img src="https://zoomcar-assets.zoomcar.com/pictures/original/e3dfe0ed91abc29facaf56a327b4498ce4e9b75e.jpeg?1652363808">
</div>
</a>
</div>
</div>
<div id="book"><button>Book Now</button></div>
<!-- offer part//4th part -->
<div id="offers">
<h4>OFFERS</h4>
<img src="https://zoomcar-assets.zoomcar.com/photos/original/67aa017f464b45e52f7bc9a206245e5f15f5a316.jpg?1655478529">
</div>
<!-- footers//bottom part -->
<div id="about">
<div>About Us</div>
</div>
<div id="details">
<div id="detail-write">
<div>
<h3><b>SELF DRIVE CAR RENTALS</b></h3>
<p>
Besides the all-inclusive feel, the city is witnessing a
shifting culture that calls for an equal focus on work and leisure.
Almost every work day ends in a relaxing meal with friends, and
frequent road trips are the norm. With youngsters increasingly
viewing driving as a pleasure rather than a chore, self drive car
rentals have emerged as the answer to a prayer.
</p>
</div>
<div>
<h3><b>CAR RENTAL IN</b></h3>
<p>
If you love cars, but find it hard to identify one which is perfect
for you, Zoomcar serves as an interesting option. We make it
possible for you to pick your car based on your travelling needs.
While small cars allow you to manoeuvre through city traffic and are
ideal for a daily commute, sedans and SUV’s offer more comfort. They
are well suited for group travel and can add to the joy of road
trips.Take your friends on a memorable trip from to your favourite place.
in a spacious SUV from Zoomcar. A definite perk is that
Zoomcar comes with limited liability, and relieve you of the
financial burden of investing in a four-wheeler while offering the
freedom of having a self driven car at your disposal. When
you choose to drive a car in the city, you do away with the hassle
of having to coordinate with the drivers who operate traditional car
rentals.With Zoomcar you can avoid the need to
hire an exorbitantly priced airport cab . Airport boasts of a Zoomcar parking lot where you can
opt for a car rental in cities without driver as soon as you get
off your flight. Indulge your passion for luxury cars and make
every a special occasion memorable by opting to drive a slick luxury
car yourself. You could opt for it for the sheer pleasure and
experience too!
</p>
</div>
<div>
<h3><b>CAR ON RENT IN</b></h3>
<p>
Your experience with Zoomcar begins with the convenience of online
booking. The cars listed on our site come with all India permits,
Road Side Assistance (RSA), and include vehicle insurance. It
is extremely easy to pick the car as there are multiple parking
sites across the city. They also prove to be a safe bet for
independent, young women who like to be behind the wheel. Whether
you need it for a couple of hours or require it over many days, you
can choose the perfect self-drive car.Hire a car.
<span>through the Zoomcar app or online conveniently for tech-enabled booking, tracking and hassle-free payment options.</span>
<br />
</p>
</div>
<div>
<h3><b>ABOUT ZOOMCAR</b></h3>
<p>
No more worries about petrol mileage, fuel costs, insurance, and
car breakdowns! Zoomcar has enabled driving convenience for
travellers around the country and is fast expanding its reach to
cities including Ahmedabad, Bangalore, Chandigarh, Chennai,
Coimbatore, Delhi-NCR, Hyderabad, Jaipur, Kochi, Kolkata,
Ludhiana, Mangalore, Mumbai, Mysore, Pune, Siliguri and
Vizag.<br />
Self drive cars from Zoomcar have given
customers more control, privacy, and freedom. Book
a self drive car in any city you visit with the Zoomcar
app on your phone and feel at home wherever you go.
</p>
</div>
</div>
</div>
<div style="display:flex; justify-content:space-around">
<div id="footer-img">
<img src="https://www.zoomcar.com/build/6b51f1464b17dbb1d002f16e26572662.png"alt=""/>
</div>
<div id="mother">
<div id="container"></div>
<div class="mapouter">
<div class="gmap_canvas"><iframe width="600" height="500" id="gmap_canvas" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe><a href="https://www.whatismyip-address.com/divi-discount/">divi discount</a><br><a href="https://www.embedgooglemap.net">google maps in iframe</a></div>
</div>
</div>
</div>
<div id="copyright">© Copyright 2022 Zoomcar India Private Ltd. All rights reserved </div>
</body>
<script src="./scripts/index.js"></script>
</html>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/445205b9df.js" crossorigin="anonymous"></script>
<script type="module">
import { afterLogin, beforeLogin } from "./components/header.js";
let user = JSON.parse(localStorage.getItem("current-user")) || null;
let navbar = document.getElementById("mainNav");
if (user != null) {
navbar.innerHTML = afterLogin();
document.getElementById("name").innerText = user.name;
document.getElementById("uName").innerText = user.name;
document.getElementById("email").innerText = user.email;
document.getElementById("mob").innerText = user.number;
document.getElementById("city").innerText = user.city;
} else {
navbar.innerHTML = beforeLogin();
}
let logout = document.getElementById("logout");
if (logout) {
logout.addEventListener("click", logoutMe);
}
function logoutMe() {
swal({
title: "Are you sure?",
icon: "warning",
buttons: true,
dangerMode: true,
}).then((willDelete) => {
if (willDelete) {
localStorage.setItem("current-user", JSON.stringify(null));
window.location.href = "login-page.html";
swal("You are successfully logout!", {
icon: "success",
});
}
});
}
if (user != null) {
let goToProfile = document.getElementById("uName");
let goToProfile1 = document.getElementById("logData");
goToProfile.addEventListener("click", profile);
goToProfile1.addEventListener("click", profile1);
function profile() {
window.location.href = "profile.html";
}
function profile1() {
window.location.href = "profile.html";
}
}
</script>