-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
289 lines (265 loc) · 16.2 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
<!doctype html>
<html lang="en">
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-V5ML6PCK79"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-V5ML6PCK79');
</script>
<meta charset="utf-8">
<title>Shane Levac you will be missed / 1981 - 2020</title>
<!-- Required meta tags -->
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="On October 17th, 2020, we all lost one of the most remarkable human beings we had the privilege to call a friend.">
<!-- Favicon -->
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
<meta property="og:url" content="https://shanelevac.com" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Shane Levac you will be missed / 1981 - 2020" />
<meta property="og:description" content="On October 17th, 2020, we all lost one of the most remarkable human beings we had the privilege to call a friend." />
<meta property="og:image" content="https://shanelevac.com/img/Sal.jpg" />
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="./style.css">
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=East+Sea+Dokdo&display=swap" rel="stylesheet">
</head>
<body>
<header class="container-fluid">
<h1>Shane Levac <small>(1981 - 2020)</small></h1>
<p>Gone but NEVER forgotten</p>
</header>
<main class="container-fluid">
<div class="bio container">
<p class="lead">Who was <strong>Shane Levac</strong>?</p>
<p>A husband, father, son, brother, friend and a versatile musician.</p>
<p>On <i>October 17<sup>th</sup>, 2020</i>, we all lost one of the most remarkable human beings we had the privilege to call a friend.</p>
<p><strong>Shane Andrew Levac</strong> was known for the <strong>music</strong> he created, the <strong>connections</strong> he made with his kind soul. If you knew <strong>Shane</strong> you would always be greeted with the tightest hug and a “<strong>how’s it going</strong>”. <strong>Shane</strong> had a special way to brighten up any room with that laugh and intense sense of humour.</p>
<p><strong>Kylie</strong> and <strong>Shane</strong> made an incredible couple! <strong>Kylie</strong> was definitely the love of his life. She grounded him and they created a wonderful life. 4½ months ago they welcomed their son <strong>Oliver</strong> into this world. <strong>Shane</strong> loved his family with his whole heart, they were his everything.</p>
<p>Lets keep his memory alive so little <strong>Oliver</strong> can know he had a <strong>phenomenal</strong> daddy.</p>
<p class="red">We love you <strong>Shane</strong>!</p>
<p>Gone but <strong>never</strong> <em>forgotten</em>.</p>
<a class="btn btn-dark btn-block btn-lg btn-support" href="https://www.gofundme.com/f/the-life-of-shane-levac-for-kylie-and-oliver?utm_source=facebook&utm_medium=social&utm_campaign=m_pd+share-sheet&fbclid=IwAR2_tgHSTyutgKzBWOMYErwAczm4nqXRaquqWn4D4N1B5tIqfZ4qfMzGZ38" role="button">Support the ones he left behind</a>
</div>
<section class="media container-fluid">
<div class="row row-cols-1 row-cols-md-2 text-dark">
<div class="col-md-6 mt-4">
<div class="card h-100">
<div class="card-body">
<h2 class="card-title"><i class="fa fa-lg fa-picture-o pr-3" aria-hidden="true"></i> Photos</h2>
<p class="card-text">Come see the memories others have posted on Facebook and share your own photos.</p>
<a href="https://www.facebook.com/groups/355670385501456/photos/" class="btn btn-dark btn-block">Photos - View and share</a>
</div>
</div>
</div>
<div class="col-md-6 mt-4">
<div class="card h-100">
<div class="card-body">
<h2 class="card-title"><i class="fa fa-video-camera fa-lg pr-3" aria-hidden="true"></i> Videos</h2>
<p class="card-text">Come see the memories others have posted on Facebook and share your own videos.</p>
<a href="https://www.facebook.com/groups/355670385501456/videos/" class="btn btn-dark btn-block">Videos - View and share</a>
</div>
</div>
</div>
<div class="col-md-6 mt-4">
<div class="card h-100">
<div class="card-body">
<h2 class="card-title"><i class="fa fa-book fa-lg pr-3" aria-hidden="true"></i> Stories</h2>
<p class="card-text">Come read the memories people have posted on Facebook and share your own.</p>
<a href="https://www.facebook.com/groups/355670385501456/" class="btn btn-dark btn-block">Stories - View and share</a>
</div>
</div>
</div>
<div class="col-md-6 mt-4">
<div class="card h-100">
<div class="card-body">
<h2 class="card-title"><i class="fa fa-soundcloud fa-lg pr-3" aria-hidden="true"></i> SoundCloud</h2>
<p class="card-text">Listen to the music he posted on his SoundCloud page.</p>
<a href="https://soundcloud.com/shane-levac/" class="btn btn-dark btn-block">Music - Listen on SoundCloud</a>
</div>
</div>
</div>
</div>
</section>
<section class="container-fluid" id="music">
<h2>Music</h2>
<div class="col-sm-12 text-center">
<h3>Video</h3>
<p>Special thanks to <a href="https://www.youtube.com/channel/UCcZSSnpLRI-TOnh4K2g0Igw">Mikey and his UKE</a> and <a href="https://www.instagram.com/legsleger/">Ryan "Legs" Léger</a> for creating this video and dedicating to Shaner!</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/jBbfibRXKDM" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="mt-4 bg-info py-4" id="bands">
<section class="text-center">
<h3>Bands Shane has played in!</h3>
<div class="container-fluid text-nowrap">
<ul class="mt-4 row row-cols-3 text-dark list-unstyled">
<li class="col border border-dark bg-light">30 Second Summerville</li>
<li class="col border border-dark bg-light">The Armstrongs</li>
<li class="col border border-dark bg-light">Bark Bro</li>
<li class="col border border-dark bg-light">Division 104</li>
<li class="col border border-dark bg-light">The Everlongs</li>
<li class="col border border-dark bg-light">Freeway</li>
<li class="col border border-dark bg-light">Human Carnival</li>
<li class="col border border-dark bg-light">Last Word Spoken</li>
<li class="col border border-dark bg-light">Mauz</li>
<li class="col border border-dark bg-light">No Apologies</li>
<li class="col border border-dark bg-light">Proposition 9</li>
<li class="col border border-dark bg-light">Red Flag</li>
<li class="col border border-dark bg-light">Richmond</li>
<li class="col border border-dark bg-light">Second Shot</li>
<li class="col border border-dark bg-light">Simulated Bakon</li>
<li class="col border border-dark bg-light">Smokehouse</li>
<li class="col border border-dark bg-light">Struggle</li>
<li class="col border border-dark bg-light">Trench Town Oddities</li>
<li class="col border border-dark bg-light">La Maison Jam Night</li>
</ul>
</div>
</section>
<section class="text-center">
<h3>Bands Shane loved!</h3>
<div class="container-fluid text-nowrap">
<ul class="mt-4 row row-cols-3 text-dark list-unstyled">
<li class="col border border-dark bg-light">AFI</li>
<li class="col border border-dark bg-light">Age of Electric</li>
<li class="col border border-dark bg-light">Another Joe</li>
<li class="col border border-dark bg-light">Beastie Boys</li>
<li class="col border border-dark bg-light">Belvedere</li>
<li class="col border border-dark bg-light">Beyond the Void </li>
<li class="col border border-dark bg-light">Bigwig</li>
<li class="col border border-dark bg-light">Blink 182</li>
<li class="col border border-dark bg-light">Cauterize</li>
<li class="col border border-dark bg-light">City and Color</li>
<li class="col border border-dark bg-light">CKY</li>
<li class="col border border-dark bg-light">Dave Hause</li>
<li class="col border border-dark bg-light">Descendents</li>
<li class="col border border-dark bg-light">DFL</li>
<li class="col border border-dark bg-light">Electric Six</li>
<li class="col border border-dark bg-light">Face to Face</li>
<li class="col border border-dark bg-light">FNEH</li>
<li class="col border border-dark bg-light">Foo Fighters</li>
<li class="col border border-dark bg-light">Gob</li>
<li class="col border border-dark bg-light">Good Riddance</li>
<li class="col border border-dark bg-light">Green Day</li>
<li class="col border border-dark bg-light">Grimskunk</li>
<li class="col border border-dark bg-light">Grungebot</li>
<li class="col border border-dark bg-light">House of Pain</li>
<li class="col border border-dark bg-light">Kid Dynamite</li>
<li class="col border border-dark bg-light">Lagwagon</li>
<li class="col border border-dark bg-light">Limblifter</li>
<li class="col border border-dark bg-light">Limp</li>
<li class="col border border-dark bg-light">Lions Leading Sheep</li>
<li class="col border border-dark bg-light">Loved Ones</li>
<li class="col border border-dark bg-light">Me First and the Gimme Gimmes</li>
<li class="col border border-dark bg-light">Minor Threat</li>
<li class="col border border-dark bg-light">Moneen</li>
<li class="col border border-dark bg-light">Muse</li>
<li class="col border border-dark bg-light">Nirvana</li>
<li class="col border border-dark bg-light">No Use for a Name</li>
<li class="col border border-dark bg-light">NOFX</li>
<li class="col border border-dark bg-light">Noise Ratchet </li>
<li class="col border border-dark bg-light">None More Black</li>
<li class="col border border-dark bg-light">Nufan</li>
<li class="col border border-dark bg-light">Pennywise</li>
<li class="col border border-dark bg-light">Propagandi</li>
<li class="col border border-dark bg-light">Raised Fist</li>
<li class="col border border-dark bg-light">Rancid</li>
<li class="col border border-dark bg-light">Rise Against</li>
<li class="col border border-dark bg-light">Rusty</li>
<li class="col border border-dark bg-light">Samiam</li>
<li class="col border border-dark bg-light">Satanic Surfers</li>
<li class="col border border-dark bg-light">Screeching Weasel</li>
<li class="col border border-dark bg-light">Seven Layers</li>
<li class="col border border-dark bg-light">Silverchair</li>
<li class="col border border-dark bg-light">Smoke or Fire</li>
<li class="col border border-dark bg-light">SNFU</li>
<li class="col border border-dark bg-light">Spinnerette</li>
<li class="col border border-dark bg-light">Strike Anywhere</li>
<li class="col border border-dark bg-light">Strung Out</li>
<li class="col border border-dark bg-light">Subb</li>
<li class="col border border-dark bg-light">Sublime</li>
<li class="col border border-dark bg-light">The MovieLife</li>
<li class="col border border-dark bg-light">The Offspring</li>
<li class="col border border-dark bg-light">Thrice</li>
<li class="col border border-dark bg-light">Trigger Happy</li>
</ul>
</div>
</section>
</div>
</section>
<section class="follow social container-fluid">
<h2 class="text-center my-4">Checkout Shane's social media</h2>
<div class="row">
<a class="col-sm text-center" target="_blank" href="https://www.facebook.com/shane.levac/">
<div>
<i class="fa fa-5x fa-facebook-official" aria-hidden="true"></i>
<span class="d-block">Facebook</span>
</div>
</a>
<a class="col-sm text-center" target="_blank" href="https://www.instagram.com/knotapunk/">
<div>
<i class="fa fa-5x fa-soundcloud" aria-hidden="true"></i>
<span class="d-block">SoundCloud</span>
</div>
</a>
<a class="col-sm text-center" target="_blank" href="https://www.instagram.com/knotapunk/">
<div>
<i class="fa fa-5x fa-instagram" aria-hidden="true"></i>
<span class="d-block">Instagram</span>
</div>
</a>
</div>
</section>
<section class="playlist social container-fluid">
<h2 class="text-center my-4">Playlist</h2>
<div class="row">
<a class="col-sm text-center" target="_blank" href="https://music.amazon.ca/user-playlists/a5d237b1222e4b87999588989635df45c2a0?ref=dm_sh_89gZaam7HyfTplefptvsZCXFi">
<div>
<i class="fa fa-5x fa-apple" aria-hidden="true"></i>
<span class="d-block">Apple Music</span>
</div>
</a>
<a class="col-sm text-center" target="_blank" href="https://music.amazon.ca/user-playlists/a5d237b1222e4b87999588989635df45c2a0?ref=dm_sh_89gZaam7HyfTplefptvsZCXFi">
<div>
<i class="fa fa-5x fa-amazon" aria-hidden="true"></i>
<span class="d-block">Amazon</span>
</div>
</a>
<a class="col-sm text-center" target="_blank" href="https://open.spotify.com/playlist/16jJX0vI2sbJdDu1SNrmWB?si=gXgkj3h9RN2AVy57hBbUfg">
<div>
<i class="fa fa-5x fa-spotify" aria-hidden="true"></i>
<span class="d-block">Spotify</span>
</div>
</a>
</div>
</section>
</main>
<footer>
<div class="container-fluid">
<div class="row">
<div class="col-sm-8">
<p>Created in collaboration with all the Shane Levac fans out there! ©2020</p>
</div>
<div class="col-sm-4 text-right">
<p><a target="_blank" href="https://github.com//shawnthompson/shanelevac.com"><i class="fa fa-2x fa-github" aria-hidden="true"></i>Fork me on Github</a></p>
</div>
</div>
</div>
</footer>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<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.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>