forked from findthemasks/findthemasks
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index-automated.html
181 lines (153 loc) · 8.84 KB
/
index-automated.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
<!DOCTYPE html>
<html>
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-161442455-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-161442455-1');
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="locations.js"></script>
<title>#Findthemasks</title>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet">
<meta name=”description” content=”Help #findthemasks for covid-19” />
<meta name=”keywords” content=”#findthemasks, masks, n95, coronavirus, covid-19” />
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<style>
/* Styling for the JS generated locations list */
.locations-list {
padding-bottom: 10px;
border-bottom: 1px solid #efefef;
}
.state h2 {
font-size: 28px;
padding-top: 20px;
padding-bottom: 20px;
margin: 0px;
font-weight: 400;
border-top: 1px solid #efefef;
}
.city h3 {
font-size: 20px;
padding-bottom: 20px;
margin: 0px;
text-transform: uppercase;
}
.city {
line-height: 1.2;
padding-bottom: 10px;
}
.city h4 {
font-size: 18px;
font-weight: 600;
padding-bottom: 10px;
margin: 0px;
}
.city p {
margin: 0px;
font-size: 18px;
}
.location {
padding-bottom: 20px;
}
.location label {
color: #777;
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
}
.donation-sites h1 {
margin-bottom: -10px;
}
.filters-list {
margin-bottom: 30px;
}
.filters-list div {
display: inline-block;
margin-top: 0.5rem;
}
.filters-list h4 {
font-size: 20px;
text-transform: uppercase;
margin-top: 30px;
margin-bottom: 10px;}
.filters-list input {
display: none;
}
.filters-list label {
border: 1px black solid;
font-size: 18px;
padding: 0.3rem 0.4rem;
cursor: pointer;
}
.filters-list label:hover {
background-color: #efefef;
}
.filters-list label.selected {
background-color: #ccc;
}
</style>
</head>
<body>
<main class="content">
<div class="container" style="padding-bottom: 40px;">
<h1 style="padding: 20px 0px 10px 0px;">#findthemasks</h1>
<h5 style="padding-bottom: 20px;">America’s frontline healthcare workers are treating COVID19 patients without adequate protective gear, risking their lives! They have taken to Twitter on <a href="https://twitter.com/search?q=%23GetMePPE&src=typeahead_click">#GetMePPE</a> to ask for help:</h5>
<div class="container">
<div class="row">
<div class="col-md-4">
<blockquote class="twitter-tweet" style="width: 100%"><p lang="en" dir="ltr">NYC. Mother of two, double frontline MD couple. Don’t make us orphan our two toddlers. Running out of masks, eye protection and gloves at work. <a href="https://twitter.com/VP?ref_src=twsrc%5Etfw">@VP</a> <a href="https://twitter.com/NYGovCuomo?ref_src=twsrc%5Etfw">@NYGovCuomo</a> <a href="https://twitter.com/hashtag/GetMePPE?src=hash&ref_src=twsrc%5Etfw">#GetMePPE</a> <a href="https://twitter.com/choo_ek?ref_src=twsrc%5Etfw">@choo_ek</a> <a href="https://t.co/siI9TegNOL">pic.twitter.com/siI9TegNOL</a></p>— Cornelia Griggs (@CorneliaLG) <a href="https://twitter.com/CorneliaLG/status/1240069357067210760?ref_src=twsrc%5Etfw">March 18, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>
<div class="col-md-4">
<blockquote class="twitter-tweet" style="width: 100%"><p lang="en" dir="ltr">This is what it looks like in the ICU. Rows of brown bags each labeled with the name of a nurse or doctor . We are told to keep and reuse these masks , which under normal conditions would be thrown out each time we leave the isolation room. <a href="https://twitter.com/hashtag/GetMePPE?src=hash&ref_src=twsrc%5Etfw">#GetMePPE</a> <a href="https://t.co/8blP8LzAGv">pic.twitter.com/8blP8LzAGv</a></p>— Victoria Williams (@V_Q_W) <a href="https://twitter.com/V_Q_W/status/1240675890276831234?ref_src=twsrc%5Etfw">March 19, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>
<div class="col-md-4">
<blockquote class="twitter-tweet" style="width: 100%"><p lang="en" dir="ltr">I work Urgent Care, seeing patients with flu-like symptoms all day long. We have been told that a surgical mask is all we "need" to protect us from <a href="https://twitter.com/hashtag/COVID19?src=hash&ref_src=twsrc%5Etfw">#COVID19</a>. <a href="https://twitter.com/hashtag/GetMePPE?src=hash&ref_src=twsrc%5Etfw">#GetMePPE</a> <a href="https://t.co/trIu40JSpA">pic.twitter.com/trIu40JSpA</a></p>— Jess HT MD (@JessHTMD) <a href="https://twitter.com/JessHTMD/status/1240039466372227072?ref_src=twsrc%5Etfw">March 17, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>
</div>
</div>
<p style="padding-top: 30px; font-weight: 700">We need to help the helpers, right now.</p>
<h3 style="padding-bottom: 30px">We need to find the masks.</h3>
<div class="container">
<div class="row">
<div class="col-md-6">
<p>Look in your basement, your emergency kit, your bug out bag, your workbench for <span class="embold">N95 masks</span>. They look like this:</p>
<img src="n95.jpg" style="width: 100%; padding-bottom: 20px;" alt="three particulate respirator masks. The first is white with a filter cartridge on the front labelled “3M NIOSH N100”, the second is white with large black letters that say N95, the third is turquoise" class="visual pic gridCenter"/>
</div>
<div class="col-md-6">
<p>If you find <span class="embold">surgical masks</span>, those are also in short supply, and in many places are being used in place of N95s. They look like this:</p>
<img src="surgical.jpg" style="width: 100%; padding-bottom: 20px;" alt="A blue surgical mask, it has multiple layers of material and ear loops" width="700" class="visual pic gridCenter"/>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-12">
<p>All of these masks can save lives now if you get them into the hands of healthcare workers.</p>
<p>Disposable <span class=embold>booties</span>, <span class=embold>safety goggles</span>, and <span class=embold>disposable suits</span> are also in short supply. If you have these things or know someone who might (HVAC installers? Construction workers?) please share this site with them!</p>
</div>
</div>
</div>
<h2 style="padding: 20px 0px;">How to donate</h2>
<ol>
<li> Call your local hospital and ask to speak to the charge nurse.
<li> Say what you have.
<li> If they say they’re fine, that’s ok. Call back in a couple days.
</ol>
<p>If you find a hospital taking donations from the public, please <a href="https://docs.google.com/forms/d/e/1FAIpQLSfgCpK5coPVFC6rJrE7ZhimiZuDoEaL6fo6gYqxsN_FIpJZhg/viewform">fill in this form</a> so we can add them to the site.</p>
<h2 style="padding: 20px 0px;">List of donation sites</h2>
<h4>Filters</h4>
<form name="filters" class="filters-list"></form>
<div class="locations-list"></div>
<p style="padding-top: 30px;">Got a comment or suggestion? Want to help? [email protected] or add directly on <a href="https://github.com/r-pop/findthemasks">our Github</a>.</p>
<p class="centerText">made with <3 in Seattle</p>
<a href="whoweare.html" class="end">who we are</a>
</div>
</main>
</body>
</html>