Add animations

src/routes/more/data/+page.svelte

@@ -1,5 +1,6 @@
 <script>
     import Header from '$lib/navigation/header.svelte';
+	import Loading from '$lib/navigation/loading.svelte';
     import Nav from '$lib/navigation/nav.svelte';
     import { uuid } from '$lib/stores/uuid.js';
     import { onMount } from 'svelte';
@@ -12,6 +13,8 @@
         }
     ]
 
+    let isLoading = false;
+
     async function fetchData() {
         if ($uuid != "null") {
             const url = `https://owlboard.info/api/v2/user/${$uuid}`
@@ -24,7 +27,9 @@
     }
 
     onMount(async () => {
-        fetchData();
+        isLoading = true;
+        await fetchData();
+        isLoading = false;
     })
 </script>
  
@@ -34,13 +39,17 @@
 <p>Besides your randomly generated UUID which is used to authorise your staff access we store the following data:</p>
 <br><br>
 
-{#if data[0].domain != "User not Found"}
-  <p class="api_response">Registration Domain: {data[0]['domain']}</p>
-  <p class="api_response">Access Time: {data[0]['atime']}</p>
+{#if isLoading}
+  <Loading />
 {:else}
-  <p class="api_response">You are not registered, we don't have any data stored.</p>
+  {#if data[0].domain != "User not Found"}
+    <p class="api_response">Registration Domain: {data[0]['domain']}</p>
+    <p class="api_response">Access Time: {data[0]['atime']}</p>
+  {:else}
+    <p class="api_response">You are not registered, we don't have any data stored.</p>
+  {/if}
 {/if}
- 
+  
 <Nav />
 
 <style>