From 1f1194cb8c3b1c420278a004a2dbfd4bed74f986 Mon Sep 17 00:00:00 2001
From: hxr <1490493387@qq.com>
Date: Sun, 3 Mar 2024 23:05:11 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20:recycle:=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E5=92=8C=E7=B2=BE=E7=AE=80=E5=8A=A0=E8=BD=BD=E5=8A=A8=E7=94=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html | 62 ++++++++++++++----------------------------------------
 1 file changed, 16 insertions(+), 46 deletions(-)

diff --git a/index.html b/index.html
index e7b28ef..04528cf 100644
--- a/index.html
+++ b/index.html
@@ -36,61 +36,31 @@
 
     .loader {
       position: relative;
-      width: 50px;
-      aspect-ratio: 1.154;
-      background: conic-gradient(
-        from 120deg at 50% 64%,
-        #0000,
-        #25b09b 1deg 120deg,
-        #0000 121deg
-      );
-      animation: l27-0 1.5s infinite cubic-bezier(0.3, 1, 0, 1);
+      width: 40px;
+      aspect-ratio: 0.577;
+      overflow: hidden;
+      clip-path: polygon(0 0, 100% 100%, 0 100%, 100% 0);
+      animation: l19 2s infinite linear;
     }
 
-    .loader::before,
-    .loader::after {
+    .loader::before {
       position: absolute;
-      inset: 0;
+      inset: -150%;
       content: "";
-      background: inherit;
-      transform-origin: 50% 66%;
-      animation: l27-1 1.5s infinite;
+      background: repeating-conic-gradient(
+        from 30deg,
+        #ffabab 0 60deg,
+        #abe4ff 0 120deg,
+        #ff7373 0 180deg
+      );
+      animation: inherit;
+      animation-direction: reverse;
     }
 
-    .loader::after {
-      --s: -1;
-    }
-
-    @keyframes l27-0 {
-      0%,
-      30% {
-        transform: rotate(0);
-      }
-
-      70% {
-        transform: rotate(120deg);
-      }
-
-      70.01%,
+    @keyframes l19 {
       100% {
         transform: rotate(360deg);
       }
     }
-
-    @keyframes l27-1 {
-      0% {
-        transform: rotate(calc(var(--s, 1) * 120deg)) translate(0);
-      }
-
-      30%,
-      70% {
-        transform: rotate(calc(var(--s, 1) * 120deg))
-          translate(calc(var(--s, 1) * -5px), 10px);
-      }
-
-      100% {
-        transform: rotate(calc(var(--s, 1) * 120deg)) translate(0);
-      }
-    }
   </style>
 </html>