-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
235 lines (202 loc) · 9.36 KB
/
index.html
File metadata and controls
235 lines (202 loc) · 9.36 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Blood Donation</title>
<link rel="stylesheet" href="index.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div class="he">
<h1>Blood donation</h1>
</div>
<div class="nbgm">
<nav>
<ol>
<a href="#" class="ho">home</a>
<a href="#" class="ho">sign in</a>
<a href="#" class="ho">about us</a>
<a href="sign2.html" class="log" target="_blank" >login</a>
</ol>
</nav>
</div>
<div class="content">
<h1>donate blood, save life</h1>
<p>DONATE YOUR BLOOD AND INSPIRE OTHER TO DONATE.</p>
<div>
<button type="button" class="join" style="float: left;width: 17%; margin-top: 15px;" >Join us</button>
</div>
</div>
<div class="bod">
<div class="btn2">
<h4>WE ARE HERE FOR HELPING PEOPLE</h4>
<p>You can give blood at any of our blood donation venues. We have several donor centers and visit other vanues
on various occassions.</p>
<button class="bov" type="button" style="margin-bottom: 50px;">REQUEST APPOINTMENT</button>
</div>
</div>
<div class="container">
<section class="main">
<div class="quote">
<p style="color: black;">
"A single pint can save three lives. A single gesture can create a million smiles.
Bring a life back to power. Make blood donation your responsibility."
<br>
~ American Red Cross
</p>
</div>
<div class="appointment-box">
<h2>Blood Donation Appointment</h2>
<form id="appointmentForm">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
<label for="mobile">Mobile Number:</label>
<input type="tel" id="mobile" name="mobile" pattern="[0-9]{10}" required>
<small>Enter a 10-digit mobile number.</small>
<label for="date">Date:</label>
<input type="date" id="date" name="date" required>
<label for="time">Time:</label>
<input type="time" id="time" name="time" required>
<label for="bloodType">Blood Type:</label>
<select id="bloodType" name="bloodType" required>
<option value="A+">A+</option>
<option value="B+">B+</option>
<option value="O+">O+</option>
<option value="AB+">AB+</option>
<option value="A-">A-</option>
<option value="B-">B-</option>
<option value="O-">O-</option>
<option value="AB-">AB-</option>
</select>
<label for="state">State:</label>
<select id="stateType" name="stateType" required>
<option value="A+">Uttar Pradesh</option>
<option value="B+">Andhra Pradesh</option>
<option value="O+">Punjab</option>
<option value="AB+">West Bengal</option>
<option value="A-">Maharastra</option>
<option value="B-">Odisha</option>
<option value="O-">Kerala</option>
<option value="AB-">Gujarat</option>
<option value="AB-">Rajasthan</option>
</select>
<button type="button" onclick="submitForm()">Submit Appointment</button>
</form>
</div>
</div>
<script>
function submitForm() {
alert("Form submitted successfully!");
}
</script>
</section>
<section class="main2">
<div class="container2">
<div class="instructions">
<div class="box">
<h2>Step 1</h2>
<div class="instruction-step">
<img src="registraionlogo.jpg" alt="Step 1" class="instruction-image" height="150px" width="150px">
<p>You need to complete a very simple registration form which contatins all required contact information to enter in the donation process</p>
</div>
</div>
<div class="box">
<h2>Step 2</h2>
<div class="instruction-step">
<img src="png-clipart-hospital-hospital-computer-icons-medicine-clinic-clinic-miscellaneous-blue-thumbnail.png" alt="Step 2" class="instruction-image" height="150px" width="150px">
<p>Arrive at the donation center and do screening process.</p>
<p>After passing screening test successfully you will be directed to a donor bed for donation. It will take only 6-10 minutes.</p>
</div>
</div>
<div class="box">
<h2>Step 3</h2>
<div class="instruction-step">
<img src="Lovepik_com-401374284-blood-donation.png" alt="Step 3" class="instruction-image" height="150px" width="150px">
<p>Donation blood.</p>
<p>You can also stay in the sitting room until you feel strong enough to leave the center. You will receive refreshments in the donation zone</p>
</div>
</div>
</div>
</div>
</section>
<div class="heading">
<h2 style="color: black;">
our voluenteers
</h2>
<hr style="opacity: 1; margin-top: 30px; margin-bottom: 20px; width: 100%;">
<p>The volunteers who give their talent and time to fulfill the mission.</p>
</div>
<section class="main3">
<div class="container3">
<div class="instructions">
<!-- Your existing content here -->
</div>
</div>
<!-- Our Team section -->
<div id="our-team">
<div class="team-member">
<img src="user-244.png" alt="Team Member 1">
<h3>SHASHANK SINGH</h3>
<p>Founder</p>
<div class="sci">
<a href="#" class="fa fa-facebook"></a>
<a href="#" class="fa fa-twitter"></a>
<a href="#" class="fa fa-linkedin"></a>
<a href="#" class="fa fa-instagram"></a>
</div>
</div>
<div class="team-member">
<img src="user-244.png" alt="Team Member 2">
<h3>ASHISH SINGH</h3>
<p>Coordinator</p>
<div class="sci">
<a href="#" class="fa fa-facebook"></a>
<a href="#" class="fa fa-twitter"></a>
<a href="#" class="fa fa-linkedin"></a>
<a href="#" class="fa fa-instagram"></a>
</div>
</div>
<div class="team-member">
<img src="user-244.png" alt="Team Member 3">
<h3>Gudala Praneenth</h3>
<p>Volunteer</p>
<div class="sci">
<a href="#" class="fa fa-facebook"></a>
<a href="#" class="fa fa-twitter"></a>
<a href="#" class="fa fa-linkedin"></a>
<a href="#" class="fa fa-instagram"></a>
</div>
</div>
</div>
</section>
<form action="backend.php">
<div class="container4">
<h1>Register</h1>
<p>Please fill in this form to create an account.</p>
<hr>
<label for="text"><b>Patient Name</b></label>
<input type="text" placeholder="Enter Patient Name" name="email" id="email" required>
<label for="psw"><b>Age</b></label>
<input type="text" placeholder="Enter Patient Age" name="psw" id="psw" required>
<label for="psw-repeat"><b>Email ID</b></label>
<input type="text" placeholder="Enter Patient Email ID" name="psw-repeat" id="psw-repeat" required>
<label for="yt"><strong>Mobile No.</strong></label>
<input type="text" name="mobile_no" id="mobile_no" placeholder="Enter Mobile No."><br>
<div class="gen2">
<label for="Gender" class="gender2"><strong>Gender</strong></label>
<strong> Male</strong><input class="gen" type="radio" placeholder="Male" name="myGender" style="width: 50px;"><strong>Female</strong><input class="gen" type="radio" name="myGender" id="" placeholder="Female" style="padding: 10px; width: 50px;" >
</div>
<hr>
<p>By creating an account you agree to our <a href="#">Terms & Privacy</a>.</p>
<button type="submit" class="registerbtn">Register</button>
</div>
<div class="container signin">
<p>Already have an account? <a href="sign2.html" target="_blank">Sign in</a>.</p>
</div>
</form>
<footer>
<p>© 2023 Blood Donation Website | <a href="#">Privacy Policy</a> | <a href="#">Contact Us</a></p>
</footer>
</body>
</html>