optimize

2026-06-06 00:00:05 +08:00 · 2026-03-12 01:50:08 +08:00
parent 966bcfbba4
commit e28b893a12
7 changed files with 123 additions and 14 deletions
@@ -0,0 +1,69 @@
+<svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" width="32" height="32">
+  <style>
+    /* 核心呼吸灯动画 */
+    .ai-core-glow {
+      transform-origin: center;
+      animation: core-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+    }
+
+    /* 雷达圈旋转动画 */
+    .radar-ring {
+      transform-origin: center;
+    }
+
+    .radar-ring.outer {
+      animation: spin-reverse 20s linear infinite;
+    }
+
+    .radar-ring.inner {
+      animation: spin 12s linear infinite;
+    }
+
+    /* 数据连线光流效果 */
+    .data-link {
+      stroke-dasharray: 4;
+      animation: flow 3s linear infinite;
+    }
+
+    @keyframes core-pulse {
+      0%,
+      100% {
+        transform: scale(1);
+        opacity: 0.4;
+      }
+      50% {
+        transform: scale(2.2);
+        opacity: 0;
+      }
+    }
+
+    @keyframes spin {
+      from { transform: rotate(0deg); }
+      to { transform: rotate(360deg); }
+    }
+
+    @keyframes spin-reverse {
+      from { transform: rotate(360deg); }
+      to { transform: rotate(0deg); }
+    }
+
+    @keyframes flow {
+      from { stroke-dashoffset: 8; }
+      to { stroke-dashoffset: 0; }
+    }
+  </style>
+
+  <circle class="radar-ring outer" cx="16" cy="16" r="14" stroke="#3b82f6" stroke-width="1" stroke-dasharray="4 8" opacity="0.4" />
+  
+  <circle class="radar-ring inner" cx="16" cy="16" r="9" stroke="#3b82f6" stroke-width="1.5" stroke-dasharray="12 4" opacity="0.6" />
+  
+  <path class="data-link" d="M16 16 L25 7 M16 16 L7 22 L5 20 M16 16 L23 25" stroke="#3b82f6" stroke-width="1" opacity="0.3" />
+  
+  <circle class="data-node" cx="25" cy="7" r="1.5" fill="#3b82f6" opacity="0.7" />
+  <circle class="data-node" cx="7" cy="22" r="1.5" fill="#3b82f6" opacity="0.7" />
+  <circle class="data-node" cx="23" cy="25" r="1" fill="#3b82f6" opacity="0.5" />
+  
+  <circle class="ai-core" cx="16" cy="16" r="3.5" fill="#3b82f6" />
+  
+  <circle class="ai-core-glow" cx="16" cy="16" r="3.5" fill="#3b82f6" opacity="0.4" />
+</svg>