forked from jmoss20/MadHacksWeb
-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
475 lines (455 loc) · 24.1 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
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
<!DOCTYPE html>
<html>
<head>
<title>MadHacks Mini | Spring 2018</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src='https://api.mapbox.com/mapbox-gl-js/v0.42.0/mapbox-gl.js'></script>
<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
<link href="https://fonts.googleapis.com/css?family=Waiting+for+the+Sunrise" rel="stylesheet" type="text/css" />
<link href='https://api.mapbox.com/mapbox-gl-js/v0.42.0/mapbox-gl.css' rel='stylesheet' />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="bulma.css">
<link rel="stylesheet" type="text/css" href="styles.css">
<link href="https://fonts.googleapis.com/css?family=Play" rel="stylesheet">
<link rel="shortcut icon" href="images/favicon.png">
<a id="mlh-trust-badge" style="display:block;max-width:100px;min-width:60px;position:fixed;right:50px;top:0;width:10%;z-index:10000"
href="https://mlh.io/seasons/na-2018/events?utm_source=na-2018&utm_medium=TrustBadge&utm_campaign=na-2018&utm_content=red"
target="_blank">
<div class = "mlhLogo"><img src="https://s3.amazonaws.com/logged-assets/trust-badge/2018/red.svg" alt="Major League Hacking 2017 Hackathon Season"
style="width:100%"></div>
</a>
</head>
<body>
<div id="loadOverlay" style="background-color:#333; position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:2000;"></div>
<div class="wrapper">
<!--Header-->
<div class="head has-text-centered">
<div id="headerAnim" class="headerAnim"></div>
<noscript>
<div style="height: 100%; width: 100%; background-color: #000; top: 0; position: absolute; display: block;"></div>
</noscript>
<div class="headerOverlay">
<a class="register-button" href="https://madhacks-mini.devpost.com/submissions">Projects Gallery</a>
</div>
<div class="iconOverlay">
<a href="https://www.facebook.com/MadHacksUW/"><i class="fab fa-facebook-square fa-lg"></i></a>
<a href="https://twitter.com/MadHacksUW"><i class="fab fa-twitter-square fa-lg" ></i></a>
</div>
<div class="headerTopLeft">
<a href="http://www.madhacks.io"><img src="./images/madhackMini.png" /></a>
<h4>CS 1240 @ University of Wisconsin, Madison</h4>
<h4>8:30 am - 10:00 pm, April 7th 2018</h4>
</div>
</div>
<!-- Navigation Bar -->
<div class="navbar" id="myNavbar">
<a href="#about" onclick="myFunction()">About</a>
<a href="#faq" onclick="myFunction()">F.A.Q</a>
<a href="#schedule" onclick="myFunction()">Schedule</a>
<a href="#ws" onclick="myFunction()">Workshops</a>
<a href="#sponsors" onclick="myFunction()">Sponsors</a>
<a href="#team" onclick="myFunction()">Team</a>
<a href="https://madhacks-2018.typeform.com/to/NI8CP7" onclick="myFunction()">Contact</a>
<a href="https://goo.gl/forms/gvPRICDzVvDV9O142" onclick="myFunction()">Volunteer</a>
<a href="javascript:void(0);" class="icon" onclick="myFunction()">☰</a>
</div>
<!-- About -->
<div class="about columns" id="about">
<div class="column about-blurb">
<h2>ABOUT MADHACKS</h2>
<h4>
<strong>MadHacks</strong> is the University of Wisconsin's twice-annual hackathon, bringing together participants
from all over the US for 24 hours of hacking. Unlike other hackathons, MadHacks is going to be putting
emphasis on the wacky, the original, and the downright impossible!</h4>
</div>
<div class="column about-blurb-2">
<h2> </h2>
<h4> This spring, we will be having a 12 hours, beginner-friendly mini-hackathon that give new hackers a glimpse
into what hackathons are like. Although it is a shorter hackathon, we will still be having mentors, workshops
and prizes!</h4>
</div>
<div class="column twitter">
<a class="twitter-timeline" data-width="450" data-height="300" data-theme="dark" data-link-color="#1b95e0" data-chrome="nofooter"
href="https://twitter.com/MadHacksUW?ref_src=twsrc%5Etfw">Tweets by MadHacksUW</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>
</div>
<!-- FAQ -->
<div class="faq" id="faq">
<h2>FREQUENTLY ASKED QUESTIONS</h2>
<div class="columns is-multiline">
<div class="column is-one-third faq-item top-line">
<h4>What’s a hackathon?</h4>
<p> Hackathon is an event where students gather together to work on a software or hardware project. MadHacks
Spring 2018 will be a 12 hours hackathon. If this is your first time attending, check out our hackathon
veteran Spencer’s medium post on
<a href="https://medium.com/@spencerfricke/how-to-do-hackathons-4a96207d5d3d">How to Do Hackathons.</a>
</p>
</div>
<div class="column is-one-third faq-item">
<h4>Do I need a team?</h4>
<p>We encourage students to work with a team of 2 - 4 people but you can work individually as well. If you
don't have a team yet, there will be a team formation after the opening ceremony. If you want to
find a team before the event, join the #team-formation slack channel.</p>
</div>
<div class="column is-one-third faq-item">
<h4>Who can participate?</h4>
<p>We welcome all Madison area undergraduate and graduate students of all backgrounds. You don’t need to
be a Computer Science or Engineering major to attend. If you don't know how to code, we will have
workshops throughout the day to teach you how to code!</p>
</div>
<div class="column is-one-third faq-item">
<h4>What do I need to bring?</h4>
<p>You need to bring a photo ID to check in. You should also bring a laptop, chargers, and anything else
you will need for a 12 hours hackathon.</p>
</div>
<div class="column is-one-third faq-item">
<h4>How much does it cost to attend?</h4>
<p>Admission to MadHacks is completely free. We will also be providing breakfast, lunch and dinner! There
will also be workshops and activities throughout the event.</p>
</div>
<div class="column is-one-third faq-item">
<h4>What else do I need to know? </h4>
<p>Please review the
<a href="https://static.mlh.io/docs/mlh-code-of-conduct.pdf">MLH Code of Conduct</a>. Please also be aware that by attending this event, you agree to the MLH
Data Sharing Notice:
<a href="https://github.com/MLH/mlh-policies/tree/master/prize-terms-and-conditions">MLH Contest Terms and Conditions</a>
and the
<a href="https://mlh.io/privacy">MLH Privacy Policy</a>
</p>
</div>
<div class="column is-one-third faq-item">
<h4>Where and When? </h4>
<p>MadHacks Mini will be on April 7th from 9:00 am to 10:30 pm at Computer Science Room 1240. Check-in
will start at 8:30 am. If you want to volunteer on the day of the event, please fill out
<a href="https://docs.google.com/forms/d/e/1FAIpQLSdKQfzy-b_TVmTXZOd1FKAl9baBXUzd_J6Gpc8AtbGZ8iODGw/viewform">this form.</a>
</p>
</div>
<div class="column is-one-third faq-item">
<h4>Will there be any prizes?</h4>
<p>Yes! Stay tuned for more details about the prizes. </p>
</div>
<div class="column is-one-third faq-item">
<h4>Still have questions?</h4>
<p>You can
<a href="https://madhacks-2018.typeform.com/to/NI8CP7">contact us </a>if you still have any questions. </p>
</div>
</div>
</div>
<!-- Schedule -->
<div class="schedule" id="schedule">
<div class="columns">
<div class="column">
<h2>SCHEDULE</h2>
<ul>
<li>
<span class="time">08:30am:</span> Check in begins</li>
<li>
<span class="time">09:00am:</span> Opening Ceremony </li>
<li>
<span class="time">09:30am:</span> Hacking Begins and Team Formation</li>
<li>
<span class="time">01:00pm:</span> Lunch </li>
<li>
<span class="time">06:00pm:</span> Dinner </li>
<li>
<span class="time">07:30pm:</span> Submission Open</li>
<li>
<span class="time">08:30pm:</span> Hacking Ends</li>
<li>
<span class="time">09:00pm:</span> Judging begins</li>
<li>
<span class="time">10:00pm:</span> Closing ceremony</li>
</ul>
</div>
<div class="column schedule-image">
<!-- <img src="images/mh_noborder.png" alt="madhacks logo"/> -->
<img src="images/workshop.jpg" alt="workshops" />
</div>
</div>
</div>
<!-- Workshops -->
<div class="workshops" id="ws">
<h2>
<strong>ACTIVITIES</strong>
</h2>
<div class="workshop-contents">
<div class="columns is-multiline">
<div class="column is-half workshops-top-line workshops-blurb workshops-top">
<h3> 1. Workshop: Backend Web Development using Node.js</h3>
<h4>
<strong>Speaker:</strong> Spencer Fricke </h4>
<h4>
<strong>Time:</strong> 10:00am </h4>
<h4>
<strong>Location:</strong> Room 1257</h4>
</div>
<div class="column is-half workshops-blurb workshops-top">
<h3> 2. Workshop: Web Dev Intro from MLH</h3>
<h4>
<strong>Speaker:</strong> Jake Hamel </h4>
<h4>
<strong>Time:</strong> 10:30am </h4>
<h4>
<strong>Location:</strong> Room 1257</h4>
</br>
</div>
</div>
<div class="columns is-multiline">
<div class="column is-half workshops-blurb">
<h3> 3. Tech Talk: Edge Computing Technology </h3>
<h4>
<strong>Speaker:</strong> Suman Bannerjee</h4>
<h4>
<strong>Time:</strong> 2:00pm </h4>
<h4>
<strong>Location:</strong> Room 1221</h4>
</div>
<div class="column is-half workshops-blurb">
<h3> 4. Competition: !Light (No Light) Web Dev Contest </h3>
<h4>
<strong>Coordinator:</strong> Jake Hamel</h4>
<h4>
<strong>Time:</strong> 3:00pm </h4>
<h4>
<strong>Location:</strong> Room 1257</h4>
</br>
</div>
</div>
<div class="columns is-multiline">
<div class="column is-half workshops-blurb">
<h3> 5. Tech Talk: Early History of Unix, Linux,BSD </h3>
<h4>
<strong>Speaker:</strong> Corey Halpin </h4>
<h4>
<strong>Time:</strong> 3:30pm </h4>
<h4>
<strong>Location:</strong>Room 1221</h4>
</div>
<div class="column is-half workshops-blurb">
<h3> 6. Game: Remote Control Ball Race</h3>
<h4>
<strong>Coordinator:</strong> Monica Ma </h4>
<h4>
<strong>Time:</strong> 3:30pm </h4>
<h4>
<strong>Location:</strong> Hallway</h4>
</br>
</div>
</div>
<div class="columns is-multiline">
<div class="column is-half workshops-blurb">
<h3> 7. Tech Talk: Debugging and Good Coding </h3>
<h4>
<strong>Speaker:</strong> Perry Kivolowitz</h4>
<h4>
<strong>Time:</strong> 4:00pm </h4>
<h4>
<strong>Location:</strong> Room 1221</h4>
</div>
<div class="column is-half workshops-blurb">
<h3> 8. Tech Talk: A "Hello, World!" Intro to Blockchain </h3>
<h4>
<strong>Speaker:</strong> Sid Ramesh, Advisor to Badger Blockchain </h4>
<h4>
<strong>Time:</strong> 5:00pm </h4>
<h4>
<strong>Location:</strong> Room 1257</h4>
</div>
</div>
</div>
</div>
<!-- Map -->
<div id='map'></div>
<script>
mapboxgl.accessToken = 'pk.eyJ1IjoiY29ubm9yc3RhbXBlciIsImEiOiJjamFpeDM1bXMyMXdrMnFsZTh0dmJmanVxIn0.v2IUgOKPxfRDTlAhaswe0w';
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/connorstamper/cjaixzmwnacd72ro7a1zdxmmh',
center: [-89.40, 43.07],
zoom: 13,
});
var geojson = {
type: 'FeatureCollection',
features: [{
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [-89.406318, 43.071309]
},
properties: {
title: 'MadHacks',
description: '1210 W Dayton St, Madison, WI 53706'
}
}]
};
// add markers to map
geojson.features.forEach(function (marker) {
// create a HTML element for each feature
var el = document.createElement('div');
el.className = 'marker';
// make a marker for each feature and add to the map
new mapboxgl.Marker(el)
.setLngLat(marker.geometry.coordinates)
.setPopup(new mapboxgl.Popup({ offset: 25 }) // add popups
.setHTML('<h3>' + marker.properties.title + '</h3><p>' + marker.properties.description + '</p>'))
.addTo(map);
});
// disable map zoom when using scroll
map.scrollZoom.disable();
//controls
map.addControl(new mapboxgl.NavigationControl());
</script>
<!-- Sponsors -->
<div class="sponsors" id="sponsors">
<!-- <div class="column"></div> -->
<h4 class="is-one-third column sponsor-header">Sponsors</h4>
<div class="columns is-multiline">
<div class="column">
<a href="https://careers.google.com/"><img src="images/google.png"></a>
</div>
<div class="column">
<a href="https://careers.mlh.io/"><img src="images/mlh-logo.png"></a>
</div>
</div>
<h3>Interested in sponsoring MadHacks? </h3>
<h3>
<a href="./sponsor.pdf">Check this out</a>
</h3>
</div>
<!-- The Team -->
<div class="team" id="team">
<h2>The Team</h2>
<div class="columns">
<div class="column">
<a href="https://www.linkedin.com/in/ian-mark/"><img src="team/ian.jpg"/>
<p><span class="name"><strong>Ian Mark </strong></span></br> Madhacks Director</p></a>
</div>
<div class="column">
<a href="http://jeichenhofer.com/"><img src="team/joe.jpeg"/>
<p><span class="name"><strong>Joe Eichenhofer</strong></span></br>MadHacks Assistant Director</p></a>
</div>
<div class="column">
<a href="https://www.linkedin.com/in/jakehamel"><img src="team/jake.jpg"/>
<p><span class="name"><strong>Jake Hamel</strong></span></br> Support Coordinator</p></a>
</div>
<div class="column">
<a href="https://www.linkedin.com/in/andrew-nguyen-87a82987?trk=hp-identity-name"><img src="team/andrew.jpg"/>
<p><span class="name"><strong>Andrew Nguyen</strong></span></br>Web-dev Coordinator</p></a>
</div>
<div class="column">
<a href="https://www.linkedin.com/in/jeremy-koritzinsky-b9595a99/"><img src="team/jeremy.png"/>
<p><span class="name"><strong>Jeremy Koritzinsky</strong></span></br>Sponsorship Coordinator</p></a>
</div>
<div class="column">
<a href="https://www.linkedin.com/in/hjennye/"><img src="team/jenny.jpg"/>
<p><span class="name"><strong>Haengjung Ye</strong></span></br>Mentorship Coordinator</p></a>
</div>
<div class="column">
<a href="https://www.linkedin.com/in/nathaniel-krakauer-4a202211a/"><img src="team/nathaniel.jpg"/>
<p><span class="name"><strong>Nathaniel Krakauer</strong></span></br>PR Coordinator</p></a>
</div>
<div class="column">
<a href="https://www.linkedin.com/in/daniel-m-701184b3/"><img src="team/danny.jpg"/>
<p><span class="name"><strong>Danny Miller</strong></span></br>Sponsorship</p></a>
</div>
</div>
<div class="columns">
<div class="column">
<a href="https://www.linkedin.com/in/karmnagi/"><img src="team/karm.jpg"/>
<p><span class="name"><strong>Karm Nagi</strong></span></br>Sponsorship</p></a>
</div>
<div class="column">
<a href="https://www.linkedin.com/in/aiden-hao-song/"><img src="team/aiden.jpg"/>
<p><span class="name"><strong>Aiden Song</strong></span></br>Web Developer</p></a>
</div>
<div class="column">
<a href="http://johnmoss.us/"><img src="team/john.jpg"/>
<p><span class="name"><strong>John Moss</strong></span></br>Web Developer</p></a>
</div>
<div class="column">
<a href="https://www.linkedin.com/in/connor-stamper-0168a3109/"><img src="team/connor.jpg"/>
<p><span class="name"><strong>Connor Stamper</strong></span></br>Web Developer</p></a>
</div>
<div class="column">
<a href="https://www.linkedin.com/in/quinn-siebers-2515a964/"><img src="team/quinn.jpg"/>
<p><span class="name"><strong>Quinn Siebers</strong></span></br>Graphic Design</p></a>
</div>
<div class="column">
<img src="team/monica.jpg"/>
<p><span class="name"><strong>Monica Ma</strong></span></br>Activities</p>
</div>
<div class="column">
<a href="https://www.linkedin.com/in/yash-shah-bb8b29127"><img src="team/shah.png"/>
<p><span class="name"><strong>Yash Shah</strong></span></br>Travel</p></a>
</div>
<div class="column">
<a href="https://www.linkedin.com/in/udhbhav-gupta/"><img src="team/ud.jpg"/>
<p><span class="name"><strong>UD Gupta</strong></span></br>Treasurer</p></a>
</div>
</div>
<div class="columns">
<div class="column"></div>
<div class="column"></div>
<div class="column">
<img src="team/p.png"/>
<p><span class="name"><strong>Matthew Parker</strong></span></br>Admission Coordinator</p>
</div>
<div class="column">
<img src="team/y.png"/>
<p><span class="name"><strong>Benjamin Yin</strong></span></br>Admission</p>
</div>
<div class="column">
<img src="team/h.png"/>
<p><span class="name"><strong>Muhamad Firdaus Husaini</strong></span></br>Volunteer Coordinator</p>
</div>
<div class="column">
<img src="team/y.png"/>
<p><span class="name"><strong>Aniket Dalvi</strong></span></br>Food</p>
</div>
<div class="column"></div>
<div class="column"></div>
</div>
</div>
<!--Footer-->
<!-- <div class="footer columns has-text-centered" id="contact">
<div class="column is-one-third" style="text-align: left;">
<a onclick="topFunction()" class="topLink">Back to the Top</a>
</div>
<div class="column is-one-third" style="text-align: center">
<a href="https://twitter.com/MadHacksUW">
<img src="images/twitter.png" style="height: 25px">
</a>
<a href="https://www.facebook.com/MadHacksUW/">
<img src="images/facebook1.png" style="height: 25px">
</a>
</div>
<div class="column is-one-third" style="text-align: right">
<a onclick="topFunction()">© 2018 MadHacks</a>
</div>
</div> -->
</div>
</div>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/three.js/88/three.min.js"></script>
<script type="text/javascript" src="js/OrbitControls.js"></script>
<script type="text/javascript" src="js/header_anim.js"></script>
<script>
//this function is used to scroll back to the top
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
//function used for the side menu bar
function myFunction() {
var x = document.getElementById("myNavbar");
if (x.className === "navbar") {
x.className += " responsive";
}
else {
x.className = "navbar";
}
}
</script>
</body>
</html>