From 4e578e95c886056bf43f132bd685c2f3c363cd9f Mon Sep 17 00:00:00 2001
From: hongjli <3117313295@qq.com>
Date: 星期六, 05 四月 2025 21:52:32 +0800
Subject: [PATCH] 创建登录页面
---
src/app/globals.css | 170 +++++++++++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 154 insertions(+), 16 deletions(-)
diff --git a/src/app/globals.css b/src/app/globals.css
index fe46f64..c2ec329 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -535,66 +535,204 @@
animation: circle-pulse 4s ease-in-out infinite;
}
-/* 绾㈡涓鎶�鎰熷渾鍦堝姩鐢绘晥鏋� - 鏇存煍鍜岀殑鐗堟湰 */
+/* 鍏夋壂鎻忔晥鏋滃姩鐢� */
+@keyframes lightSweep {
+ 0% {
+ transform: translateX(-100%) skewX(-45deg);
+ opacity: 0;
+ }
+ 20% {
+ opacity: 0.3;
+ }
+ 60% {
+ opacity: 0.3;
+ }
+ 100% {
+ transform: translateX(100%) skewX(-45deg);
+ opacity: 0;
+ }
+}
+
+/* 鎶�鏈渾鍦堟晥鏋滃姩鐢� */
@keyframes tech-circle-pulse {
- 0%, 100% {
+ 0% {
opacity: 0.3;
border-color: rgba(106, 219, 255, 0.2);
}
50% {
opacity: 0.6;
- border-color: rgba(106, 219, 255, 0.5);
+ border-color: rgba(106, 219, 255, 0.3);
+ }
+ 100% {
+ opacity: 0.3;
+ border-color: rgba(106, 219, 255, 0.2);
}
}
@keyframes tech-circle-rotate {
0% {
transform: rotate(0deg);
- background-color: rgba(19, 28, 65, 0.3);
+ background: rgba(19, 28, 65, 0.3);
}
50% {
- background-color: rgba(19, 28, 65, 0.5);
+ background: rgba(30, 43, 99, 0.3);
}
100% {
transform: rotate(360deg);
- background-color: rgba(19, 28, 65, 0.3);
+ background: rgba(19, 28, 65, 0.3);
}
}
@keyframes tech-center-blink {
- 0%, 100% {
- opacity: 0.1;
+ 0% {
+ opacity: 0.2;
transform: scale(0.8);
}
50% {
opacity: 0.5;
- transform: scale(1.1);
+ transform: scale(1);
+ }
+ 100% {
+ opacity: 0.2;
+ transform: scale(0.8);
}
}
@keyframes tech-glow-pulse {
- 0%, 100% {
+ 0% {
opacity: 0.05;
- box-shadow: 0 0 3px rgba(106, 219, 255, 0.05);
+ box-shadow: 0 0 5px 0px rgba(106, 219, 255, 0.05);
}
50% {
opacity: 0.15;
- box-shadow: 0 0 8px rgba(106, 219, 255, 0.15);
+ box-shadow: 0 0 15px 5px rgba(106, 219, 255, 0.15);
+ }
+ 100% {
+ opacity: 0.05;
+ box-shadow: 0 0 5px 0px rgba(106, 219, 255, 0.05);
}
}
.animate-tech-circle-pulse {
- animation: tech-circle-pulse 8s ease-in-out infinite;
+ animation: tech-circle-pulse 8s infinite ease-in-out;
}
.animate-tech-circle-rotate {
- animation: tech-circle-rotate 30s linear infinite;
+ animation: tech-circle-rotate 30s infinite linear;
}
.animate-tech-center-blink {
- animation: tech-center-blink 5s ease-in-out infinite;
+ animation: tech-center-blink 5s infinite ease-in-out;
}
.animate-tech-glow-pulse {
- animation: tech-glow-pulse 8s ease-in-out infinite;
+ animation: tech-glow-pulse 8s infinite ease-in-out;
+}
+
+/* 楂樹寒鍒掕繃鏁堟灉 - 鐢ㄤ簬鐧诲綍椤甸潰鎸夐挳 */
+@keyframes shimmer {
+ 0% {
+ transform: translateX(-100%);
+ }
+ 100% {
+ transform: translateX(100%);
+ }
+}
+
+.animate-shimmer {
+ animation: shimmer 2s infinite;
+}
+
+/* 鐧诲綍椤甸潰鐗规畩鍔ㄧ敾 */
+@keyframes float {
+ 0%, 100% {
+ transform: translateY(0);
+ }
+ 50% {
+ transform: translateY(-10px);
+ }
+}
+
+.animate-float {
+ animation: float 6s ease-in-out infinite;
+}
+
+@keyframes tech-connect {
+ 0%, 100% {
+ opacity: 0.2;
+ transform: scaleX(0.7);
+ }
+ 50% {
+ opacity: 0.8;
+ transform: scaleX(1);
+ }
+}
+
+.animate-tech-connect {
+ animation: tech-connect 8s ease-in-out infinite;
+}
+
+/* 杈撳叆妗嗚仛鐒﹀姩鐢� */
+@keyframes focus-border {
+ 0% {
+ transform: scaleX(0);
+ }
+ 100% {
+ transform: scaleX(1);
+ }
+}
+
+.animate-focus-border {
+ animation: focus-border 0.3s ease-out forwards;
+}
+
+/* 閲忓瓙鍏夌嚎鏁堟灉鍔ㄧ敾 - 鐧诲綍鎸夐挳涓撶敤 */
+@keyframes quantum-scan {
+ 0% {
+ transform: translateX(-100%) skewX(-30deg);
+ opacity: 0;
+ }
+ 20% {
+ opacity: 0.5;
+ }
+ 50% {
+ opacity: 0.7;
+ }
+ 80% {
+ opacity: 0.5;
+ }
+ 100% {
+ transform: translateX(100%) skewX(-30deg);
+ opacity: 0;
+ }
+}
+
+@keyframes quantum-glow {
+ 0%, 100% {
+ box-shadow: 0 0 5px 2px rgba(106, 219, 255, 0.1);
+ }
+ 50% {
+ box-shadow: 0 0 15px 5px rgba(106, 219, 255, 0.3);
+ }
+}
+
+@keyframes quantum-pulse {
+ 0%, 100% {
+ transform: scale(1);
+ }
+ 50% {
+ transform: scale(1.02);
+ }
+}
+
+.quantum-button:hover .quantum-scan-line {
+ animation: quantum-scan 3s ease-in-out infinite;
+}
+
+.quantum-button:hover {
+ animation: quantum-glow 4s ease-in-out infinite;
+}
+
+.quantum-button:hover .quantum-pulse {
+ animation: quantum-pulse 2s ease-in-out infinite;
}
--
Gitblit v1.9.3