-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
148 lines (147 loc) · 4.57 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
<!doctype html>
<html>
<head>
<!-- Import PureCSS -->
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.5.0/pure-min.css">
<!-- End PureCSS -->
<title>OpenSpace</title>
<link rel="stylesheet" href="./index.css">
<script src="raf/raf.js"></script>
<script src="debounce/debounce.js"></script>
<script>
function resize() {
var height = window.innerHeight
var logo = document.getElementById('logo')
var emptySpace = height - logo.clientHeight
console.log(logo.style)
margin = emptySpace/2
logo.style.marginTop = margin+"px"
logo.style.marginBottom = margin+"px"
}
window.addEventListener('resize',resize)
</script>
</head>
<body onload="resize()">
<div id="navbar" class="pure-g navbar">
<div class="pure-u">
<div class="logo"><img src="logo.png"></div>
<div class="links">
<a href="#about">About</a>
<a href="#members">Members</a>
<a href="#sponsors">Sponsors</a>
<a href="#join">Join</a>
</div>
</div>
</div>
<div style="width:100%">
<div id="logo" class="title">
<div class="titleCenter">
<div class="titlep1">Open</div>
</div>
<div class="logo">
<img src="./logo.png">
</div>
<div class="titleCenter">
<div class="titlep2">Space</div>
</div>
</div>
</div>
<div class="pure-g">
<div class="pure-u-1-6">
</div>
<div class="pure-u-2-3 content"><div class="column">
<div id="about">
<img src="learn.png">
<h1>The Hackerspace for Southern Illinois</h1>
<p>
OpenSpace's mission is to help you. We want to see you grow, both in technical talent and as a person.
</p>
<h1>The Space</h1>
<p>
Our doors are open for hacking 24/7!<br>
<a href="#">Click Here for Directions</a>
</p>
<h1>The Hardware</h1>
<p>
We have worked tirlessly to bring you the best SI has to offer.
<ul>
<li>Full Computer Lab</li>
<li>3D Printers</li>
<li>Soldering Kits</li>
</ul>
</p>
</div>
<div id="members">
<h1>The Members</h1>
<div class="member">
<div class="pure-g">
<div class="pure-u-1-3">
<img src="./listen.jpg">
</div>
<div class="pure-u-2-3">
<div class="memberInfo">
<h3>William Blankenship</h3>
<h5>Birthday: Feb. 17th</h5>
<h5>Website: <a href="wblankenship.com">wblankenship.com</a></h5>
</div>
</div>
</div>
</div>
<div class="member">
<div class="pure-g">
<div class="pure-u-1-3">
<img src="./listen.jpg">
</div>
<div class="pure-u-2-3">
<div class="memberInfo">
<h3>William Blankenship</h3>
<h5>Birthday: Feb. 17th</h5>
<h5>Website: <a href="wblankenship.com">wblankenship.com</a></h5>
</div>
</div>
</div>
</div>
<div class="member">
<div class="pure-g">
<div class="pure-u-1-3">
<img src="./listen.jpg">
</div>
<div class="pure-u-2-3">
<div class="memberInfo">
<h3>William Blankenship</h3>
<h5>Birthday: Feb. 17th</h5>
<h5>Website: <a href="wblankenship.com">wblankenship.com</a></h5>
</div>
</div>
</div>
</div>
<div class="member">
<div class="pure-g">
<div class="pure-u-1-3">
<img src="./listen.jpg">
</div>
<div class="pure-u-2-3">
<div class="memberInfo">
<h3>William Blankenship</h3>
<h5>Birthday: Feb. 17th</h5>
<h5>Website: <a href="wblankenship.com">wblankenship.com</a></h5>
</div>
</div>
</div>
</div>
</div>
<div id="sponsors">
<h1>The Sponsors</h1>
</div>
<div id="join">
<h1>Join</h1>
<p>
Join our community!
</p>
</div>
</div>
</div>
<div class="footer">
</div>
</body>
</html>