-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathdonate.html
More file actions
157 lines (155 loc) · 9.74 KB
/
Copy pathdonate.html
File metadata and controls
157 lines (155 loc) · 9.74 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
<!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">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/all.min.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/global.css">
<title></title>
<!--
Designed by Shahedul Islam
Fiverr: dev_shahed
Facebook: https://www.facebook.com/lolachost.shahed
-->
</head>
<body>
<header class="position-fixed bg-white left-0 top-0 w-100 border">
<div class="container-fluid py-3 row justify-content-center align-items-center">
<div id="logo" class="col-md-2 col-4">
<img class="img-fluid" src="https://www.equalityaction.org.uk/img/misc/equality-action-logo-small.png" alt="Logo">
</div>
<nav class="col-md-10 col-8 row justify-content-end align-items-center">
<ul class="m-0 col-10 list-unstyled d-xl-flex d-none justify-content-around align-items-center">
<li><a class="text-decoration-none text-dark p-1 navLink" href="index.html">HOME</a></li>
<li><a class="text-decoration-none text-dark p-1 navLink" href="about.html">ABOUT US</a></li>
<li><a class="text-decoration-none text-dark p-1 navLink" href="projects.html">WHAT WE DO</a></li>
<li><a class="text-decoration-none text-dark p-1 navLink" href="publications.html">PUBLICATIONS</a></li>
<li><a class="text-decoration-none text-dark p-1 navLink" href="support.html">SUPPORT US</a></li>
<li><a class="text-decoration-none text-dark p-1 navLink" href="news.html">NEWS & EVENTS</a></li>
<li><a class="text-decoration-none text-dark p-1 navLink" href="contact-us.html">CONTACT US</a></li>
</ul>
<div id="donate" class="col-2 d-flex justify-content-end align-items-center">
<a class="text-decoration-none m-0 bg-danger text-white px-md-4 px-2 py-md-2 py-1 rounded-pill h6" href="donate.html">Donate</a>
</div>
<div class="col-1 text-end d-xl-none d-block">
<button onclick="sideBar()" class="btn p-0 m-0 text-dark"><i class="fas fa-bars fa-2x"></i></button>
</div>
</nav>
</div>
</header>
<main>
<!-- ============== Donate part ============== -->
<section id="donate">
<ul id="sideBar" class="text-center position-fixed top-0 right-0 list-unstyled flex-column justify-content-center align-items-center bg-danger">
<li class="my-3"><a class="text-decoration-none text-white navLink" href="index.html">HOME</a></li>
<li class="my-3"><a class="text-decoration-none text-white navLink" href="about.html">ABOUT US</a></li>
<li class="my-3"><a class="text-decoration-none text-white navLink" href="projects.html">WHAT WE DO</a></li>
<li class="my-3"><a class="text-decoration-none text-white navLink" href="publications.html">PUBLICATIONS</a></li>
<li class="my-3"><a class="text-decoration-none text-white navLink" href="support.html">SUPPORT US</a></li>
<li class="my-3"><a class="text-decoration-none text-white navLink" href="news.html">NEWS & EVENTS</a></li>
<li class="my-3"><a class="text-decoration-none text-white navLink" href="contact-us.html">CONTACT US</a></li>
</ul>
<div class="container">
<h2 class="text-center">Every Donation Helps</h2>
<p class="text-center py-3">Help us to continue what we do by sending us a donation.
Every donation we receive goes towards promoting equality and diversity throughout Loughbrough and Leicestershire.</p>
<div class="row py-5 my-2">
<div class="col-9">
<h3 class="pb-2">Method 1: Online Donations</h3>
<p>Donating online is easy!<br>
Simply tell us how much you would like to donate and click the 'Donate' button below.</p>
<button onclick="activeBtn1()" class="currencyBtn1 btn border border-2 border-danger donateBtn text-danger">£5</button>
<button onclick="activeBtn2()" class="currencyBtn2 btn border border-2 border-danger donateBtn text-danger">£19</button>
<span>OR</span>
<input id="currencyInput" class="text-danger bg-transparent border border-2 border-danger p-1" type="number">
<a id="dntBtn" class="btn text-white border border-2 border-danger rounded-pill bg-danger" href="#">DONATE</a>
</div>
<div class="col-3 d-flex justify-content-end">
<div>
<img class="img-fluid" src="https://www.equalityaction.org.uk/images/aboutgraphicslow/online-donation.png" alt="">
</div>
</div>
</div>
<div class="row py-5 my-2">
<div class="col-9">
<h3 class="pb-2">Online Donation
Method 2: Cash or Cheque</h3>
<p>Please send cash and cheque donations by post to:</p>
<h6>Equality Action</h6>
<h6>66 Nottingham Road</h6>
<h6>Loughborough</h6>
<h6>Leicestershire</h6>
<h6>LE11 1EU</h6>
</div>
<div class="col-3 d-flex justify-content-end">
<div>
<img class="img-fluid" src="https://www.equalityaction.org.uk/images/aboutgraphicslow/postage-donation.png" alt="">
</div>
</div>
</div>
</div>
</section>
<!-- =========== Join our mailing list part =========== -->
<section id="join" class="bg-primary py-4">
<div class="container">
<div class="row justify-content-center align-items-center">
<div class="col-lg-9 col-12 text-white">
<h2>Join our mailing list</h2>
<p>Keep up to date with what's happening here at Equality Action by joining our mailing list; where you will get regular updates about the work and projects as well any events and activities taking place.</p>
</div>
<div class="col-lg-3 col-12">
<div class="float-end">
<a class="bg-white text-primary border border-2 border-white h6 text-decoration-none rounded-pill py-2 px-3" href="#">Join our mailing list</a>
</div>
</div>
</div>
</div>
</section>
</main>
<footer class="text-white py-4">
<div class="container">
<div class="row">
<div class="col-sm-6 col-12">
<h2>Contact Us</h2>
<div class="footerLogos">
<a class="text-decoration-none text-white m-3" href="#"><i class="fab fa-facebook fa-3x"></i></a>
<a class="text-decoration-none text-white m-3" href="#"><i class="far fa-envelope fa-3x"></i></a>
<a class="text-decoration-none text-white m-3" href="#"><i class="fab fa-twitter fa-3x"></i></a>
</div>
<ul class="list-unstyled my-4">
<li>Email: <a class="text-white text-decoration-none" href="#">example@gmail.com</a></li>
<li>Phone: <a class="text-white text-decoration-none" href="#">+88016******</a></li>
</ul>
</div>
<div class="col-sm-6 col-12">
<h2>Quick Links</h2>
<div class="row justify-content-center mt-3 align-items-center">
<ul class="list-unstyled d-flex flex-column col-6">
<li><a class="text-decoration-none text white" href="home.html">Home</a></li>
<li><a class="text-decoration-none text white" href="about.html">About Us</a></li>
<li><a class="text-decoration-none text white" href="projects.html">Projects</a></li>
<li><a class="text-decoration-none text white" href="publications.html">Publications</a></li>
</ul>
<ul class="list-unstyled d-flex flex-column col-6">
<li><a class="text-decoration-none text white" href="support.html">Support Us</a></li>
<li><a class="text-decoration-none text white" href="#">News & Events</a></li>
<li><a class="text-decoration-none text white" href="privacy-policy.html">Privacy Policy</a></li>
<li><a class="text-decoration-none text white" href="#"></a></li>
</ul>
</div>
</div>
</div>
<p>Copyright © 2021 Company Name. All Rights Reserved | Company No:*** | Reg Charity No:******</p>
<a class="text-decoration-none text-white" href="https://www.facebook.com/localhost.shahed" target="_blank">Designed by Shahedul Islam</a>
</div>
</footer>
<script src="js/bootstrap.bundle.min.js"></script>
<script src="js/all.min.js"></script>
<script src="js/particles.min.js"></script>
<script src="js/app.js"></script>
<script src="js/index.js"></script>
</body>
</html>