Skip to content
Snippets Groups Projects
Commit 87cf0cd3 authored by Gergely Szabó's avatar Gergely Szabó
Browse files

Add 2022 index

parent 81e44efe
Branches
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
src/2021-bg.svg → archive/2021-bg.svg
+ 0
− 0
View file @ 87cf0cd3
File moved
archive/index_end2022.html 0 → 100644
+ 43
− 0
View file @ 87cf0cd3
<!doctype html>
<html lang="hu">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
<title>BME VIK Gólyahét</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@100;300;700&display=swap" rel="stylesheet">
<style>
* { border: 0; padding: 0; margin: 0; box-sizing: border-box; }
body { width: 100%; background-color: #000; color: #FFF; font-family: 'Roboto Mono', monospace;
text-shadow: 0 4px 3px rgba(0, 0, 0, 0.4), 0 8px 13px rgba(0, 0, 0, 0.1), 0 18px 23px rgba(0, 0, 0, 0.1);
-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
h1 { font-weight: bold; text-align: center; font-size: 6vmin; margin: 10vh 3vw 0 3vw; }
h2 { font-weight: 300; text-align: center; font-size: 18px; margin: 0 3vw 4vh 3vw; }
.background { background-image: url("/2021-bg.svg"); filter: blur(3px) opacity(0.8); -webkit-filter: blur(3px) opacity(0.8); height: 100vh;
width: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; position: fixed; }
.content { position: fixed; top: 0; left: 0; height: 100vh; width: 100%; z-index: 2; }
iframe { margin: 40px auto; max-width: 100vw; }
a { display: inline-block; text-decoration: none; border-bottom: 2px solid #FFF; color: #FFF; }
</style>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-YTTKMXXM14"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-YTTKMXXM14');
</script>
</head>
<body>
<div class="background"></div>
<div class="content">
<h1>BME VIK GÓLYAHÉT</h1>
<h2>Köszönjük, hogy velünk voltatok!</h2>
<iframe src="https://drive.google.com/file/d/1HP-38F9jKcBBuexxuOMPQiZ9Y5FcaS7T/preview" width="100%" height="60%" allow="autoplay"></iframe>
</div>
</body>
</html>
src/bg.jpg 0 → 100644
+ 0
− 0
View file @ 87cf0cd3
src/bg.jpg

875 KiB

src/index.html
+ 48
− 9
View file @ 87cf0cd3
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
<title>BME VIK Gólyahét</title> <title>BME VIK Gólyahét 2022</title>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@100;300;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@100;300;700&display=swap" rel="stylesheet">
...@@ -13,13 +13,15 @@ ...@@ -13,13 +13,15 @@
body { width: 100%; background-color: #000; color: #FFF; font-family: 'Roboto Mono', monospace; body { width: 100%; background-color: #000; color: #FFF; font-family: 'Roboto Mono', monospace;
text-shadow: 0 4px 3px rgba(0, 0, 0, 0.4), 0 8px 13px rgba(0, 0, 0, 0.1), 0 18px 23px rgba(0, 0, 0, 0.1); text-shadow: 0 4px 3px rgba(0, 0, 0, 0.4), 0 8px 13px rgba(0, 0, 0, 0.1), 0 18px 23px rgba(0, 0, 0, 0.1);
-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
h1 { font-weight: bold; text-align: center; font-size: 6vmin; margin: 10vh 3vw 0 3vw; } h1 { font-weight: bold; text-align: center; font-size: 12vmin; margin: 10vh 3vw 0 3vw; }
h2 { font-weight: 300; text-align: center; font-size: 18px; margin: 0 3vw 4vh 3vw; } h2 { font-weight: 300; text-align: center; font-size: 4vmin; margin: 10vh 3vw 4vh 3vw; }
.background { background-image: url("/2021-bg.svg"); filter: blur(3px) opacity(0.8); -webkit-filter: blur(3px) opacity(0.8); height: 100vh; .background { background-image: url("bg.jpg"); filter: blur(10px) opacity(0.8); -webkit-filter: blur(10px) opacity(0.8); height: 100vh;
width: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; position: fixed; } width: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; position: fixed; }
.content { position: fixed; top: 0; left: 0; height: 100vh; width: 100%; z-index: 2; } .content { position: fixed; top: 0; left: 0; height: 100vh; width: 100%; z-index: 2; }
iframe { margin: 40px auto; max-width: 100vw; } .latch { display: flex;justify-content: space-between;padding: 0 10vw; }
a { display: inline-block; text-decoration: none; border-bottom: 2px solid #FFF; color: #FFF; } .digit { text-align: center; }
.digit h3 { font-size: 14vmin; font-weight: 100; }
.digit span { font-size: 6vmin; font-weight: bold; }
</style> </style>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-YTTKMXXM14"></script> <script async src="https://www.googletagmanager.com/gtag/js?id=G-YTTKMXXM14"></script>
<script> <script>
...@@ -34,10 +36,47 @@ ...@@ -34,10 +36,47 @@
<div class="background"></div> <div class="background"></div>
<div class="content"> <div class="content">
<h1>BME VIK GÓLYAHÉT</h1> <h1>BME VIK GÓLYAHÉT 2022</h1>
<h2>Köszönjük, hogy velünk voltatok!</h2> <h2>a programok kezdetéig még hátra van</h2>
<iframe src="https://drive.google.com/file/d/1HP-38F9jKcBBuexxuOMPQiZ9Y5FcaS7T/preview" width="100%" height="60%" allow="autoplay"></iframe> <div class="latch">
<div class="digit">
<h3 id="days">00</h3>
<span>nap</span>
</div> </div>
<div class="digit">
<h3 id="hours">00</h3>
<span>óra</span>
</div>
<div class="digit">
<h3 id="mins">00</h3>
<span>perc</span>
</div>
<div class="digit">
<h3 id="secs">00</h3>
<span>mp</span>
</div>
</div>
</div>
<script>
const countDownDate = new Date("Aug 29, 2022 09:00:00").getTime();
function zeroFill(value) {
return value < 10 ? ("0" + value) : value;
}
function updateTimer() {
const now = new Date().getTime();
const distance = countDownDate - now;
document.getElementById("days").innerText = zeroFill(Math.floor(distance / (1000 * 60 * 60 * 24)));
document.getElementById("hours").innerText = zeroFill(Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)));
document.getElementById("mins").innerText = zeroFill(Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)));
document.getElementById("secs").innerText = zeroFill(Math.floor((distance % (1000 * 60)) / 1000));
}
updateTimer();
setInterval(updateTimer, 1000);
</script>
</body> </body>
</html> </html>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment

Hosted with :heart: by KSZK