87 lines
1.2 KiB
SCSS
87 lines
1.2 KiB
SCSS
/* Animations blob pour le fond */
|
|
@keyframes blob {
|
|
0%,
|
|
100% {
|
|
transform: translate(0, 0) scale(1);
|
|
}
|
|
25% {
|
|
transform: translate(20px, -50px) scale(1.1);
|
|
}
|
|
50% {
|
|
transform: translate(-20px, 20px) scale(0.9);
|
|
}
|
|
75% {
|
|
transform: translate(50px, 50px) scale(1.05);
|
|
}
|
|
}
|
|
|
|
@keyframes fadeIn {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(20px);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
@keyframes slideUp {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(30px);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
@keyframes spinSlow {
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
.animate-blob {
|
|
animation: blob 7s infinite;
|
|
}
|
|
|
|
.animate-fade-in {
|
|
animation: fadeIn 0.6s ease-out;
|
|
}
|
|
|
|
.animate-slide-up {
|
|
animation: slideUp 0.6s ease-out;
|
|
}
|
|
|
|
.animate-spin-slow {
|
|
animation: spinSlow 3s linear infinite;
|
|
}
|
|
|
|
.animation-delay-100 {
|
|
animation-delay: 0.1s;
|
|
opacity: 0;
|
|
animation-fill-mode: forwards;
|
|
}
|
|
|
|
.animation-delay-200 {
|
|
animation-delay: 0.2s;
|
|
opacity: 0;
|
|
animation-fill-mode: forwards;
|
|
}
|
|
|
|
.animation-delay-300 {
|
|
animation-delay: 0.3s;
|
|
opacity: 0;
|
|
animation-fill-mode: forwards;
|
|
}
|
|
|
|
.animation-delay-2000 {
|
|
animation-delay: 2s;
|
|
}
|
|
|
|
.animation-delay-4000 {
|
|
animation-delay: 4s;
|
|
}
|