-
Notifications
You must be signed in to change notification settings - Fork 24
/
membership_form.html
249 lines (219 loc) · 13.6 KB
/
membership_form.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
<!DOCTYPE html>
<html>
<head>
<title>Membership Forms</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="module" src="js/hf.js"></script>
<link rel="stylesheet" href="css/styles.css">
<link rel="stylesheet" href="css/membership_styles.css">
<link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- fonts -->
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400&display=swap" rel="stylesheet">
</head>
<body>
<!-- navbar -->
<div class="container-fluid navbar navbar-expand-lg sb-navbar sticky-top">
<a class="navbar-brand" href="#"><img src="images/ieee_sb_logo.png"></a>
<button class="navbar-toggler" type="button" data-trigger="#navbarNavDropdown">
<i class="fa fa-bars hamburger" aria-hidden = "true"></i>
</button>
<div class="navbar-collapse justify-content-end" id="navbarNavDropdown">
<div class="offcanvas-header mt-3">
<button class="btn btn-outline-danger btn-close float-right"> × </button>
<h5 class="py-2 text-white">IEEE SB GVPCE(A)</h5>
</div>
<my-header></my-header>
</div>
</div>
<header class="membership-banner">
<div class="container h-100">
<div class="row h-100 align-items-center">
<div class="col-12 text-center">
<h1>Membership Form</h1>
</div>
</div>
</div>
</header>
<section class="container container-fluid membership-form">
<div class="container">
<div class="row p-3">
<div class="col-lg-4 membership-form-head rounded box">
<div class="membership-form-heading">
<h1>Interested to join IEEE</h1>
<p class="lead">Total amount $ 27 (for full year student membership). Consult your <a href="#contact-info" style="color: #fff; font-weight: bold;">student branch counsellor</a> after filling the form for payment</p>
</div>
</div>
<div class="col-lg-8 py-5 membership-form-info rounded box">
<!-- We're going to place the form here in the next step -->
<form id="membership-form" method="post" action="https://docs.google.com/forms/u/0/d/e/1FAIpQLScsVYN4GCTyhFOSDsxb8Kr9ulHCDakUp-QczpDcFvjT2ZbgaQ/formResponse" role="form">
<div class="messages"></div>
<div class="controls">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="form_name">First Name *</label>
<input id="form_name" type="text" name="entry.1054603866" class="form-control" placeholder="Please enter your firstname" required="required" data-error="Firstname is required.">
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="form_lastname">Last Name *</label>
<input id="form_lastname" type="text" name="entry.1583569679" class="form-control" placeholder="Please enter your lastname" required="required" data-error="Lastname is required.">
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-6">
<div class="form-group">
<label for="form_email">Email Id *</label>
<input id="form_email" type="email" name="entry.767989661" class="form-control" placeholder="Please enter your email" required="required" data-error="Valid email is required.">
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<label for="form_phone">Contact *</label>
<input id="form_phone" type="tel" name="entry.1773494130" class="form-control" placeholder="Please enter your phone no." required="required" data-error="Your phone number is required.">
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label for="form_need">Membership Type *</label>
<select id="form_need" name="entry.1175181684" class="form-control" required="required" data-error="Please select your branch/ stream.">
<option value=""></option>
<option value="Student">Student</option>
<option value="Professional">Professional</option>
</select>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="form_need">Please select your branch/ stream *</label>
<select id="form_need" name="entry.311852791" class="form-control" required="required" data-error="Please select your branch/ stream.">
<option value=""></option>
<option value="CSE">CSE</option>
<option value="ECE">ECE</option>
<option value="EEE">EEE</option>
<option value="MECH">MECH</option>
<option value="IT">IT</option>
<option value="CIVIL">CIVIL</option>
<option value="CHEMICAL">CHEMICAL</option>
<option value="M.TECH">M.TECH</option>
<option value="MCA">MCA</option>
</select>
<div class="help-block with-errors"></div>
</div>
</div>
<!-- <div class="col-md-12">
<div class="form-group">
<label for="form_message">Message *</label>
<textarea id="form_message" name="entry.198948346" class="form-control" placeholder="Drop your message here" rows="4" required="required" data-error="Please, leave us a message."></textarea>
<div class="help-block with-errors"></div>
</div>
</div> -->
<div class="col-md-12">
<input type="submit" class="btn btn-success btn-send" value="Submit Details">
</div>
</div>
<div class="row">
<div class="col-md-12">
<p class="text-muted">
<strong>*</strong> These fields are required.</p>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</section>
<section class="container container-fluid membership-process rounded">
<div class="container membership-process-heading">
<div class="row">
<div class="col-sm-12">
<h1 class="glow">Steps to get membership online</h1>
</div>
</div>
</div>
<div class="container container-fluid membership-process-info">
<div class="row">
<div class="col-xs-12">
<div class="container lead_">
<p>Apart from many benefits offered by IEEE, the IEEE membership will enhance your professional and technical skills. IEEE student chapter is one of the student’s highest platform to be recognized world over for students in the field of Electrical, Electronics and Computer Engineering.</p>
<p><i class="fa fa-star" aria-hidden="true" style="color: #fff;"></i> All those PG & UG students who are interested to become IEEE student member should follow the following steps.</p>
<p>Follow the procedure given below for creating your IEEE student membership online.</p>
</div>
<div class="list-group rounded" style="font-weight: 400;">
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>Visit <a href="www.ieee.org/membership/">www.ieee.org/membership/</a></p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>After being directed to a new webpage, click on <b>Join as a student.</b></p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>A dialog box pops up asking to sign-in or create a new account.</p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>Fill up your personal details in case you are creating a new account or sign-in if you already have an account.</p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>Then you will be directed to membership and subscription Catalog page.</p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>Select student member and add the item to your cart. The membership fare is US $27.00</p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>Click on <b>Proceed to Checkout</b> option available in <b>My cart.</b></p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>Your purchase details and membership application details will be shown. Verify and proceed for payment after giving your shipment address.</p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>Acknowledge the 2 boxes regarding the terms and conditions and checkout.</p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>Now you have to choose the payment option.</p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>If you are paying through credit card then fill up the details of credit card and continue.</p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>For payment through check/DD, click on <b>Print Order to Mail or Fax.</b> It will show a proforma titled <b>Print and Mail/Fax.</b> Complete the proforma filling details of check/DD in the column check number.</p>
</div>
<div class="list-group-item">
<p class="mb-0"><i class="fa fa-check-square-o fa-2x mr-4 blue p-2 white-text rounded " aria-hidden="true"></i>For further queries contact our IEEE SB GVPCE(A) @ <a href="mailto:[email protected]? subject = ">[email protected]</a></p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="page-footer" id="contact-info">
<div class="container footer-heading">
<div class="row">
<div class="col-sm-10 offset-sm-1">
<h1 class="text-center">Contact Us</h1>
<hr class="underline" align="center" style="width:8.5em">
</div>
</div>
</div>
<my-footer></my-footer>
</section>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
<script type="text/javascript" src="js/scripts.js"></script>
</body>
</html>