From 0236dbe2d83b2b7ee2efcd255d051b02015c5023 Mon Sep 17 00:00:00 2001
From: HEIGE-PCloud <heige.pcloud@outlook.com>
Date: Thu, 28 Mar 2024 18:01:42 +0000
Subject: [PATCH] fix: spinner

---
 assets/css/main.css          | 10 ++++++++++
 layouts/partials/header.html |  4 ++--
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/assets/css/main.css b/assets/css/main.css
index a7ba988b9..29e171493 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -605,6 +605,16 @@ ul {
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
+@keyframes tw-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.tw-animate-spin {
+  animation: tw-spin 1s linear infinite;
+}
+
 .tw-rounded-full {
   border-radius: 9999px;
 }
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 93fd8b72f..7e0688de2 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -76,7 +76,7 @@
                     <button class="search-button search-clear" id="search-clear-desktop" title="{{ T `clear` }}">
                         {{ partial "plugin/fontawesome.html" (dict "Style" "solid" "Icon" "times-circle") }}
                     </button>
-                    <span class="search-button search-loading" id="search-loading-desktop">
+                    <span class="search-button search-loading tw-animate-spin" id="search-loading-desktop">
                         {{ partial "plugin/fontawesome.html" (dict "Style" "solid" "Icon" "spinner") }}
                     </span>
                 </span>
@@ -148,7 +148,7 @@
                     <button class="search-button search-clear" id="search-clear-mobile" title="{{ T `clear` }}">
                         {{ partial "plugin/fontawesome.html" (dict "Style" "solid" "Icon" "times-circle") }}
                     </button>
-                    <span class="search-button search-loading" id="search-loading-mobile">
+                    <span class="search-button search-loading tw-animate-spin" id="search-loading-mobile">
                         {{ partial "plugin/fontawesome.html" (dict "Style" "solid" "Icon" "spinner") }}
                     </span>
                 </div>