-
Notifications
You must be signed in to change notification settings - Fork 14
/
coming-soon.html
131 lines (108 loc) · 8.01 KB
/
coming-soon.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="TRU CS Club Website">
<meta name="keywords" content="TRU, Computer Science, CS Club, CS, Kamloops, Thompson Rivers University">
<title>TRU CS Club - Coming Soon</title>
<link rel="stylesheet" href="css/main.css">
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico?">
</head>
<body class="font-body m-0 p-0 bg-background h-[100vh]">
<!-- Navbar -->
<nav class="bg-background relative container mx-auto p-5">
<!-- Flex Container -->
<div class="flex items-center lg:justify-evenly justify-end">
<!-- Logo -->
<div class="w-32 hidden">
<a href="#">
<img src="assets/logo.svg" alt="logo">
</a>
</div>
<!-- Menu Items -->
<div class="md:text-text text-2xl hidden lg:flex space-x-16 py-1 px-6 ali items-center">
<a href="#" class=""><img src="assets/logo.svg" alt="logo"></a>
<a href="index.html#hero-section" class="px-8 py-2 hover:text-accent">Get Involved</a>
<a href="index.html#events-section" class="px-8 py-2 hover:text-accent">Events</a>
<a href="index.html#board-section" class="px-8 py-2 hover:text-accent">Board Meeting</a>
<a href="#" class="px-8 py-2 hover:text-accent">Resources</a>
<a href="index.html#merch-section" class="px-8 py-2 hover:text-accent">Merch</a>
</div>
<!-- Hamburger Icon -->
<button id="menu-btn" class="block hamburger lg:hidden focus:outline-none">
<span class="hamburger-top"></span>
<span class="hamburger-middle"></span>
<span class="hamburger-bottom"></span>
</button>
</div>
<!-- Mobile Menu -->
<div class="lg:hidden">
<div id="menu"
class="absolute flex-col items-center hidden self-end py-8 space-y-6 font-bold bg-white-glass sm:w-auto sm:self-center left-6 right-6 drop-shadow-md">
<a href="index.html#hero-section" class="hover:text-accent">Get Involved</a>
<a href="index.html#events-section" class="hover:text-accent">Events</a>
<a href="index.html#board-section" class="hover:text-accent">Board Meeting</a>
<a href="#" class="hover:text-accent">Resources</a>
<a href="index.html#merch-section" class="hover:text-accent">Merch</a>
</div>
</div>
</nav>
<!-- Hero Section -->
<section id="hero-section" class="flex flex-col items-center gap-8">
<!-- Logo -->
<a href="#">
<img src="assets/logo.svg" alt="logo" class="w-48">
</a>
<!-- Title -->
<div>
<h1 class="text-text text-center font-bold lg:text-4xl text-2xl">Thompson Rivers University's<br>Computer
Science Club</h1><br><br>
<h1 class="text-text font-extrabold text-center lg:text-4xl text-2xl">COMING SOON!</h1>
</div>
<!-- Background Circles Animation -->
<ul class="circles">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<!-- Socials -->
<div class="flex gap-12">
<a href="https://discord.gg/UEGuccvBRy" target="_blank">
<!-- https://icons.getbootstrap.com/icons/discord/ -->
<svg xmlns="http://www.w3.org/2000/svg" class="w-10 h-10 hover:fill-secondary" fill="#b25fb9"
viewBox="0 0 16 16">
<path
d="M13.545 2.907a13.227 13.227 0 0 0-3.257-1.011.05.05 0 0 0-.052.025c-.141.25-.297.577-.406.833a12.19 12.19 0 0 0-3.658 0 8.258 8.258 0 0 0-.412-.833.051.051 0 0 0-.052-.025c-1.125.194-2.22.534-3.257 1.011a.041.041 0 0 0-.021.018C.356 6.024-.213 9.047.066 12.032c.001.014.01.028.021.037a13.276 13.276 0 0 0 3.995 2.02.05.05 0 0 0 .056-.019c.308-.42.582-.863.818-1.329a.05.05 0 0 0-.01-.059.051.051 0 0 0-.018-.011 8.875 8.875 0 0 1-1.248-.595.05.05 0 0 1-.02-.066.051.051 0 0 1 .015-.019c.084-.063.168-.129.248-.195a.05.05 0 0 1 .051-.007c2.619 1.196 5.454 1.196 8.041 0a.052.052 0 0 1 .053.007c.08.066.164.132.248.195a.051.051 0 0 1-.004.085 8.254 8.254 0 0 1-1.249.594.05.05 0 0 0-.03.03.052.052 0 0 0 .003.041c.24.465.515.909.817 1.329a.05.05 0 0 0 .056.019 13.235 13.235 0 0 0 4.001-2.02.049.049 0 0 0 .021-.037c.334-3.451-.559-6.449-2.366-9.106a.034.034 0 0 0-.02-.019Zm-8.198 7.307c-.789 0-1.438-.724-1.438-1.612 0-.889.637-1.613 1.438-1.613.807 0 1.45.73 1.438 1.613 0 .888-.637 1.612-1.438 1.612Zm5.316 0c-.788 0-1.438-.724-1.438-1.612 0-.889.637-1.613 1.438-1.613.807 0 1.451.73 1.438 1.613 0 .888-.631 1.612-1.438 1.612Z" />
</svg>
</a>
<a href="https://www.instagram.com/trucsclub/" target="_blank">
<!-- https://icons.getbootstrap.com/icons/instagram/ -->
<svg xmlns="http://www.w3.org/2000/svg" class="w-10 h-10 hover:fill-secondary" fill="#b25fb9"
viewBox="0 0 16 16">
<path
d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088 3.269.222 2.76.42a3.917 3.917 0 0 0-1.417.923A3.927 3.927 0 0 0 .42 2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01 2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923 1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99 5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.916 3.916 0 0 0 1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.99 10.445 16 10.173 16 8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.926 3.926 0 0 0-.923-1.417A3.911 3.911 0 0 0 13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998 0h.003zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166 1.486.275.373.145.64.319.92.599.28.28.453.546.598.92.11.281.24.705.275 1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166 1.203-.275 1.485a2.47 2.47 0 0 1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.276a2.478 2.478 0 0 1-.92-.598 2.48 2.48 0 0 1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233 0-2.136.008-2.388.046-3.231.036-.78.166-1.204.276-1.486.145-.373.319-.64.599-.92.28-.28.546-.453.92-.598.282-.11.705-.24 1.485-.276.738-.034 1.024-.044 2.515-.045v.002zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92zm-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0 0-8.217zm0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334z" />
</svg>
</a>
<a href="https://www.facebook.com/profile.php?id=61551258991234&ref=xav_ig_profile_web" target="_blank">
<!-- https://icons.getbootstrap.com/icons/facebook/ -->
<svg xmlns="http://www.w3.org/2000/svg" fill="#b25fb9" class="w-10 h-10 hover:fill-secondary"
viewBox="0 0 16 16">
<path
d="M16 8.049c0-4.446-3.582-8.05-8-8.05C3.58 0-.002 3.603-.002 8.05c0 4.017 2.926 7.347 6.75 7.951v-5.625h-2.03V8.05H6.75V6.275c0-2.017 1.195-3.131 3.022-3.131.876 0 1.791.157 1.791.157v1.98h-1.009c-.993 0-1.303.621-1.303 1.258v1.51h2.218l-.354 2.326H9.25V16c3.824-.604 6.75-3.934 6.75-7.951z" />
</svg>
</a>
</div>
</section>
<!-- Hamburger Script -->
<script src="assets/hamburger.js"></script>
</body>
<!-- Footer -->
</html>