fix: 修复卡片载入动画重复播放的问题

CodeGeeX GLM 4.7 牛逼

.vscode/settings.json

@@ -28,5 +28,6 @@
   "[json]": {
     "editor.defaultFormatter": "vscode.json-language-features"
   },
-  "markdown.validate.enabled": false
+  "markdown.validate.enabled": false,
+  "Codegeex.RepoIndex": true
 }

src/components/PostPage.astro

@@ -21,8 +21,6 @@ const interval = 50;
                 image={entry.data.image}
                 description={entry.data.description}
                 draft={entry.data.draft}
-                class:list="onload-animation"
-                style={`animation-delay: calc(var(--content-delay) + ${delay++ * interval}ms);`}
         ></PostCard>
     ))}
 </div>

src/layouts/Layout.astro

@@ -412,6 +412,13 @@ function showBanner() {
 		return;
 	}
 
+	// 在显示Banner前，先移除所有已加载的onload-animation类，防止动画重复触发
+	const animatedElements = document.querySelectorAll('.onload-animation');
+	animatedElements.forEach(el => {
+		el.style.animation = 'none';
+		el.style.opacity = '1';
+	});
+
 	banner.classList.remove('opacity-0', 'scale-105');
 }