/
what-we-offer.html
203 lines (181 loc) · 8.49 KB
/
what-we-offer.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
<!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" />
<title>CareOnClick</title>
<!-- import the webpage's stylesheet -->
<link
rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
crossorigin="anonymous"
/>
<link rel="stylesheet" href="style.css" />
<!-- import the webpage's javascript file -->
<script src="/script.js" defer></script>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="Carousel.html">
<img id="brand-image" src="Big%20Logo.png" alt="CareOnClick Logo"/>
</a>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarText"
aria-controls="navbarText"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarText">
<ul class="navbar-nav mr-auto">
<li class="nav-item ">
<a class="nav-link" href="Carousel.html">Home </a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">About Us</a>
</li>
<!-- What we offer dropdown menu -->
<li class="nav-item active">
<a class="nav-link" href="what-we-offer.html"
>What We Offer<span class="sr-only">(current)</span></a>
</li>
<!-- What we offer dropdown menu -->
<!-- How to help menu -->
<li class="nav-item">
<a class="nav-link" href="how-to-help.html">How to Help</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://github.com/CareOnClick/Care-On-Click/issues/new?assignees=turtlemoons&labels=Feedback&template=custom.md&title=Please+enter+a+title+for+your+feedback+...">Contact Us</a>
</li>
<!-- How to help menu -->
</ul>
</div>
</nav>
<section class="about">
<h1 class="display-4">What we Offer</h1>
<div id="offer-container">
<button><a href="#carePacks">Care Packages</a></button>
<button><a href="#mentalHR">Mental Health Resources</a></button>
<button><a href="#support">Letters of Support</a></button>
</div>
<div class="container" id="carePacks">
<div class="row align-items-center our-purpose">
<div class="col-sm-9">
<h1 class="display-6">About our Care Packages</h1>
<p class="lead">
Our care packages were created to provide small,
essential needs of healthcare workers. From stress
relievers to mid-shift snacks and financial boosters, healthcare
workers can rely on these packages to get them through their long, tedious days.
</p>
</div>
<div class="col-sm-3">
<img
src="https://cdn.glitch.com/0cd19739-31b1-476a-8f9a-f9fb13145783%2Fimage%20(7).png?v=1622239755314" alt="tired healthcare worker" class="img-fluid"
/>
</div>
</div>
<div class="row align-items-center justify-content-center our-values">
<div class="col-sm-9">
<h1 class="display-6" style="text-align:center;">Donation Schedule</h1>
<p class="lead">
CareOnClick works with a different healthcare organization every month.This month we are joining ________. Check out the calendar below to see when our care packages will be distributed!
</p>
<iframe
src="https://calendar.google.com/calendar/embed?src=ia4h9rbo53g90g2qt3eetc0oro%40group.calendar.google.com&ctz=America%2FToronto"
style="border: 0"
width="800"
height="600"
frameborder="0"
scrolling="no"
></iframe>
</div>
</div>
</div>
</section>
<div class="container" id="mentalHR">
<div class="row align-items-center justify-content-center our-purpose">
<div class="col-sm-3">
<img
src="https://cdn.glitch.com/0cd19739-31b1-476a-8f9a-f9fb13145783%2Fimage%20(8).png?v=1622239756723" alt="healthcare worker reading" class="img-fluid"
/>
</div>
<div class="col-sm-9">
<h1 class="display-6">Mental Health Resources</h1>
<div class="container">
<div class="row">
<div class="col-sm">
Distress and Crisis Ontario
<a target="_blank" href="https://www.dcontario.org/">
<button style="float:right; background-color:#A4C4E0; border: 1px solid #000612; border-radius:2px" >Get Help</button>
</a>
</div>
<div class="col-sm">
BounceBack Ontario
<a target="_blank" href="https://bouncebackontario.ca/">
<button style="float:right; background-color:#A4C4E0; border: 1px solid #000612; border-radius:2px">Get Help</button>
</a>
</div>
</div>
<div class="row">
<div class="col-sm">
Starling
<a target="_blank" href="https://info.starlingminds.com/covid19-free-mental-health">
<button style="float:right; background-color:#A4C4E0; border: 1px solid #000612; border-radius:2px">Get Help</button>
</a>
</div>
<div class="col-sm">
ECHO Coping with COVID
<a target="_blank" href="https://camh.echoontario.ca/echo-coping-with-covid/">
<button style="float:right; background-color:#A4C4E0; border: 1px solid #000612; border-radius:2px">Get Help</button>
</a>
</div>
</div>
<div class="row">
<div class="col-sm">
Nurses Health Program
<a target="_blank" href="https://www.nurseshealth.ca/">
<button style="float:right; background-color:#A4C4E0; border: 1px solid #000612; border-radius:2px">Get Help</button>
</a>
</div>
<div class="col-sm">
Beacon Stronger Minds
<a target="_blank" href="https://www.mindbeacon.com/strongerminds">
<button style="float:right; background-color:#A4C4E0; border: 1px solid #000612; border-radius:2px">Get Help</button>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="let our-purpose" id="support">
<h1 class="display-6">Letters of Support</h1>
<p class="lead">Here you can read letters that members of our community have written for healthcare workers in this pandemic:</p>
<br>
<p class="lead">Dear Healthcare workers,
Thank you for the time and effort that you put in for the well-being of the public. This year has been difficult for all of us. I just wanted to take the time to show my gratitude and appreciation for all frontline workers, especially you the healthcare workers. Thank you for working tirelessly on the frontlines, thank you for sacrificing your time and lives to care for those who have been affected by this deadly virus. It is hard for everyone to understand what you are going through until they have been in your shoes. I truly am grateful for your hard work and dedication in these unprecedented times. Words cannot describe how grateful I am. Please remember that you will always be in our prayers.
</p>
</div>
<script
src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"
></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
crossorigin="anonymous"
></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"
integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
crossorigin="anonymous"
></script>
</body>
</html>