chore: refactor

components/home/connect.vue

@@ -0,0 +1,51 @@
+<template>
+  <UContainer class="flex flex-col gap-5" as="section">
+    <div class="text-sm text-gray-500">Let's connect</div>
+
+    <div class="flex gap-4 overflow-x-auto">
+      <UButton
+        color="purple"
+        icon="i-heroicons-arrow-right-circle"
+        class="rounded-full"
+        variant="soft"
+        target="_blank"
+        to="https://www.calendar.com/mariosant/short-video-call"
+      >
+        Calendar
+      </UButton>
+
+      <UButton
+        color="green"
+        icon="i-heroicons-arrow-right-circle"
+        class="rounded-full"
+        variant="soft"
+        target="_blank"
+        to="mailto:mariosant@sent.com"
+      >
+        Email
+      </UButton>
+
+      <UButton
+        color="orange"
+        icon="i-heroicons-arrow-right-circle"
+        class="rounded-full"
+        variant="soft"
+        target="_blank"
+        to="https://github.com/mariosant"
+      >
+        Github
+      </UButton>
+
+      <UButton
+        color="blue"
+        icon="i-heroicons-arrow-right-circle"
+        class="rounded-full"
+        variant="soft"
+        target="_blank"
+        to="https://www.linkedin.com/in/mariosant/"
+      >
+        Linkedin
+      </UButton>
+    </div>
+  </UContainer>
+</template>