From c010373e5bd1ee7f124bfe9190c66cc3ed047a42 Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Thu, 30 Jan 2025 18:35:51 +0100
Subject: [PATCH] Updated loading indicator to match the other one we have

---
 src/components/screens/Characters.vue |  2 +-
 src/components/screens/Loading.vue    | 12 +-----------
 2 files changed, 2 insertions(+), 12 deletions(-)

diff --git a/src/components/screens/Characters.vue b/src/components/screens/Characters.vue
index f82ba79..67d0e7a 100644
--- a/src/components/screens/Characters.vue
+++ b/src/components/screens/Characters.vue
@@ -87,7 +87,7 @@
         </div>
       </div>
       <div v-else>
-        <img class="w-20 invert-80" src="/assets/icons/loading-icon1.svg" />
+        <img class="w-20 invert-80" src="/assets/icons/loading-icon1.svg" alt="Loading" />
       </div>
 
       <div class="w-2/3 button-wrapper flex self-center justify-center lg:justify-end gap-4 max-w-[860px]" v-if="!isLoading">
diff --git a/src/components/screens/Loading.vue b/src/components/screens/Loading.vue
index 08e1b93..4a14ca0 100644
--- a/src/components/screens/Loading.vue
+++ b/src/components/screens/Loading.vue
@@ -1,16 +1,6 @@
 <template>
   <div class="flex flex-col justify-center items-center h-dvh relative col">
-    <svg width="40" height="40" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-      <circle cx="4" cy="12" r="3" fill="white">
-        <animate id="spinner_qFRN" begin="0;spinner_OcgL.end+0.25s" attributeName="cy" calcMode="spline" dur="0.6s" values="12;6;12" keySplines=".33,.66,.66,1;.33,0,.66,.33" />
-      </circle>
-      <circle cx="12" cy="12" r="3" fill="white">
-        <animate begin="spinner_qFRN.begin+0.1s" attributeName="cy" calcMode="spline" dur="0.6s" values="12;6;12" keySplines=".33,.66,.66,1;.33,0,.66,.33" />
-      </circle>
-      <circle cx="20" cy="12" r="3" fill="white">
-        <animate id="spinner_OcgL" begin="spinner_qFRN.begin+0.2s" attributeName="cy" calcMode="spline" dur="0.6s" values="12;6;12" keySplines=".33,.66,.66,1;.33,0,.66,.33" />
-      </circle>
-    </svg>
+    <img class="w-20 invert-80" src="/assets/icons/loading-icon1.svg" alt="Loading" />
   </div>
 </template>