76 lines
1002 B
CSS
76 lines
1002 B
CSS
@keyframes fade-in {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
@keyframes fade-out {
|
|
0% {
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
@keyframes slide-in {
|
|
0% {
|
|
transform: translateY(-80%);
|
|
}
|
|
100% {
|
|
transform: translateY(0%);
|
|
}
|
|
}
|
|
@keyframes slide-in-bottom {
|
|
0% {
|
|
transform: translateY(40%);
|
|
}
|
|
100% {
|
|
transform: translateY(0%);
|
|
}
|
|
}
|
|
@keyframes slide-out {
|
|
0% {
|
|
transform: translateY(0%);
|
|
}
|
|
100% {
|
|
transform: translateY(-10%);
|
|
}
|
|
}
|
|
|
|
@keyframes height-in {
|
|
0% {
|
|
max-height: 0px;
|
|
}
|
|
100% {
|
|
max-height: 800px;
|
|
}
|
|
}
|
|
@keyframes height-out {
|
|
0% {
|
|
max-height: 800px;
|
|
}
|
|
100% {
|
|
max-height: 0px;
|
|
}
|
|
}
|
|
|
|
@keyframes translate-in {
|
|
0% {
|
|
transform: translateY(60%);
|
|
}
|
|
100% {
|
|
transform: translateY(100%);
|
|
}
|
|
}
|
|
@keyframes translate-out {
|
|
0% {
|
|
transform: translateY(100%);
|
|
}
|
|
100% {
|
|
transform: translateY(60%);
|
|
}
|
|
}
|