feat: initialize project with event order form

This commit establishes the initial structure of the Nuxt application, centered around a new event order form.

Key changes include:
- Setting up the main app layout with a header, footer, and color mode support using @nuxt/ui.
- Creating a multi-part event order form on the index page.
- Introducing a `useEventOrder` composable to manage form state and validation with Zod.
- Adding modular form components under `app/components/eventOrder`.
- Including project configuration files for pnpm, VSCode, and global CSS.

app/layouts/default.vue

@@ -0,0 +1,59 @@
+<template>
+  <UApp>
+    <UHeader>
+      <template #left>
+        <div class="text-2xl font-bold">Tootaio Studio</div>
+      </template>
+
+      <template #right>
+        <UColorModeButton />
+      </template>
+    </UHeader>
+
+    <UMain>
+      <slot />
+    </UMain>
+
+    <UFooter>
+      <template #left>
+        <p class="text-muted text-sm">
+          Copyright &copy; 2021 - {{ new Date().getFullYear() }} Tootaio Studio.
+          All Rights Reserved.
+        </p>
+      </template>
+
+      <template #right>
+        <UButton
+          v-for="link in socialLink"
+          :key="link.name"
+          :icon="link.icon"
+          color="neutral"
+          variant="ghost"
+          :to="link.link"
+          target="_blank"
+          :aria-label="link.name"
+        />
+      </template>
+    </UFooter>
+  </UApp>
+</template>
+
+<script setup lang="ts">
+const socialLink = [
+  {
+    name: "Blog Posts",
+    icon: "lucide:globe",
+    link: "https://xiaomai.tootaio.com",
+  },
+  {
+    name: "Official Website",
+    icon: "lucide:mouse-pointer-click",
+    link: "https://tootaio.com",
+  },
+  {
+    name: "GitHub",
+    icon: "lucide:github",
+    link: "https://github.com/kingsmai",
+  },
+];
+</script>