feat(pages): add web development services page
This commit introduces a new page at `/webDev` to display web development services and pricing plans. To support this, a new reusable composable `useLocalizedCollection` has been created to simplify fetching localized content from Nuxt Content. The index page has been refactored to use this new composable. - Adds `webDev.vue` page and corresponding `webDev.yml` content files for EN and ZH. - Defines a Zod schema in `content.config.ts` for the new content type. - Updates the navigation link to point to the new page.
This commit is contained in:
23
app/pages/webDev.vue
Normal file
23
app/pages/webDev.vue
Normal file
@@ -0,0 +1,23 @@
|
||||
<template>
|
||||
<UContainer>
|
||||
<UPageHero :title="page?.title" :description="page?.description" />
|
||||
|
||||
<p class="text-muted py-4 text-center">{{ page?.remarks }}</p>
|
||||
|
||||
<UTabs :items="page?.services.map((s) => ({ ...s, slot: s.id }))">
|
||||
<template
|
||||
v-for="service in page?.services"
|
||||
:key="service.id"
|
||||
#[service.id]
|
||||
>
|
||||
<UPricingPlans :plans="service.plans" />
|
||||
</template>
|
||||
</UTabs>
|
||||
</UContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
const { data: page } = await useLocalizedCollection("webDev");
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
Reference in New Issue
Block a user