From 76860718132ade0ad75de8ec52e3354285653438 Mon Sep 17 00:00:00 2001
From: M3DZIK <me@medzik.dev>
Date: Sun, 17 Mar 2024 22:46:02 +0100
Subject: [PATCH] Move Arrow svg to component

---
 src/lib/Arrow.svelte    |  7 +++++++
 src/routes/+page.svelte | 13 +++----------
 2 files changed, 10 insertions(+), 10 deletions(-)
 create mode 100644 src/lib/Arrow.svelte

diff --git a/src/lib/Arrow.svelte b/src/lib/Arrow.svelte
new file mode 100644
index 0000000..10f5af4
--- /dev/null
+++ b/src/lib/Arrow.svelte
@@ -0,0 +1,7 @@
+<script>
+    import IconBase from 'svelte-icons/components/IconBase.svelte';
+</script>
+
+<IconBase viewBox="0 0 24 24" {...$$props}>
+    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3" />
+</IconBase>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 7dfef8d..00330c6 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -10,6 +10,7 @@
 
     import avatar from '../assets/avatar.svg';
     import SignalIcon from '../lib/Signal.svelte';
+    import Arrow from '$lib/Arrow.svelte';
 </script>
 
 <svelte:head>
@@ -59,16 +60,8 @@
         </footer>
     </div>
 
-    <div class="absolute bottom-4">
-        <svg
-            xmlns="http://www.w3.org/2000/svg"
-            fill="none"
-            viewBox="0 0 24 24"
-            stroke="currentColor"
-            class="h-8 w-8 text-on-primary-token animate-bounce"
-        >
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3" />
-        </svg>
+    <div class="absolute bottom-4 h-8 w-8 text-on-primary-token animate-bounce">
+        <Arrow />
     </div>
 </div>