From 00f3a53f1ca970e4e96a7bd5d93433970231449a Mon Sep 17 00:00:00 2001
From: lyzno1 <92089059+lyzno1@users.noreply.github.com>
Date: Mon, 29 Sep 2025 13:47:48 +0800
Subject: [PATCH] fix(turbopack): fix animation issues with unnamed animations
 in CSS modules (#26408)

---
 .../chat/chat/loading-anim/style.module.css   | 20 +++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/web/app/components/base/chat/chat/loading-anim/style.module.css b/web/app/components/base/chat/chat/loading-anim/style.module.css
index b1371ec82a..d5a373df6f 100644
--- a/web/app/components/base/chat/chat/loading-anim/style.module.css
+++ b/web/app/components/base/chat/chat/loading-anim/style.module.css
@@ -1,6 +1,6 @@
 .dot-flashing {
   position: relative;
-  animation: 1s infinite linear alternate;
+  animation: dot-flashing 1s infinite linear alternate;
   animation-delay: 0.5s;
 }
 
@@ -10,7 +10,7 @@
   display: inline-block;
   position: absolute;
   top: 0;
-  animation: 1s infinite linear alternate;
+  animation: dot-flashing 1s infinite linear alternate;
 }
 
 .dot-flashing::before {
@@ -51,15 +51,21 @@
   border-radius: 50%;
   background-color: #667085;
   color: #667085;
-  animation-name: dot-flashing;
+  animation: dot-flashing 1s infinite linear alternate;
+}
+
+.text {
+  animation-delay: 0.5s;
 }
 
 .text::before {
   left: -7px;
+  animation-delay: 0s;
 }
 
 .text::after {
   left: 7px;
+  animation-delay: 1s;
 }
 
 .avatar,
@@ -70,13 +76,19 @@
   border-radius: 50%;
   background-color: #155EEF;
   color: #155EEF;
-  animation-name: dot-flashing-avatar;
+  animation: dot-flashing-avatar 1s infinite linear alternate;
+}
+
+.avatar {
+  animation-delay: 0.5s;
 }
 
 .avatar::before {
   left: -5px;
+  animation-delay: 0s;
 }
 
 .avatar::after {
   left: 5px;
+  animation-delay: 1s;
 }