forked from TaruGuardians/HandsforHelp
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
239 lines (182 loc) · 9.12 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HandsforHelp</title>
<link rel="icon" href="images/Logo.png">
<!-- google-font -->
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;500;700;900&family=Ubuntu:wght@300;400&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Charm&display=swap" rel="stylesheet">
<!-- css-stylesheets -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<link class="toggle" rel="stylesheet" href="css/darkcovid.css">
<!-- font-awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://kit.fontawesome.com/81e1b39fdf.js" crossorigin="anonymous"></script>
<!-- bootstrap -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
</head>
<body>
<section id="nav-portion">
<!-- Nav Bar -->
<div class="container">
<nav class="navbar navbar-expand-md navbar-dark">
<img class="logo" src="images/taru.png" alt="">
<div class="adjust">
<a class="navbar-brand" href="">HandsforHelp</a>
<i class="fas fa-hand-holding-medical fa-2x"></i>
</div>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="#search-box">Search</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://milaap.org/fundraisers/support-taruguardians-1#">Donate</a>
</li>
<li class="nav-item">
<a class="nav-link" href="About Us/AboutUs.html">About Us</a>
</li>
</ul>
</div>
<button onclick="changeCSS('css/lightcovid.css',0)" type="button" class="btn btn-light"><i class="fas fa-sun"></i></button>
<button onclick="changeCSS('css/darkcovid.css',0)" type="button" class="btn btn-dark"><i class='fas fa-moon'></i></button>
</nav>
</div>
</section>
<!-- Search box for states -->
<div>
<section id="search-box">
<center>
<div class="form-box">
<img id="images" src="images/World health day-pana.png" >
<select name="state" class="input-field" id="state" required>
<!-- options to select your region -->
<option class="b" value="">Enter your state</option>
<option class="b" value="Bihar">Bihar</option>
<option class="b" value="Jharkhand">Jharkhand</option>
<option class="b" value="West Bengal">West Bengal</option>
</select>
<p></p>
<button type="button" class="btn btn-info search-button" onclick="mypress()">Search</button>
</div>
</center>
</section>
</div>
<div class="end-border">
<!-- -->
</div>
<section id="title-portion">
<!-- Title -->
<div class="row_head">
<h3 class="row_head_first">Let's Fight Back Together!</h3>
<h4 class="row_head_second">We are Virtual, Yet Together</h4>
<P id="para">Humanity has experienced the most serious global pandemic in a century while the devastating second wave has broken all previous records. India is facing an acute covid crisis and currently, people are dying due to shortage of oxygen cylinders, hospital beds and plasma donars. The situation in Our Country is a bleak reminder that none of us will be safe until everyone is safe. Hence this is a small initiative by our NGO TaruGuardians where we will arrange the resources for the Covid Warriors and save as many lives as possible. </P>
</div>
</section>
</div>
<!-- Features -->
<section id="features">
<div class="row">
<div class="col-lg-4 feature-box">
<i class="fas fa-bed fa-4x utkarsh"></i>
<h3>Beds.</h3>
<p>Get information regarding medical beds.</p>
</div>
<div class="col-lg-4 feature-box">
<i class="fas fa-air-freshener fa-4x utkarsh"></i>
<h3>Oxygen.</h3>
<p>Get information regarding Oxygen supplies.</p>
</div>
<div class="col-lg-4 feature-box">
<i class="fas fa-hospital-user fa-4x utkarsh"></i>
<h3>Plasma.</h3>
<p>Get information regarding Plasma donars.</p>
</div>
</div>
</section>
<!-- Search -->
<section id="pricing">
<h2 class="don">We are trying our best.</h2>
<p class="pricing-p">We make sure our every information is verified.</p>
<div class="row">
<div class="pricing-column col-lg-4 col-md-4">
<div class="card text-center">
<div class="card-header above">
<h3>Select State</h3>
</div>
<div class="card-body below" id="inside_card">
<h3>We are with you</h3>
<p>Choose the state where you need information about supplies and contacts.</p>
<button type="button" class="btn btn-lg btn-block btn-outline-success dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Select
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="rive/bihar.html">Bihar</a>
<a class="dropdown-item" href="rive/jharkhand.html">Jharkhand</a>
<a class="dropdown-item" href="rive/west-bengal.html">West Bengal</a>
</div>
</div>
</div>
</div>
<div class="pricing-column col-lg-4 col-md-4">
<div class="card text-center" >
<div class="card-header above">
<h3>Donate</h3>
</div>
<div class="card-body below" id="inside_card">
<h3>Help Others</h3>
<p>Please also donate so we can help others as well as mother our earth.</p>
<button class="btn btn-lg btn-block btn-outline-success"type="button" onclick="donate()">Donate</button>
</div>
</div>
</div>
<div class="pricing-column col-lg-4 col-md-4">
<div class="card text-center" >
<div class="card-header above">
<h3>About Us</h3>
</div>
<div class="card-body below" id="inside_card">
<h3>Know Us</h3>
<p>Click below to see who are trying their best to help the society and nature.</p>
<button class="btn btn-lg btn-block btn-outline-success"type="button" onclick="about()">About us</button>
</div>
</div>
</div>
</div>
</section>
<!-- Call to Action -->
<section id="cta">
<h3 class="cta-heading">Add Information</h3>
<p>Send us any information, contact details, files, pdf's
or links which you don't find in our website and you think it can help to save lives. We will add them so that others can see.</p>
<a href="mailto:[email protected]"><button type="button" class="btn btn-lg btn-dark download-button"><i class="fas fa-seedling"></i> Send Us</button></a>
</section>
<!-- Footer -->
<section id="footer">
<div class="row">
<div class="col">
<img class="footer-image" src="images/covid.png" alt="mockup">
</div>
<div class="col uttu">
<a href="https://www.facebook.com/taru.guardians.3"><img class="social-icon" src="images/facebook.png" alt="mockup"></a>
<a href="mailto:[email protected]"><img class="social-icon" src="images/gmail.png" alt="mockup"></a>
<a href="https://instagram.com/_taruguardians_?igshid=1u7h3d9cz98od"><img class="social-icon" src="images/insta.png" alt="mockup"></a>
<img class="social-icon" src="images/twitter.png" alt="mockup">
</div>
<div class="col">
<img class="injection-image" src="images/inject.png" alt="image">
</div>
</div>
</section>
<script src="index.js" charset="utf-8"></script>
</body>
</html>