added embeds

src/lib/elements/Social.svelte

@@ -2,9 +2,10 @@
     export let href;
     export let icon;
     export let text;
+    export let target = "";
 </script>
 
-<a href={href} class="flex flex-col items-center gap-1 justify-center hover:scale-110 duration-100" target="_blank">
+<a href={href} class="flex flex-col items-center gap-1 justify-center hover:scale-110 duration-100" target={target}>
     <span class="text-6xl">{icon}</span>
     <span class="text-sm text-gray-200 text-center">{text}</span>
 </a>

src/routes/__error.svelte

@@ -2,6 +2,12 @@
     import Navbar from "$lib/header/Navbar.svelte";
 </script>
 
+<svelte:head>
+    <meta property="og:title" content="Error! || Siv Kyne" />
+    <meta property="og:description" content="You did an oopsie!!" />
+    <title>About || Siv Kyne</title>
+</svelte:head>
+
 <main class="flex flex-col gap-5">
     <Navbar page="error" />
 

src/routes/__layout.svelte

@@ -1,11 +1,18 @@
 <script>
-import Footer from "$lib/footer/Footer.svelte";
-
-import Header from "$lib/header/Header.svelte";
+	import Footer from "$lib/footer/Footer.svelte";
+	import Header from "$lib/header/Header.svelte";
 
 	import "../app.css";
 </script>
 
+<svelte:head>
+	<meta property="og:title" content="Home || Siv Kyne" />
+	<meta property="og:type" content="website" />
+	<meta property="og:url" content="https://sivkyne.xyz" />
+	<meta property="og:image" content="https://sivkyne.xyz/pic.png" />
+	<meta name="theme-color" content="rgb(244 63 94)">
+</svelte:head>
+
 <main class="bg-gray-900 text-white relative w-screen h-screen bg-cover bg-fixed" style="background-image: url('/bg2.png')">
 	<div class="absolute inset-0">
 		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">

src/routes/about.svelte

@@ -5,6 +5,8 @@
 </script>
 
 <svelte:head>
+    <meta property="og:title" content="About || Siv Kyne" />
+    <meta property="og:description" content="I was born in China, but my biological parents left me at the gate of an orphanage. From there, I was adopted into an American family when I was still a baby. They then raised me on a farm in the southeastern United States..." />
     <title>About || Siv Kyne</title>
 </svelte:head>
 
@@ -36,6 +38,7 @@
             <Social href="https://open.spotify.com/user/uqwz46n0jki4zdwiedca5gbp2" icon="🎵" text="Spotify" />
             <Social href="https://toyhou.se/sivkyne" icon="👪" text="Toyhouse" />
             <Social href="https://myanimelist.net/animelist/SivKyne" icon="🎞️" text="My Anime List" />
+            <Social href="/Links" icon="✉️" text="Contact" />
         </div>
     </section>
 </main>

src/routes/commissions/index.svelte

@@ -8,6 +8,8 @@
 </script>
 
 <svelte:head>
+    <meta property="og:title" content="Commission Info || Siv Kyne" />
+    <meta property="og:description" content="Commission info, prices, trello queue and more" />
     <title>Commission Info || Siv Kyne</title>
 </svelte:head>
 
@@ -86,6 +88,7 @@
             <Social href="https://trello.com/b/JfPAzQyJ/siv-kynes-commission-queue" icon="📑" text="Commission Queue" />
             <Social href="https://ko-fi.com/sivkyne" icon="☕" text="Ko-fi" />
             <Social href="https://paypal.me/sivkyne" icon="💰" text="PayPal" />
+            <Social href="/Links" icon="✉️" text="Contact" />
         </div>
     </section>
 </main>

src/routes/contact.svelte

@@ -5,6 +5,8 @@
 </script>
 
 <svelte:head>
+    <meta property="og:title" content="Social || Siv Kyne" />
+    <meta property="og:description" content="Siv Kyne's contact details and an email form!" />
     <title>Socials || Siv Kyne</title>
 </svelte:head>
 
@@ -13,6 +15,7 @@
 
     <section class="container bg-gray-800 rounded-lg shadow-lg p-5 flex flex-col">
         <div class="flex flex-wrap justify-center items-center gap-5">
+            <Social href="/about" icon="📄" text="About Me" />
             <Social href="https://twitter.com/SivKyne" icon="🐦" text="Twitter" />
             <Social href="https://discord.com/invite/5JCZTv3TtF" icon="💬" text="Discord" />
             <Social href="https://www.youtube.com/channel/UC1pnonYCZv1mi3XImhX35-A" icon="📺" text="YouTube" />

src/routes/index.svelte

@@ -15,6 +15,8 @@
 </script>
 
 <svelte:head>
+    <meta property="og:title" content="Home || Siv Kyne" />
+    <meta property="og:description" content="I'm a young Asian artist who specializes in cartoony 2D animals." />
     <title>Home || Siv Kyne</title>
 </svelte:head>
 
@@ -22,7 +24,7 @@
     <section class="container bg-gray-800 rounded-lg shadow-lg p-5 flex flex-col -mt-5">
         <div class="flex flex-col justify-center items-center gap-3 -mt-20 lg:-mt-28">
             <div class="bg-gradient-to-t from-gray-800 via-gray-800 to-red-500 p-2 lg:p-3 rounded-full z-50">
-                <img src="/pic.png" id="clickMeow" class="pop w-40 h-40 lg:w-60 lg:h-60 rounded-full bg-gray-800" />
+                <img src="/pic.png" id="clickMeow" class="pop w-40 h-40 lg:w-60 lg:h-60 rounded-full bg-gray-800" alt="profile pic" />
             </div>
 
             <h2 class="text-2xl font-bold fira-bold text-center">Hi, I'm Siv Kyne!</h2>
@@ -36,23 +38,16 @@
 
     <section class="container bg-gray-800 rounded-lg shadow-lg p-5 flex flex-col gap-5">
         <div class="flex flex-wrap justify-center items-center gap-5">
-            <Social href="https://twitter.com/SivKyne" icon="🐦" text="Twitter" />
-            <Social href="https://discord.com/invite/5JCZTv3TtF" icon="💬" text="Discord" />
-            <Social href="https://www.youtube.com/channel/UC1pnonYCZv1mi3XImhX35-A" icon="📺" text="YouTube" />
-            <Social href="https://www.deviantart.com/sivkyne" icon="🖼️" text="DeviantArt" />
-            <Social href="https://steamcommunity.com/id/sivkyne" icon="🎮" text="Steam" />
-            <Social href="https://open.spotify.com/user/uqwz46n0jki4zdwiedca5gbp2" icon="🎵" text="Spotify" />
-            <Social href="https://toyhou.se/sivkyne" icon="👪" text="Toyhouse" />
-            <Social href="https://myanimelist.net/animelist/SivKyne" icon="🎞️" text="My Anime List" />
-        </div>
-        <div class="flex flex-col lg:flex-row gap-5">
-            <Button href="/about">
-                📄 About me
-            </Button>
-
-            <Button href="/contact">
-                ✉️ Social Links
-            </Button>
+            <Social href="https://twitter.com/SivKyne" target="_blank" icon="🐦" text="Twitter" />
+            <Social href="https://discord.com/invite/5JCZTv3TtF" target="_blank" icon="💬" text="Discord" />
+            <Social href="https://www.youtube.com/channel/UC1pnonYCZv1mi3XImhX35-A" target="_blank" icon="📺" text="YouTube" />
+            <Social href="https://www.deviantart.com/sivkyne" target="_blank" icon="🖼️" text="DeviantArt" />
+            <Social href="https://steamcommunity.com/id/sivkyne" target="_blank" icon="🎮" text="Steam" />
+            <Social href="https://open.spotify.com/user/uqwz46n0jki4zdwiedca5gbp2" target="_blank" icon="🎵" text="Spotify" />
+            <Social href="https://toyhou.se/sivkyne" target="_blank" icon="👪" text="Toyhouse" />
+            <Social href="https://myanimelist.net/animelist/SivKyne" target="_blank" icon="🎞️" text="My Anime List" />
+            <Social href="/about" icon="📄" text="About Me" />
+            <Social href="/Links" icon="✉️" text="Contact" />
         </div>
     </section>