igna.rocks/style.css

211 lines
3.0 KiB
CSS
Raw Normal View History

2021-09-06 22:55:25 +00:00
@font-face {
2021-09-06 23:00:00 +00:00
font-family: "Brandon Light";
src: url("font.woff2");
2021-09-06 22:55:25 +00:00
}
:root {
2021-09-06 23:00:00 +00:00
--color: red;
2021-09-06 22:55:25 +00:00
}
body {
2021-09-06 23:00:00 +00:00
margin: 0;
padding: 0;
background-color: black;
overflow: hidden;
font-family: "Brandon Light";
color: white;
user-select: none;
2021-09-06 22:55:25 +00:00
}
a {
2021-09-06 23:00:00 +00:00
color: white;
text-decoration: none;
padding: 0;
2021-09-06 22:55:25 +00:00
}
.center {
2021-09-06 23:00:00 +00:00
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
2021-09-06 22:55:25 +00:00
}
#border {
2021-09-06 23:00:00 +00:00
position: absolute;
width: 100%;
height: 100%;
box-sizing: border-box;
pointer-events: none;
z-index: -1;
2021-09-06 22:55:25 +00:00
}
2021-09-06 23:00:00 +00:00
#borderTop,
#borderBottom {
position: absolute;
width: 0%;
height: 4px;
background-color: purple;
2021-09-06 22:55:25 +00:00
}
2021-09-06 23:00:00 +00:00
#borderRight,
#borderLeft {
position: absolute;
width: 3px;
height: 0%;
background-color: purple;
2021-09-06 22:55:25 +00:00
}
video {
2021-09-06 23:00:00 +00:00
position: fixed;
right: 0;
bottom: 0;
min-width: 100%;
min-height: 100%;
z-index: -2;
filter: blur(5px) brightness(30%);
pointer-events: none;
2021-09-06 22:55:25 +00:00
}
#clickToPlay {
2021-09-06 23:00:00 +00:00
opacity: 0;
transition: 1s;
position: absolute;
color: white;
font-size: 64px;
cursor: default;
width: 100%;
height: 100%;
z-index: 10;
2021-09-06 22:55:25 +00:00
}
#main {
2021-09-06 23:00:00 +00:00
opacity: 0;
transition: 5s;
2021-09-06 22:55:25 +00:00
}
pre {
2021-09-06 23:00:00 +00:00
font-weight: bold;
font-size: 16px;
user-select: none;
color: purple;
background: repeating-linear-gradient(
120deg,
2021-09-06 23:48:13 +00:00
lightgray 0%,
gray 12.5%,
black 37.5%,
white 60%
2021-09-06 23:00:00 +00:00
);
background-size: 60vw 60vw;
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
animation: slide 5s linear infinite forwards;
2021-09-06 22:55:25 +00:00
}
@keyframes slide {
2021-09-06 23:00:00 +00:00
0% {
background-position-x: 0%;
}
100% {
background-position-x: 60vw;
}
2021-09-06 22:55:25 +00:00
}
#widgetContainer {
2021-09-06 23:00:00 +00:00
opacity: 0;
position: absolute;
right: 20px;
top: 20px;
width: 400px;
height: 38px;
background: repeating-linear-gradient(
120deg,
2021-09-06 23:48:13 +00:00
white 0%,
gray 12.5%,
black 37.5%,
gray 60%
2021-09-06 23:00:00 +00:00
);
background-size: 60vw 60vw;
animation: slide 10s linear infinite forwards;
transition: 1s;
}
#widget {
position: absolute;
width: 394px;
height: 29px;
margin: 3px;
background-color: purple;
z-index: 1;
transition: 2s;
2021-09-06 22:55:25 +00:00
}
#widgetMain {
2021-09-06 23:00:00 +00:00
position: absolute;
display: inline-flex;
justify-content: space-between;
margin-top: 3px;
padding-right: 10px;
padding-left: 10px;
width: 374px;
height: 29px;
z-index: 2;
background-color: purple;
2021-09-06 22:55:25 +00:00
}
#burgerMenu {
2021-09-06 23:00:00 +00:00
cursor: pointer;
2021-09-06 22:55:25 +00:00
}
#dropDownContent {
2021-09-06 23:00:00 +00:00
display: none;
opacity: 0;
transition: 2s;
width: 100%;
height: 100%;
position: absolute;
margin-top: 30px;
2021-09-06 22:55:25 +00:00
}
#links {
2021-09-06 23:00:00 +00:00
right: 5px;
width: 100px;
float: left;
margin-top: -4px;
2021-09-06 22:55:25 +00:00
}
#groups {
2021-09-06 23:00:00 +00:00
float: right;
margin-top: 5px;
2021-09-06 22:55:25 +00:00
}
#dropDownContent div a {
2021-09-06 23:00:00 +00:00
opacity: 0;
transition: 1s;
line-height: 18px;
2021-09-06 22:55:25 +00:00
}
#dropDownContent div span {
2021-09-06 23:00:00 +00:00
margin-left: 10px;
margin-right: 10px;
2021-09-06 22:55:25 +00:00
}
2021-09-06 23:00:00 +00:00
#groups a,
#groups span {
float: right;
2021-09-06 22:55:25 +00:00
}
.hitCount {
2021-09-06 23:00:00 +00:00
position: fixed;
bottom: 5px;
right: 5px;
transition: 3s;
color: var(--color);
font-size: 24px;
opacity: 0;
bottom: -3px;
2021-09-06 22:55:25 +00:00
}
a.hitCounter.badge-done0 {
2021-09-06 23:00:00 +00:00
display: none !important;
}