-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
303 lines (299 loc) · 10.5 KB
/
index.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
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=0.68, maximum-scale=0.68, minimum-scale=0.68">
<title>Don't Pay Trump</title>
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#ff9f1c">
<meta name="apple-mobile-web-app-title" content="Don't Pay Trump">
<meta name="application-name" content="Don't Pay Trump">
<meta name="theme-color" content="#ffffff">
<meta name="google-site-verification" content="5ep7RoQHl8Zb5Ibkj-MT5Umpx7H7gZh2qAdULHN4hhE" />
<meta property="og:title" content="Don't Pay Trump – The Simple Trump Boycott Extension" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://www.dontpaytrump.com" />
<meta property="og:image" content="http://www.dontpaytrump.com/og2.png" />
<meta property="og:description" content="The simple Trump boycott extension that makes it easy to be a conscious consumer and keep your money out of Trump’s tiny hands." />
<link href="https://fonts.googleapis.com/css?family=Fjalla+One|Roboto:300,400,500" rel="stylesheet">
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-88384893-2', 'auto');
ga('send', 'pageview');
</script>
<style type="text/css">
* {
margin: 0;
padding: 0;
border: 0;
}
html {
height: 100%;
width: 100%;
}
body {
margin: auto;
background: #fff;
top: 100px;
position:relative;
color: #666;
font-family: 'Fjalla One', sans-serif;
background: url("logo.png") no-repeat center top;
background-size: 275px 562px;
}
p {
font-size: 18px;
line-height: 28px;
text-align: left;
margin-bottom: 24px;
}
h1 {
font-family: 'Fjalla One', sans-serif;
font-size: 60px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
text-align: center;
color: #d98716;
}
a {
font-weight: 500;
color: #d98716;
text-decoration: none;
outline: none;
transition: color .21s ease-in-out;
-o-transition: color .21s ease-in-out;
-moz-transition: color .21s ease-in-out;
-webkit-transition: color .21s ease-in-out;
}
a:hover {
color: #ab6a11;
}
#hero {
margin: auto;
text-align: center;
}
#hook {
font-family: 'Roboto', sans-serif;
font-size: 26px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
line-height: 1.38;
text-align: center;
color: #d98716;
margin: 50px 0;
}
.babomba {
align-items: center;
background: none;
border: 0;
box-shadow: inset 0 0 0 8px #d98716;
color: #d98716;
cursor: pointer;
display: flex;
font-family: 'Fjalla One',sans-serif;
font-size: 40px!important;
height: 120px;
justify-content: center;
padding: 16px 32px;
text-align: center;
text-transform: uppercase;
text-decoration: none;
transition: box-shadow .25s cubic-bezier(.15,.75,.25,.84);
white-space: pre;
line-height: 1;
font-weight: 400;
margin: 0 auto;
box-sizing: border-box;
color: #d98716;
width: 322px;
height: 106px;
}
.babomba:hover {
box-shadow: inset 0 0 0 16px #d98716;
text-decoration: none;
color: #d98716;
}
#screenshawt {
width: 100%;
display:block;
margin: 100px auto;
-webkit-box-shadow: 0px 14px 44px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 14px 44px 0px rgba(0,0,0,0.2);
box-shadow: 0px 14px 44px 0px rgba(0,0,0,0.2);
}
#top {
width: 70%;
margin: auto;
}
#bottom {
padding: 100px 0 190px;
background-color: #ff9f1c;
}
#pero-why {
width:70%;
margin: auto;
}
#whyheader {
font-family: 'Fjalla One',sans-serif;
font-size: 40px;
color: #fff;
}
#whytext {
font-family: 'Roboto', sans-serif;
font-size: 40px;
font-weight: 400;
font-style: normal;
font-stretch: normal;
line-height: 1.25;
text-align: left;
color: #ffffff;
margin-top: 56px;
}
#footer {
width: 70%;
margin: 100px auto;
color: #d98716;
}
#stubb {
width: 239px;
height: 278px;
margin: 0 auto 100px;
display: block;
}
#slash {
height: 36px;
width: 21px;
margin-right:14px;
}
#contact{
margin:50px auto 100px;
text-align:center;
font-size:20px;
font-family: 'Roboto', sans-serif;
}
#deets {
background-color: #ffecd2;
}
#deets-table {
margin: auto;
width: 70%;
table-layout: fixed;
color: #d98715;
padding: 100px 0;
font-family: 'Roboto', sans-serif;
font-size: 18px;
vertical-align: top;
}
#deets-table td {
vertical-align: top;
padding: 50px 15px;
word-wrap: break-word;
width: 33%;
}
.deets-subhead {
font-size: 26px;
}
@media (max-width: 1200px) {
#top {
width: 80%;
}
#pero-why {
width:80%;
}
#footer {
width: 80%;
}
#deets-table {
width: 80%
}
}
@media (max-width: 1050px) {
#top {
width: 90%;
}
#pero-why {
width:90%;
}
#footer {
width: 90%;
}
#deets-table {
width: 90%
}
}
@media (max-width: 900px) {
#top {
width: 95%;
}
#pero-why {
width:95%;
}
#footer {
width: 95%;
}
#deets-table {
width: 95%
}
}
</style>
</head>
<body>
<div id="top">
<h1 id="hero">
DON'T PAY TRUMP
</h1>
<p id="hook">
The simple Trump boycott extension that makes it easy to be a conscious consumer and keep your money out of Trump’s tiny hands.
</p>
<a class="babomba" href="https://chrome.google.com/webstore/detail/dont-pay-trump/hnabeofjicpfonofmomeehhaecnfnnhg">GET THE PLUGIN</a>
<img id="screenshawt" src="screen.png" />
</div>
<div id="deets">
<table id="deets-table">
<tr>
<td><span class="deets-subhead">Get notified</span>
<br />
<br />The plugin contains a list of Trump supporting websites. When you visit one of those websites, you’re notified with an overlay on the page.</td>
<td><span class="deets-subhead">Tweet for change</span>
<br />
<br />The overlay provides a link to tweet at the owners of the website to voice your concerns. The plugin will never post on your behalf.</td>
<td><span class="deets-subhead">Visit alternatives</span>
<br />
<br />We researched top competitors of the companies on the boycott list and made sure they weren’t affiliated with Trump.</td>
</tr>
<tr>
<td><span class="deets-subhead">Settings</span>
<br />
<br />You always have the option to disable the plugin on any site. Click on the plugin icon in your extension bar to update your settings and prevent the overlay from showing on that site again until you re-enable it.</td>
<td><span class="deets-subhead">Privacy</span>
<br />
<br />Don’t Pay Trump does not track your browser activity or store any private information about you. We do use Google Analytics to collect anonymous usage statistics to help improve user experience, but you can opt out at <a href="http://tools.google.com/dlpage/gaoptout">http://tools.google.com/<wbr>dlpage/gaoptout</a>.</td>
<td><span class="deets-subhead">Contribute</span>
<br />
<br />Please send us feedback and help us keep the plugin up to date. Businesses who drop Trump products and relationships will be removed from the list. Contact us through our page in the Chrome Web Store under the Support tab or at <a href="mailto:[email protected]">[email protected]</a>.</td>
</table>
</div>
<div id="bottom">
<img id="stubb" src="stubb.png" />
<div id="pero-why">
<img id="slash" src="slash.png" /><span id="whyheader">WHY</p>
<p id="whytext">We can fight back against Trump's harmful policies with our power as consumers. Boycotting businesses affiliated with Trump and affecting their bottom line will cause them to put pressure on his administration or drop his products. Reason, peaceful protest, and common human decency seem to have fallen on deaf ears, but money is a language he understands well.
<br />
<br />Hit Trump where it hurts most – his wallet.
</div>
</div>
<div id="footer">
<a class="babomba" href="https://chrome.google.com/webstore/detail/dont-pay-trump/hnabeofjicpfonofmomeehhaecnfnnhg">GET THE PLUGIN</a>
<div id="contact"><a href="mailto:[email protected]">[email protected]</a> | <a href="http://www.twitter.com/dontpaytrump">@dontpaytrump</a></span>
</div>
</div>
</body>
</html>