web/src/shared/components/Sparkle.module.css
.hmWrapper {
position: absolute;
display: block;
}
@media (prefers-reduced-motion: no-preference) {
.hmWrapper {
animation: hmComeInOut 700ms forwards;
}
}
@keyframes hmComeInOut {
0% {
transform: scale(0);
}
50% {
transform: scale(1);
}
100% {
transform: scale(0);
}
}
.hmSparkle {
display: block;
}
@media (prefers-reduced-motion: no-preference) {
.hmSparkle {
animation: hmSpin 1000ms linear;
}
}
@keyframes hmSpin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(180deg);
}
}