feat: add personal projects

components/project.vue

@@ -0,0 +1,33 @@
+<script setup lang="ts">
+interface Props {
+  title: string;
+  image: string;
+  url: string;
+  marketplace?: string;
+}
+
+const props = defineProps<Props>();
+</script>
+
+<template>
+  <div class="flex overflow-auto gap-2 flex-col border rounded-lg p-4">
+    <NuxtImg
+      placeholder
+      :src="props.image"
+      :alt="props.title"
+      class="block w-16 h-16"
+    />
+    <ULink
+      class="font-semibold hover:underline hover:underline-offset-4"
+      :to="props.url"
+      target="_blank"
+      >{{ props.title }}</ULink
+    >
+    <div class="text-xs text-slate-600">
+      <slot name="subtitle"></slot>
+    </div>
+    <div class="text-sm">
+      <slot name="description">Lorem ipsum dorcet sit amet</slot>
+    </div>
+  </div>
+</template>