91 lines
1.9 KiB
HTML
91 lines
1.9 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<style>
|
||
@font-face {
|
||
font-family: "wrong font";
|
||
src: url("https://files.pad.ma/ttf/wrongfont.woff") format("woff");
|
||
}
|
||
h1 {
|
||
font-family: "wrong font";
|
||
margin: auto;
|
||
font-weight: normal;
|
||
color: yellow;
|
||
font-size: 66px;
|
||
letter-spacing: 3px;
|
||
font-weight: bold;
|
||
}
|
||
h2 {
|
||
color: #6666ff;
|
||
font-family: "wrong font";
|
||
}
|
||
#box {
|
||
width: 100%;
|
||
height: 100vh;
|
||
display: flex;
|
||
text-align: center;
|
||
}
|
||
body {
|
||
font-family: "wrong font";
|
||
overflow: hidden;
|
||
background: black;
|
||
}
|
||
|
||
#shadowBox {
|
||
background-color: rgb(0, 0, 0);
|
||
/* Fallback color */
|
||
background-color: rgba(0, 0, 0, 0.2);
|
||
/* Black w/opacity/see-through */
|
||
border: 3px solid;
|
||
margin: auto;
|
||
}
|
||
|
||
.rainbow_text_animated {
|
||
background: linear-gradient(to right, #6666ff, #0099ff , #00ff00, #ff3399, #6666ff);
|
||
-webkit-background-clip: text;
|
||
background-clip: text;
|
||
color: transparent;
|
||
animation: rainbow_animation 6s ease-in-out infinite;
|
||
background-size: 400% 100%;
|
||
}
|
||
.reflection {
|
||
transform: scaley(-1);
|
||
opacity: 0.3;
|
||
margin-top: -8px;
|
||
}
|
||
|
||
@keyframes rainbow_animation {
|
||
0%,100% {
|
||
background-position: 0 0;
|
||
}
|
||
|
||
50% {
|
||
background-position: 100% 0;
|
||
}
|
||
}
|
||
|
||
|
||
</style>
|
||
<title>phantas.ma</title>
|
||
</head>
|
||
<body>
|
||
<div id="box">
|
||
<div id="shadowBox">
|
||
<h1 class="rainbow rainbow_text_animated">phantas.ma</h1>
|
||
<h2></h2>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
document.location.href = '/'
|
||
path = document.location.pathname.slice(1)
|
||
if (path) {
|
||
document.querySelector('h1').innerHTML = 'phantas.ma/' + path
|
||
if (path == 'polis') {
|
||
setTimeout(() => {
|
||
document.querySelector('h2').innerHTML = 'Oct 30, 2021 – Mar 6, 2022'
|
||
})
|
||
}
|
||
}
|
||
</script>
|