You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

92 lines
1.3 KiB
CSS

* {
box-sizing: border-box;
}
:root {
--color: #7d50ff;
--light-color: #cec6ff;
}
html,
body {
margin: 0;
overflow: hidden;
cursor: none;
}
body {
background-color: white;
}
3 years ago
#container {
position: absolute;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
}
header {
position: relative;
z-index: 100;
3 years ago
pointer-events: none;
width: 100%;
height: 100vh;
text-align: center;
color: var(--color);
font-family: Arial, Helvetica, sans-serif;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-family: "SI17";
font-size: 64px;
line-height: 0.85;
text-transform: uppercase;
3 years ago
user-select: none;
color: var(--light-color); /* Fallback color */
-webkit-text-fill-color: white; /* Will override color (regardless of order) */
-webkit-text-stroke-width: 1.5px;
-webkit-text-stroke-color: white;
}
.date {
font-size: 24px;
}
a {
3 years ago
pointer-events: all;
color: currentColor;
}
.box {
position: absolute;
top: 0;
left: 0;
width: 20vw;
height: 20vw;
background-color: var(--color);
border-radius: 4px;
3 years ago
}
@media (hover: none) and (pointer: coarse) {
3 years ago
body {
cursor: default;
overflow: hidden;
}
.date {
font-size: 20px;
}
.box {
transition: transform 0.2s ease-out;
top: 50%;
left: 50%;
}
}