Skip to content

Commit eff70eb

Browse files
Copilothustcc
andcommitted
Make AVA animation more playful with bounce and brightness effects
Co-authored-by: hustcc <7856674+hustcc@users.noreply.github.com>
1 parent 87b5306 commit eff70eb

1 file changed

Lines changed: 16 additions & 5 deletions

File tree

site/src/index.css

Lines changed: 16 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,10 @@ body {
1414
background-color: #f8fbfc;
1515
}
1616

17-
/* Accessible pulse animation that respects prefers-reduced-motion */
17+
/* Playful bounce and glow animation that respects prefers-reduced-motion */
1818
.ava-pulse {
19-
animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
19+
display: inline-block;
20+
animation: playful-bounce 2s ease-in-out infinite;
2021
}
2122

2223
@media (prefers-reduced-motion: reduce) {
@@ -25,12 +26,22 @@ body {
2526
}
2627
}
2728

28-
@keyframes pulse {
29+
@keyframes playful-bounce {
2930
0%, 100% {
30-
opacity: 1;
31+
transform: scale(1) translateY(0);
32+
filter: brightness(1);
33+
}
34+
25% {
35+
transform: scale(1.1) translateY(-2px);
36+
filter: brightness(1.2);
3137
}
3238
50% {
33-
opacity: 0.7;
39+
transform: scale(1) translateY(0);
40+
filter: brightness(1);
41+
}
42+
75% {
43+
transform: scale(1.05) translateY(-1px);
44+
filter: brightness(1.1);
3445
}
3546
}
3647

0 commit comments

Comments
 (0)