Add theme_3d_systems/static/src/scss/animations.scss
This commit is contained in:
parent
7f0e65f64a
commit
b6137ff1d5
1 changed files with 48 additions and 0 deletions
48
theme_3d_systems/static/src/scss/animations.scss
Normal file
48
theme_3d_systems/static/src/scss/animations.scss
Normal file
|
|
@ -0,0 +1,48 @@
|
|||
// Animations & Keyframes
|
||||
@keyframes pulseGlow {
|
||||
0% {
|
||||
transform: scale(0.95);
|
||||
opacity: 0.7;
|
||||
}
|
||||
50% {
|
||||
transform: scale(1.15);
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
transform: scale(0.95);
|
||||
opacity: 0.7;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes floatElement {
|
||||
0% {
|
||||
transform: translateY(0px) rotate(0deg);
|
||||
}
|
||||
50% {
|
||||
transform: translateY(-10px) rotate(1deg);
|
||||
}
|
||||
100% {
|
||||
transform: translateY(0px) rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes dataStream {
|
||||
0% {
|
||||
stroke-dashoffset: 100;
|
||||
}
|
||||
100% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.animate-float {
|
||||
animation: floatElement 6s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*, ::before, ::after {
|
||||
animation-duration: 0.01ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
transition-duration: 0.01ms !important;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in a new issue