feat(ui): implement dynamic dropdown navigation and refactor project cards

Replaced the static navigation with a dynamic, internationalized dropdown menu powered by a new `useNavLinks` composable. The
navigation items are now sourced from i18n files. The featured project cards on the homepage have been refactored to use the
`<UPageCard>` component, and the content schema is updated with `spotlight` and `highlight` options for enhanced display.
This commit is contained in:
xiaomai
2025-11-06 00:17:34 +08:00
parent 78bc2c34a0
commit 31a4103f9b
10 changed files with 276 additions and 108 deletions

View File

@@ -23,26 +23,24 @@
:items="page?.featuredProjects.projects"
:ui="{ item: 'basis-full sm:basis-1/2 lg:basis-1/3' }"
>
<UCard class="my-2">
<template #header>
<h3 class="text-2xl font-bold">{{ item.title }}</h3>
</template>
<template #default>
<img :src="item.image" :alt="item.title" />
<p class="mt-2 line-clamp-3">{{ item.description }}</p>
</template>
<template #footer>
<UButton
v-if="item.demoLink"
:href="item.demoLink"
target="_blank"
rel="noopener"
size="sm"
>
{{ $t("index.featuredProjects.viewDemo") }}
</UButton>
</template>
</UCard>
<UPageCard
class="my-2"
:title="item.title"
:description="item.description"
:highlight="item.highlight"
:spotlight="item.spotlight"
>
<img :src="item.image" :alt="item.title" />
<UButton
v-if="item.demoLink"
:href="item.demoLink"
target="_blank"
rel="noopener"
size="sm"
>
{{ $t("index.featuredProjects.viewDemo") }}
</UButton>
</UPageCard>
</UCarousel>
</UPageSection>