feat(app): introduce Hall of Fame section and refactor UI

This commit adds the '名人堂' (Hall of Fame) feature and removes the Element Plus dependency.

- feat(content): Add Hall of Fame section with a new content collection, homepage component, and detail pages.
- refactor(join-us): Rewrite the 'Join Us' form to remove Element Plus, using native elements and Reka UI. The form is
temporarily disabled.
- feat(ui): Display cover images on News and Events cards.
- chore: Integrate Umami for web analytics.
- fix: Correct minor text issues, including graduation year in the footer.

app/components/AppFooter.vue

@@ -13,7 +13,7 @@
           <a href="https://tootaio.com" target="_blank" class="font-semibold hover:underline" style="color: #e24545;">
             Tootaio Studio
           </a>
-          <span class="mt-1 text-sm text-gray-400">18 级毕业学长（麦祖奕）</span>
+          <span class="mt-1 text-sm text-gray-400">2018 级毕业学长（麦祖奕）</span>
         </p>
       </div>
 

app/components/AppHeader.vue

@@ -11,7 +11,7 @@
             <nav class="space-x-6 hidden md:flex items-center">
                 <a href="#news" class="hover:text-secondary">新闻</a>
                 <a href="#events" class="hover:text-secondary">活动</a>
-                <a href="#donate" class="hover:text-secondary">捐赠</a>
+                <a href="#donate" class="hover:text-secondary">捐赠（未开放）</a>
                 <a href="#about" class="hover:text-secondary">关于</a>
                 <a href="/join-us"
                     class="inline-flex items-center gap-2 bg-secondary text-white px-4 py-2 rounded-xl shadow hover:opacity-90">

app/components/index/Donate.vue

@@ -2,7 +2,7 @@
   <div>
     <!-- 捐赠模块 -->
     <section id="donate" class="py-16 text-center bg-[var(--color-primary)]">
-      <h3 class="text-2xl font-bold text-gray-900 mb-4">支持与捐赠</h3>
+      <h3 class="text-2xl font-bold text-gray-900 mb-4">支持与捐赠（功能未开放）</h3>
       <p class="max-w-2xl mx-auto text-gray-700 mb-6">您的捐赠将用于奖学金、校园建设及校友活动发展。感谢您对母校的支持！</p>
       <a href="#" class="bg-[var(--color-secondary)] text-white px-8 py-3 rounded-xl shadow hover:opacity-90">立即捐赠</a>
     </section>

app/components/index/Events.vue

@@ -5,11 +5,14 @@
       <div class="max-w-6xl mx-auto px-4">
         <h3 class="text-2xl font-bold text-gray-900 mb-6">校友活动</h3>
         <div class="grid md:grid-cols-3 gap-6">
-          <div v-for="event in events" :key="event.id" class="bg-white shadow rounded-xl p-6">
-            <h4 class="font-semibold text-lg mb-2">{{ event.title }}</h4>
-            <p class="text-sm text-gray-600 mb-1">日期：{{ useChineseDateFormat(event.date) }}</p>
-            <p class="text-sm text-gray-600 mb-4">地点：{{ event.location }}</p>
-            <a :href="event.path" class="bg-secondary text-white px-5 py-2 rounded-lg hover:opacity-90">阅读详情</a>
+          <div v-for="event in events" :key="event.id" class="bg-white shadow rounded-xl">
+            <img :src="event.cover" :alt="event.title" class="rounded-xl" />
+            <div class="p-6">
+              <h4 class="font-semibold text-lg mb-2">{{ event.title }}</h4>
+              <p class="text-sm text-gray-600 mb-1">日期：{{ useChineseDateFormat(event.date) }}</p>
+              <p class="text-sm text-gray-600 mb-4">地点：{{ event.location }}</p>
+              <a :href="event.path" class="bg-secondary text-white px-5 py-2 rounded-lg hover:opacity-90">阅读详情</a>
+            </div>
           </div>
         </div>
       </div>

app/components/index/HallOfFame.vue

@@ -0,0 +1,31 @@
+<template>
+  <div>
+    <section id="hall-of-fame" class="py-16">
+      <div class="max-w-6xl mx-auto px-4">
+        <h3 class="text-2xl font-bold text-center text-gray-900 mb-6">名人堂</h3>
+        <div class="grid md:grid-cols-4 gap-6">
+          <div v-for="person in persons" :key="person.id" class="flex flex-col items-center cursor-pointer transition hover:scale-105 hover:drop-shadow-2xl hover:-translate-y-1" @click="jumpToPersonIntro(person.path)">
+            <img :src="person.photo" :alt="person.name" class="w-40 rounded-full border-secondary border-4" />
+            <h4 class="text-lg font-bold">{{ person.name }}</h4>
+            <p class="text-sm text-gray-500">{{ person.title }}</p>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+</template>
+
+<script lang="ts" setup>
+const { data: persons } = await useAsyncData('hall-of-fames', () =>
+  queryCollection('hallOfFames')
+    .limit(4)
+    .all()
+)
+
+var router = useRouter()
+const jumpToPersonIntro = (path: string) => {
+  router.push(path)
+}
+</script>
+
+<style></style>

app/components/index/Hero.vue

@@ -18,10 +18,10 @@
           <a href="/join-us" class="bg-secondary text-white px-6 py-3 rounded-xl shadow hover:opacity-90">
             立即加入我们
           </a>
-          <a href="#donate"
+          <!-- <a href="#donate"
             class="bg-white border-2 border-secondary text-secondary px-6 py-3 rounded-xl hover:bg-secondary hover:text-white">
             支持捐赠
-          </a>
+          </a> -->
         </div>
       </div>
     </section>

app/components/index/News.vue

@@ -5,11 +5,14 @@
       <h2 class="text-2xl font-bold text-gray-900 mb-6">最新新闻与公告</h2>
       <div class="grid md:grid-cols-3 gap-6">
         <article v-for="n in news" :key="n.id" @click="jumpToNewsDetail(n.stem)"
-          class="bg-white rounded-xl shadow p-5 cursor-pointer transition transform hover:-translate-y-1 hover:scale-105 hover:shadow-xl duration-300 ease-in-out">
-          <h3 class="font-semibold mb-2">{{ n.title }}</h3>
-          <div class="px-1 w-max bg-primary/25 border-primary border-2 rounded-xl text-secondary text-sm mb-2">{{
-            useChineseDateFormat(n.date) }}</div>
-          <p class="text-sm text-gray-600">{{ n.description }}</p>
+          class="bg-primary/10 rounded-xl shadow cursor-pointer transition transform hover:-translate-y-1 hover:scale-105 hover:shadow-xl duration-300 ease-in-out">
+          <img class="rounded-xl" :src="n.cover" :alt="n.title">
+          <div class="p-5">
+            <h3 class="font-semibold mb-2">{{ n.title }}</h3>
+            <div class="px-1 w-max bg-primary/25 border-primary border-2 rounded-xl text-secondary text-sm mb-2">{{
+              useChineseDateFormat(n.date) }}</div>
+            <p class="text-sm text-gray-600">{{ n.description }}</p>
+          </div>
         </article>
       </div>
     </section>