From 844ae572caf03d19c36e5be54074a92e8b468f87 Mon Sep 17 00:00:00 2001
From: pml68 <tutorialmester@gmail.com>
Date: Tue, 27 Feb 2024 18:12:53 +0100
Subject: feat: drop Font Awesome, migrate to SVG icons

---
 src/routes/+page.svelte | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

(limited to 'src/routes/+page.svelte')

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index e4e6726..c6d0eb7 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -3,12 +3,22 @@
   import { base } from '$app/paths'
   import { socials } from '$lib/socials.json'
 
+  import SteamIcon from '$lib/assets/steam.svg?src'
+  import GithubIcon from '$lib/assets/github.svg?src'
+  import DevIcon from '$lib/assets/dev.svg?src'
+  import TelegramIcon from '$lib/assets/telegram.svg?src'
+  import EnvelopeIcon from '$lib/assets/envelope.svg?src'
+
   type Social = {
     link: string,
     icon: string
   }
 
   const socialsList: Social[] = socials
+
+  const insertIcon: Function = (element: HTMLElement, icon: string) => {
+    element.innerHTML = eval(`${icon}Icon`)
+  }
 </script>
 
 <svelte:head>
@@ -20,12 +30,9 @@
   <p>Just your average IT student</p>
   <div class="socials">
     {#each socialsList as {link, icon}}
-      <a href={link} target="_blank">
-        <i class={'social-icon ' + icon}></i>
-      </a>
+      <a use:insertIcon={icon} href={link} target="_blank" class="icon"></a>
     {/each}
   </div>
-  <br>
   <div class="projects">
     Check out my projects <a href={base + '/projects'}><b>here</b></a>
   </div>
-- 
cgit v1.2.3