-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
176 lines (162 loc) · 7.02 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSgq3guANu3gB6h0exbxjYpHiSHCUodSKql2A&usqp=CAU" type="image/x-icon">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
<link rel="stylesheet" href="style.css">
<title>Riding-Web</title>
</head>
<body>
<nav class="navbar navbar-expand-lg">
<div class="container-fluid">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div>
<a class="navbar-brand" href="#"><img class="image1" src="./img/img1.png" alt=""></a>
</div>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">How tere works</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Tere benefits</a>
</li>
<li class="nav-item">
<button class="btn text-light" type="submit">Help Center</button>
</li>
</ul>
</div>
</div>
</nav>
<section>
<div class="main container-fluid row">
<div class="text col-6">
<h3>DOWNLOAD APP, <br/> SAVE MONEY, MAKE <br/> FRIENDS!</h3>
<p class="para1">Its simple and its free. Play your part in reducing Carbon Footprint and help Mother Nature to sustain its beauty. So what are you waiting for ? Lets ride together</p>
<div class="icon">
<img class="image3" src="./img/img3.png" alt="">
<img class="image3" src="./img/img4.png" alt="">
</div>
</div>
<div class="image col-6">
<img class="image2" src="./img/img2.png" alt="">
</div>
</div>
<div class="container-fluid green">
<div class="text1"><p class="para2">Let's go. Get a link <br/> to download the app.</p></div>
<div class="input d-flex">
<input class="form-control me-2" type="search" placeholder="Enter mobile phone number" aria-label="Search">
<button class="btn btn1 bg-dark text-light" type="submit">APPLY TO DRIVE</button>
</div>
</div>
<div class="container-fluid ">
<div class="head">
<h3>HOW <span class="span">TERE</span> WORKS</h3>
<div class="Center">
<p class="para4">Download and install the tere app. Enter your phone number and make your user account. when approved you may start driving.</p>
</div>
</div>
<div class="mobile">
<div class="ins1">
<div class="one">
<img class="image6" src="./img/img6.jpg" alt="">
<div><img class="image7" src="./img/1.jpg" alt=""></div>
<h4>REQUEST A RIDE</h4>
<p class="para3">Lorem ipsum dolor sit amet amet <br/> consectetur adipisicing <br/>Placeat nihil labore magni totam <br/> Lorem ipsum dolor consectetur.</p>
</div>
<div class="two">
<img class="image6" src="./img/img6.jpg" alt="">
<div><img class="image8" src="./img/3.jpg" alt=""></div>
<h4>INSTANT NOTIFICATIONS</h4>
<div class="para3">Get instant notifications for <br/> your rides and be in contact <br/> with fellow riders all the time</div>
</div>
</div>
<div class="img5"><img class="image5" src="./img/img5.jpg" alt=""></div>
<div class="ins2">
<div class="one three">
<img class="image6" src="./img/img6.jpg" alt="">
<div><img class="image7 image9" src="./img/2.jpg" alt=""></div>
<h4>POST A RIDE</h4>
<p class="para3">Going somewhere but hate to travel alone -
just post your ride details and publish it</p>
</div>
<div class="two three">
<img class="image6" src="./img/img6.jpg" alt="">
<div><img class="image8 image9" src="./img/4.jpg" alt=""></div>
<h4>CASHLESS PAYMENT</h4>
<div class="para3">Payment made easy by using your own Wallet - no more cash to carry</div>
</div>
</div>
<div class="border"> </div>
</div>
</div>
<div class="benefit">
<div class="head">
<h3><span class="span">TERE</span> BENEFITS</h3>
</div>
<div class="cards container-fluid">
<div class="card1 row">
<div class="text2 col-12"><span class="span2">01.</span>Flexible <br/> working hours
<p class="para5">You can decide when, and how much time you want to drive.</p>
</div>
<div class="img7 col-12"><img class="image10" src="./img/Frame.jpg" alt=""></div>
</div>
<div class="card2 row">
<div class="img7 col-12"><img class="image10" src="./img/Frame (1).jpg" alt=""></div>
<div class="text2 col-12"><span class="span2">02.</span>Earnings
<p class="para5">By driving with tere you can earn more.</p>
</div>
</div>
<div class="card3 row">
<div class="text2 col-12"><span class="span2">03.</span>Customer <br/> support 24/7
<P class="para5">Tere is a local service provider and we are proud to support you in your local language. We are proud to be at your service 24/7!</P>
</div>
<div class="img7 col-12"><img class="image10" src="./img/Frame (2).jpg" alt=""></div>
</div>
</div>
</div>
</section>
<footer class="container-fluid">
<div class="foot row">
<div class="foot-img col-12">
<img class="image1 image11" src="./img/img1.png" alt="">
</div>
<div class="foot-list">
<div>
<ul>
<p class="para6">Be Our Friend</p>
<li>3,season park jakarta</li>
<li>supprt@food</li>
<li>021-111-2222</li>
</ul>
</div>
<div class="not-show">
<ul>
<p class="para6">Be Our Friend</p>
<li>3,season park jakarta</li>
<li>supprt@food</li>
<li>021-111-2222</li>
</ul>
</div>
</div>
<div class="foot-img2">
<img class="image12" src="./img/img3.png" alt="">
<img class="image12" src="./img/img4.png" alt="">
</div>
</div>
<hr/>
<div class="foot-end">
All Rights Reseverd tere by Codematics 2022
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>