rit.wtf/public/css/anim.css

116 lines
2 KiB
CSS
Raw Normal View History

2025-02-07 20:35:47 +00:00
/* used for background */
@keyframes diag {
from {
background-position: 0 0;
}
to {
background-position: 10% 10%;
}
}
/* used for title */
@keyframes bounce {
0%,
100% {
transform:translateY(-25%);
animation-timing-function:cubic-bezier(.8,0,1,1)
}
50% {
transform:none;
animation-timing-function:cubic-bezier(0,0,.2,1)
}
}
/* used in footer videos */
@keyframes flip {
0%, 100% {
transform: rotateY(0deg) rotateX(0deg);
}
50% {
transform: rotateY(3000deg) rotateX(3000deg);
}
}
/* used in ie button */
@keyframes strobe {
0%, 100% {
background-color: rgba(255,0,0,.4);
}
20% {
background-color: rgba(255,255,0,.4);
}
40% {
background-color: rgba(0,255,0,.4);
}
60% {
background-color: rgba(0,255,255,.4);
}
80% {
background-color: rgba(0,0,255,.4);
}
}
/* LITHIUM ION BATTERIES!!! */
@keyframes cube {
from {
transform: translateX(-50%) rotateY(var(--rot)) translateZ(calc(var(--width)/2));
}
to {
transform: translateX(-50%) rotateY(calc(var(--rot) + 90deg)) translateZ(calc(var(--width)/2));
}
}
/* used in motd */
@keyframes flash {
50% {
opacity: 0;
}
}
@keyframes colorflash {
0%, 100%, 49% {
border: 5px solid orange;
background-color: black;
color: orange;
}
50%, 99% {
border: 5px solid black;
background-color: orange;
color: black;
}
}
@keyframes border {
0%,
100% {
border: 2px solid rgb(255, 0, 0);
}
33% {
border: 2px solid rgb(0, 255, 0);
}
66% {
border: 2px solid rgb(0, 0, 255);
}
}
@keyframes across {
0%,
100% {
transform: translateX(0%);
}
50% {
transform: translateX(calc(80vw - 100%));
}
}
@keyframes scale {
from {
transform: scale3d(100%, 100%, 100%);
}
to {
transform: scale3d(120%, 120%, 120%);
}
}