changed indentaion
This commit is contained in:
parent
d0bc2222a0
commit
ea082c7fd8
GPG key ID:
F6F4C66207FCF995
2 changed files with 116 additions and 114 deletions
|
|
@ -1,108 +1,110 @@
|
|||
@font-face{
|
||||
font-family:brandon light;
|
||||
src:url(../font.woff2)
|
||||
font-family:brandon light;
|
||||
src:url(../font.woff2)
|
||||
}
|
||||
*{
|
||||
margin:0;
|
||||
padding:0;
|
||||
position:relative;
|
||||
box-sizing:border-box;
|
||||
overflow:hidden
|
||||
margin:0;
|
||||
padding:0;
|
||||
position:relative;
|
||||
box-sizing:border-box;
|
||||
overflow:hidden
|
||||
}
|
||||
|
||||
html,body{
|
||||
height:100%
|
||||
height:100%
|
||||
}
|
||||
|
||||
body{
|
||||
display:flex;
|
||||
justify-content:center;
|
||||
align-items:center;
|
||||
background:#000
|
||||
display:flex;
|
||||
justify-content:center;
|
||||
align-items:center;
|
||||
background:#000
|
||||
}
|
||||
|
||||
#bg-video {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
object-fit: cover;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
filter: brightness(75%);
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
object-fit: cover;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
filter: brightness(75%);
|
||||
}
|
||||
|
||||
#home {
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
mix-blend-mode: overlay;
|
||||
filter: invert(100%);
|
||||
position: absolute;
|
||||
& h1 {
|
||||
font-size:5.25vmin;
|
||||
}
|
||||
& h2 {
|
||||
font-size:2vmin;
|
||||
}
|
||||
& .social {
|
||||
margin-top:.5vmin;
|
||||
font-family:brandon light;
|
||||
font-size:4.25vmin;
|
||||
letter-spacing:.3vmin;
|
||||
& a {
|
||||
text-decoration:none;
|
||||
color:#000;
|
||||
}
|
||||
}
|
||||
#nav-as, #nav-home {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#nav-as, #nav-home {
|
||||
cursor: pointer;
|
||||
#home {
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
mix-blend-mode: overlay;
|
||||
filter: invert(100%);
|
||||
position: absolute;
|
||||
& h1 {
|
||||
font-size:5.25vmin;
|
||||
}
|
||||
& h2 {
|
||||
font-size:2vmin;
|
||||
}
|
||||
& .social {
|
||||
margin-top:.5vmin;
|
||||
font-family:brandon light;
|
||||
font-size:4.25vmin;
|
||||
letter-spacing:.3vmin;
|
||||
& a {
|
||||
text-decoration:none;
|
||||
color:#000;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
font-family: Calibri, monospace;
|
||||
text-shadow: 0.06vw 0.06vw 0px rgba(8,230,255,100), -0.06vw -0.06vw 0px rgba(255,0,0,100);
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
color: #FFFFFF;
|
||||
text-decoration: none;
|
||||
font-size: 1.39vmin;
|
||||
font-weight: bold;
|
||||
font-family: Calibri, monospace;
|
||||
text-shadow: 0.06vw 0.06vw 0px rgba(8,230,255,100), -0.06vw -0.06vw 0px rgba(255,0,0,100);
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
color: #FFFFFF;
|
||||
text-decoration: none;
|
||||
font-size: 1.39vmin;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.container {
|
||||
text-align: left;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
& pre {
|
||||
display: inline-block;
|
||||
& a {
|
||||
color: #ffffff;
|
||||
}
|
||||
text-align: left;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
& pre {
|
||||
display: inline-block;
|
||||
& a {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hint {
|
||||
z-index:1;
|
||||
color:#000;
|
||||
mix-blend-mode:overlay;
|
||||
filter:invert(100%);
|
||||
position:fixed;
|
||||
bottom:6vmin;
|
||||
font-family:brandon light;
|
||||
font-size:2.75vmin;
|
||||
letter-spacing:.2vmin;
|
||||
font-weight:700;
|
||||
cursor:pointer;
|
||||
z-index:1;
|
||||
color:#000;
|
||||
mix-blend-mode:overlay;
|
||||
filter:invert(100%);
|
||||
position:fixed;
|
||||
bottom:6vmin;
|
||||
font-family:brandon light;
|
||||
font-size:2.75vmin;
|
||||
letter-spacing:.2vmin;
|
||||
font-weight:700;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,48 +1,48 @@
|
|||
//'use strict';
|
||||
(function() {
|
||||
var title = document.title,
|
||||
animSeq = ["/", "$", "\\", "|", "$"],
|
||||
animIndex = 0,
|
||||
titleIndex = 0;
|
||||
var title = document.title,
|
||||
animSeq = ["/", "$", "\\", "|", "$"],
|
||||
animIndex = 0,
|
||||
titleIndex = 0;
|
||||
|
||||
function doInverseSpinZeroPitch() {
|
||||
var loadTitle = title.substring(0, titleIndex);
|
||||
if (titleIndex > title.length) {
|
||||
animIndex = 0;
|
||||
titleIndex = 0
|
||||
}
|
||||
if (animIndex > 3) {
|
||||
titleIndex++;
|
||||
animIndex = 0
|
||||
}
|
||||
document.title = loadTitle + animSeq[animIndex];
|
||||
animIndex++
|
||||
function doInverseSpinZeroPitch() {
|
||||
var loadTitle = title.substring(0, titleIndex);
|
||||
if (titleIndex > title.length) {
|
||||
animIndex = 0;
|
||||
titleIndex = 0
|
||||
}
|
||||
window.setInterval(doInverseSpinZeroPitch, 50);
|
||||
if (animIndex > 3) {
|
||||
titleIndex++;
|
||||
animIndex = 0
|
||||
}
|
||||
document.title = loadTitle + animSeq[animIndex];
|
||||
animIndex++
|
||||
}
|
||||
window.setInterval(doInverseSpinZeroPitch, 50);
|
||||
})();
|
||||
|
||||
const qS = q => document.querySelector(q);
|
||||
let initialized = false;
|
||||
document.getElementById("hint").addEventListener('click', _ => {
|
||||
if (!initialized) {
|
||||
qS('video').muted = false;
|
||||
qS('.hint').style.display = 'none';
|
||||
initialized = true;
|
||||
}
|
||||
if (!initialized) {
|
||||
qS('video').muted = false;
|
||||
qS('.hint').style.display = 'none';
|
||||
initialized = true;
|
||||
}
|
||||
});
|
||||
|
||||
const sites = ['as', 'home'];
|
||||
sites.forEach((item) => {
|
||||
document.getElementById(`nav-${item}`).addEventListener('click', _ => {
|
||||
nav(`${item}`);
|
||||
});
|
||||
document.getElementById(`nav-${item}`).addEventListener('click', _ => {
|
||||
nav(`${item}`);
|
||||
});
|
||||
});
|
||||
|
||||
function nav(site) {
|
||||
const bg = [...sites];
|
||||
bg.splice(sites.indexOf(site), 1);
|
||||
bg.forEach((item) => {
|
||||
document.getElementById(item).style.display = 'none';
|
||||
});
|
||||
document.getElementById(site).style.display = '';
|
||||
const bg = [...sites];
|
||||
bg.splice(sites.indexOf(site), 1);
|
||||
bg.forEach((item) => {
|
||||
document.getElementById(item).style.display = 'none';
|
||||
});
|
||||
document.getElementById(site).style.display = '';
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue