-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
217 lines (179 loc) · 11.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
<!----------------------- HEADER ----------------------->
<!DOCTYPE html>
<html lang="en" prefix="oh: http://ogp.me/ns#">
<head>
<meta charset="utf-8" />
<title>thetahacks2021</title>
<link rel="icon" href="" />
<!-- meta -->
<meta name="description"content="thetahacks2021 is a high school hackathon for developers of all skill levels."/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="author" content="ThetaHacks" />
<!-- OpenGraph Meta -->
<meta property="og:title"content="thetahacks2021 | Bringing the world of tech to prospective engineers"/>
<meta property="og:site_name" content="ThetaHacks" />
<meta property="og:type" content="website" />
<meta property="og:description"content="thetahacks2021 is a high school hackathon with swag and awards for high-school hackers of all ages and skill levels across the globe!"/>
<meta property="og:image"content=""/>
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="627" />
<meta property="og:locale" content="en_US" />
<meta property="twitter:site" content="thetahacks2021" />
<meta property="twitter:text:title"content="thetahacks2021 is a high school hackathon with swag and awards for high-school hackers of all ages and skill levels across the globe!"/>
<meta property="twitter:image"content=""/>
<meta property="twitter:card" content="summary_large_image" />
<meta property="og:url" content="https://thetahacks.tech/" />
<!----------- CSS ----------->
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="stylesheet" href="assets/fonts/montserrat.css" />
<!----------- END CSS ----------->
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
</head>
<!----------------------- END HEADER ----------------------->
<body>
<div id="top"></div>
<!----------------------- NAVBAR ----------------------->
<div class="navbar-side">
<div class="center addcursor" onclick="goto('home');scrollToTop();">
<div class="center addcursor" style="width: 60px;" onclick="goto('home');scrollToTop();">
<a class="addcursor" style="min-width: 60px;">
<img class="main-logo" src="assets/img/logo/logo_clear.png" style="width: 60px;margin-top: 40px;margin-bottom: 20px;">
</a>
</div>
</div>
<div class="nav-element" onclick="goto('home');scrollToTop();">Home</div>
<div class="nav-element" onclick="goto('schedule');scrollToTop();">Schedule</div>
<div class="nav-element" onclick="goto('prizes');scrollToTop();">Prizes</div>
<div class="nav-element" onclick="goto('sponsors');scrollToTop();">Sponsors</div>
<div class="nav-element" onclick="goto('people');scrollToTop();">Volunteers</div>
<div class="nav-element" onclick="goto('info');scrollToTop();">More Info</div>
<div class="nav-element" onclick="window.open('https://thetahacks.tech', '_blank');">2020 Site</div>
</div>
<div class="navbar-top">
<div id="navbar-logo" onclick="goto('home');scrollToTop();" class="addcursor" style="min-width: 22px;">
<a onclick="goto('home');scrollToTop();">
<img class="main-logo" src="assets/img/logo/logo_clear.png" style="width: 22px;" id="mainlogo">
</a>
</div>
<div class="nav-element-2-title" onclick="goto('home');scrollToTop();" class="addcursor"><a>thetahacks2021</a></div>
<div class="hamburger hamburger--spin js-hamburger">
<div class="hamburger-box">
<div class="hamburger-inner"></div>
</div>
</div>
<div class="dropdown_menu">
<a class="dropdown_link" onclick="goto('home');scrollToTop();">Home</a>
<a class="dropdown_link" onclick="goto('schedule');scrollToTop();">Schedule</a>
<a class="dropdown_link" onclick="goto('prizes');scrollToTop();">Prizes</a>
<a class="dropdown_link" onclick="goto('sponsors');scrollToTop();">Sponsors</a>
<a class="dropdown_link" onclick="goto('people');scrollToTop();">People</a>
<a class="dropdown_link" onclick="goto('info');scrollToTop();">More Info</a>
<a class="dropdown_link" href="https://thetahacks.tech" target="_blank">2020 Site</a>
</div>
</div>
<!----------------------- END NAVBAR ----------------------->
<!----------------------- HOME PAGE ----------------------->
<div id="home">
<div class="background-img" id="test"></div>
<div class="home-div">
<div class="home-div-2">
<h1 class="title animate__animated animate__flipInX">thetahacks2021</h1>
<h1 class="title-alt animate__animated animate__flipInX">thetahacks 2021</h1>
<h1 class="subtitle animate__animated animate__fadeInDown">thetahacks2021 is coming soon.</h1>
<h1 class="subtitle animate__animated animate__fadeInDown">join the <a href="https://thetahacks.tech/discord" target="_blank" class="underline">discord</a> and sign up for
<a href="https://form.typeform.com/to/PhePnrTa?typeform-medium=embed-snippet" target="_blank" class="underline">emails</a> to recieve updates!</h1>
</div>
</div>
<div class="home-div-other">
<h1 class="description"> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nulla at volutpat diam ut venenatis tellus in metus vulputate. Mauris pharetra et ultrices neque ornare aenean euismod elementum. In hac habitasse platea dictumst quisque. Nibh tellus molestie nunc non blandit massa enim nec dui. Turpis in eu mi bibendum neque egestas congue quisque. Dictum varius duis at consectetur lorem donec massa sapien. Eget sit amet tellus cras adipiscing enim eu turpis egestas. Sed vulputate mi sit amet. Adipiscing vitae proin sagittis nisl rhoncus mattis rhoncus urna. A pellentesque sit amet porttitor eget dolor. Eros donec ac odio tempor orci dapibus ultrices in. Fames ac turpis egestas maecenas.
Nisl pretium fusce id velit ut tortor pretium viverra. Eleifend quam adipiscing vitae proin sagittis nisl rhoncus. Malesuada nunc vel risus commodo viverra maecenas accumsan lacus vel. Morbi tristique senectus et netus et malesuada fames ac. Senectus et netus et malesuada fames ac turpis egestas. Augue interdum velit euismod in. Augue mauris augue neque gravida in. Vitae et leo duis ut diam. Tempor nec feugiat nisl pretium fusce id velit. Ut consequat semper viverra nam. Non tellus orci ac auctor. Elementum integer enim neque volutpat ac tincidunt. Neque aliquam vestibulum morbi blandit.</h1>
</div>
</div>
<!----------------------- END HOME PAGE ----------------------->
<!----------------------- SCHEDULE PAGE ----------------------->
<div id="schedule" class="page">
<h1 class="animate__animated animate__flipInX" style="color: white;text-align: center; margin: 0vh 0 0vh 0; padding-top: 15vh;font-size:3.5rem;">Schedule</h1>
<div class="col-2">
<div class="col-2-child animate__animated animate__fadeInLeft" style="flex-grow: 1;">
<canvas id="canvas" width="475" height="475">
</canvas>
<div id="hand"></div>
<style>
#hand {
position: relative;
background-color: white;
width: 5px;
height: 150px;
display: block;
margin: auto;
transition: transform 0.5s ease-out;
transform-origin: bottom center;
transform: translateY(-387px);
}
</style>
<script>
function time(degrees) {
console.log("translateY(-387px) rotate(" + degrees + ")");
document.getElementById("hand").style.transform = "translateY(-387px) rotate(" + degrees + "deg)";
}
</script>
</div>
<div class="col-2-child animate__animated animate__fadeInRight" style="flex-grow: 2;">
<table class="schedule" rules="none" cellspacing="0" cellpadding="0">
<colgroup>
<col span="1" style="width: 30%;">
<col span="1" style="width: 70%;">
</colgroup>
<thead>
<th>Time</th>
<th>Event</th>
</thead>
<tr class="table-row" onclick="time(30)">
<td>1:00 am</td>
<td>Placeholder workshop or speaker event</td>
</tr>
<tr class="table-row" onclick="time(90)">
<td>3:00 am</td>
<td>Placeholder workshop or speaker event</td>
</tr>
<tr class="table-row" onclick="time(150)">
<td>5:00 am</td>
<td>Placeholder workshop or speaker event</td>
</tr>
<tr class="table-row" onclick="time(390)">
<td>1:00 pm</td>
<td>Placeholder workshop or speaker event</td>
</tr>
<tr class="table-row" onclick="time(450)">
<td>3:00 pm</td>
<td>Placeholder workshop or speaker event</td>
</tr>
<tr class="table-row" onclick="time(510)">
<td>5:00 pm</td>
<td>Placeholder workshop or speaker event</td>
</tr>
</table>
</div>
</div>
</div>
<!----------------------- END SCHEDULE PAGE ----------------------->
<!----------------------- PRIZES PAGE ----------------------->
<div id="prizes" class="page">
</div>
<!----------------------- END PRIZES PAGE ----------------------->
<!----------------------- SPONSORS PAGE ----------------------->
<div id="sponsors" class="page">
</div>
<!----------------------- END SPONSORS PAGE ----------------------->
<!----------------------- PEOPLE PAGE ----------------------->
<div id="people" class="page">
</div>
<!----------------------- END PEOPLE PAGE ----------------------->
<!----------------------- INFO PAGE ----------------------->
<div id="info" class="page">
</div>
<!----------------------- END INFO PAGE ----------------------->
<!----------------------- SCRIPTS ----------------------->
<script src="assets/js/main.js"></script>
<!----------------------- END SCRIPTS ----------------------->
</body>