From dc5ccbb11801c997fd91b427341e4ea79f95b084 Mon Sep 17 00:00:00 2001
From: hongjli <3117313295@qq.com>
Date: 星期一, 07 四月 2025 13:46:10 +0800
Subject: [PATCH] 主页面优化
---
src/app/globals.css | 77 +++++++++++++++++++++-----------------
1 files changed, 42 insertions(+), 35 deletions(-)
diff --git a/src/app/globals.css b/src/app/globals.css
index c2ec329..25d60dc 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -55,6 +55,20 @@
animation-delay: 0.5s;
}
+/* 椤甸潰鍐呭娣″叆鍔ㄧ敾 */
+@keyframes fadeIn {
+ from {
+ opacity: 0;
+ }
+ to {
+ opacity: 1;
+ }
+}
+
+.animate-fadeIn {
+ animation: fadeIn 0.6s ease-out;
+}
+
/* Logo鍦嗙幆鑴夊啿鍔ㄧ敾 */
@keyframes logo-ring-pulse {
0% {
@@ -236,36 +250,29 @@
/* AI鏁版嵁娴佹晥鏋滃姩鐢� */
@keyframes dataflowY {
- 0% {
- background-position: 0 -200px;
+ from {
+ transform: translateY(-100%);
}
- 100% {
- background-position: 0 200px;
+ to {
+ transform: translateY(100%);
}
}
@keyframes dataflowX {
- 0% {
+ from {
transform: translateX(-100%);
- opacity: 0;
}
- 50% {
- opacity: 1;
- }
- 100% {
+ to {
transform: translateX(100%);
- opacity: 0;
}
}
.animate-dataflowY {
- background-image: linear-gradient(to bottom, transparent 0%, rgba(106, 219, 255, 0.4) 50%, transparent 100%);
- background-size: 100% 200px;
- animation: dataflowY 8s linear infinite;
+ animation: dataflowY 3s linear infinite;
}
.animate-dataflowX {
- animation: dataflowX 4s infinite;
+ animation: dataflowX 5s linear infinite;
}
/* 鎸夐挳鍊炬枩鍔ㄧ敾 */
@@ -296,7 +303,7 @@
}
.animate-scanline {
- animation: scanline 8s linear infinite;
+ animation: scanline 3s ease-in-out infinite;
}
/* 鍩虹娓愬彉鍔ㄧ敾 */
@@ -439,11 +446,11 @@
}
@keyframes dataflowY {
- 0% {
- background-position: 0 -200px;
+ from {
+ transform: translateY(-100%);
}
- 100% {
- background-position: 0 200px;
+ to {
+ transform: translateY(100%);
}
}
@@ -483,7 +490,7 @@
}
.animate-data-blink {
- animation: data-blink 3s ease-in-out infinite;
+ animation: data-blink 2s ease-in-out infinite;
}
.animate-data-blink-slow {
@@ -491,27 +498,16 @@
}
.animate-dataflowY {
- background-image: linear-gradient(to bottom, transparent 0%, rgba(106, 219, 255, 0.4) 50%, transparent 100%);
- background-size: 100% 200px;
- animation: dataflowY 8s linear infinite;
+ animation: dataflowY 3s linear infinite;
}
.animate-scanline {
- animation: scanline 8s linear infinite;
+ animation: scanline 3s ease-in-out infinite;
}
.animate-fade-in {
- animation: fadeIn 1.5s ease-in-out forwards;
+ animation: fade-in 1.5s ease-out forwards;
animation-delay: 0.5s;
-}
-
-@keyframes fadeIn {
- from {
- opacity: 0;
- }
- to {
- opacity: 1;
- }
}
/* 鎮仠鏁堟灉澧炲己 */
@@ -736,3 +732,14 @@
.quantum-button:hover .quantum-pulse {
animation: quantum-pulse 2s ease-in-out infinite;
}
+
+/* 涓婚〉闂厜鎸夐挳鏁堟灉 */
+@keyframes shine {
+ 100% {
+ left: 125%;
+ }
+}
+
+.animate-shine {
+ animation: shine 1.5s ease-in-out;
+}
--
Gitblit v1.9.3