turn link arrow into component

src/components/LinkArrow.astro

@@ -0,0 +1,18 @@
+<svg
+    width="18"
+    height="18"
+    viewBox="0 0 18 18"
+    fill="none"
+    class="transition-all duration-300 group-hover:translate-x-1"
+>
+    <path
+      d="M5.25 12.75L12.75 5.25"
+      stroke="#999999"
+      stroke-linecap="round"
+      stroke-linejoin="round"></path>
+    <path
+      d="M5.25 5.25H12.75V12.75"
+      stroke="#999999"
+      stroke-linecap="round"
+      stroke-linejoin="round"></path>
+</svg>

src/components/PostCard.astro

@@ -1,5 +1,6 @@
 ---
 import formatDate from "@/utils/formatDate";
+import LinkArrow from "./LinkArrow.astro";
 
 type Props = {
   title: string;
@@ -22,7 +23,7 @@ const { title, publishedAt, description, slug } = Astro.props;
     <div class="flex flex-row items-center gap-4">
       <p>{formatDate(publishedAt)}</p>
 
-      <svg
+      <!-- <svg
         width="18"
         height="18"
         viewBox="0 0 18 18"
@@ -39,7 +40,8 @@ const { title, publishedAt, description, slug } = Astro.props;
           stroke="#999999"
           stroke-linecap="round"
           stroke-linejoin="round"></path>
-      </svg>
+      </svg> -->
+      <LinkArrow />
     </div>
   </div>
 

src/components/SocialLinks.astro

@@ -1,14 +1,15 @@
 ---
 import Link from "./shared/Link.astro";
 import presentation from "@/data/presentation";
+import LinkArrow from "@/components/LinkArrow.astro"
 ---
 
 <ul role="list" class="flex flex-row gap-2">
   {
     presentation.socials.map((social, index) => (
       <>
-        <li>
+        <li class="flex">
-          <Link href={social.link} label={social.label} />
+          <Link href={social.link} label={social.label} /><LinkArrow />
         </li>
 
         {presentation.socials.length - 1 !== index && <li>/</li>}

src/data/presentation.ts

@@ -22,7 +22,7 @@ const presentation: Presentation = {
      *API development*. When I'm not working, I play guitar and am an avid gamer.",
   socials: [
     {
-      label: "View my GitHub 🡕",
+      label: "View my GitHub",
       link: "https://github.com/gabehf",
     },
   ],