feat(ui): implement responsive header and update content

Adds a responsive header with a mobile navigation menu to improve usability on small screens. This also includes adding a new event page, updating an existing event with a schedule, and refactoring the 'Donate' CTA by
inlining it on the homepage.

app/layouts/default.vue

@@ -2,11 +2,18 @@
   <UPage>
     <UHeader>
       <template #left>
-        <img class="inline h-12 w-auto" src="/Logo.svg" alt="YPHS Alumni" />
-        <h1 class="inline text-xl font-bold text-gray-900">
-          <a href="/" class="ml-4 hover:text-primary">永平中学校友会</a>
-        </h1>
+        <NuxtLink to="/">
+          <div class="flex gap-4 items-center">
+            <img class="inline h-12 w-auto" src="/Logo.svg" alt="YPHS Alumni" />
+            <h1
+              class="inline text-xl font-bold text-gray-900 hover:text-primary"
+            >
+              永平中学校友会
+            </h1>
+          </div>
+        </NuxtLink>
       </template>
+
       <template #right>
         <nav class="space-x-6 hidden md:flex items-center">
           <UNavigationMenu :items="items" />
@@ -19,10 +26,20 @@
           </a>
         </nav>
       </template>
+
+      <template #body>
+        <UNavigationMenu
+          :items="items"
+          orientation="vertical"
+          class="-mx-2.5"
+        />
+      </template>
     </UHeader>
+
     <UMain>
       <slot />
     </UMain>
+
     <UFooter>
       <template #left>
         <p>© 2025 永平中学校友会. 保留所有权利.</p>
@@ -39,9 +56,7 @@
           >
             Tootaio Studio
           </a>
-          <span class="mt-1 text-sm"
-            >2018 级毕业学长（麦祖奕）</span
-          >
+          <span class="mt-1 text-sm">2018 级毕业学长（麦祖奕）</span>
         </p>
       </template>