site/_includes/styles/animations.css
Ruben 1f0a87b437
All checks were successful
/ build (push) Successful in 34s
split up css files again, using eleventy to combine + minify
2025-06-02 11:20:03 -05:00

60 lines
No EOL
1.5 KiB
CSS

/* ╭───────────────────────────────────────────────────────╮
/ │ _ _ _ │
/ │ __ _ _ __ (_)_ __ ___ __ _| |_(_) ___ _ __ ___ │
/ │ / _` | '_ \| | '_ ` _ \ / _` | __| |/ _ \| '_ \/ __| │
/ │ | (_| | | | | | | | | | | (_| | |_| | (_) | | | \__ \ │
/ │ \__,_|_| |_|_|_| |_| |_|\__,_|\__|_|\___/|_| |_|___/ │
/ ╰───────────────────────────────────────────────────────╯
/ animations - reusable css animations */
@keyframes window-appear {
0% {
opacity: 0;
transform: scale(0.5, 0.5);
}
100% {
opacity: 1;
transform: scale(1, 1);
}
}
@keyframes rainbow {
0% {
filter: hue-rotate(0deg) contrast(150%) saturate(150%);
}
100% {
filter: hue-rotate(360deg) contrast(150%) saturate(150%);
}
}
@keyframes bg-gradient {
0% {
background-position: 0% 27%
}
50% {
background-position: 100% 74%
}
100% {
background-position: 0% 27%
}
}
@keyframes opacity-blink {
0% { opacity: 0% }
5% { opacity: 100% }
45% { opacity: 100% }
50% { opacity: 0% }
100% { opacity: 0% }
}
@keyframes opacity-blink-reverse {
0% { opacity: 100% }
5% { opacity: 0% }
45% { opacity: 0% }
50% { opacity: 100% }
100% { opacity: 100% }
}