vlw.se/assets/css/pages/about.css
Victor Westerlund f551d5d889 fix: remove website version page and import (#6)
This PR removes the website version page and reference from the about page. Its pretty unreliable and doesn't really matter to the reader anyways.

Reviewed-on: https://codeberg.org/vlw/vlw.se/pulls/6
Co-authored-by: Victor Westerlund <victor.vesterlund@gmail.com>
Co-committed-by: Victor Westerlund <victor.vesterlund@gmail.com>
2024-09-27 14:53:19 +00:00

88 lines
No EOL
1.5 KiB
CSS
Executable file

/* # Overrides */
:root {
--primer-color-accent: 148, 255, 21;
--color-accent: rgb(var(--primer-color-accent));
}
vv-shell {
display: flex;
flex-direction: column;
gap: var(--padding);
}
/* # Sections */
/* ## Divider */
vv-shell > hr {
border-color: rgba(255, 255, 255, .1);
}
/* ## About */
section.about {
display: flex;
flex-direction: column;
gap: calc(var(--padding) / 2);
}
section.about p:first-of-type:first-letter {
font-size: 1.8rem;
font-weight: bold;
margin-right: .1rem;
color: var(--color-accent);
}
section.about span.interests {
-webkit-user-select: none;
user-select: none;
color: var(--color-accent);
animation: interests-hue 5s infinite linear;
}
section.about p i:not(:hover) {
opacity: .3;
}
/* # Interests */
div.interests {
--text-shadow-blur: 30px;
transition: 300ms opacity;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
font-weight: bold;
pointer-events: none;
font-size: clamp(16px, 15vw, 50px);
color: var(--color-accent);
overflow: hidden;
opacity: 0;
z-index: 200;
}
div.interests.active {
opacity: 1;
}
div.interests p {
transition: 500ms transform cubic-bezier(.34,0,0,.99);
position: absolute;
text-shadow:
0 0 var(--text-shadow-blur) black,
0 0 var(--text-shadow-blur) black,
0 0 var(--text-shadow-blur) black,
0 0 var(--text-shadow-blur) black,
0 0 var(--text-shadow-blur) black;
}
@keyframes interests-hue {
to {
-webkit-filter: hue-rotate(360deg);
filter: hue-rotate(360deg);
}
}