arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-29 11:20:36 +01:00
Code Issues Packages Projects Releases Wiki Activity

up

Browse Source
This commit is contained in:
HugoRCD
2025-05-06 13:06:16 +02:00
parent 7901e5733a
commit 4f6cb68b97
1 changed files with 19 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
docs/app/pages/blog/index.vue
View File

@@ -22,16 +22,24 @@ useSeoMeta({
</script> </script>
<template> <template>
<UContainer v-if="page"> <div v-if="page" class="relative">
<UPageHero <UPageHero :links="page.links" :ui="{ container: 'relative' }">
:title="page.title" <LazyStarsBg />
:description="page.description"
orientation="horizontal"
/>
<UPageBody> <div aria-hidden="true" class="hidden lg:block absolute z-[-1] border-x border-default inset-0 mx-4 sm:mx-6 lg:mx-8" />
<template #title>
<MDC :value="page.title" unwrap="p" cache-key="pro-templates-hero-title" />
</template>
<template #description>
<MDC :value="page.description" unwrap="p" cache-key="pro-templates-hero-description" />
</template>
</UPageHero>
<UPageBody class="mt-0 lg:border-t border-default">
<UContainer> <UContainer>
<UBlogPosts class="mb-12 md:grid-cols-2 lg:grid-cols-3"> <UBlogPosts orientation="vertical" class="!gap-0">
<UBlogPost <UBlogPost
v-for="(article, index) in posts" v-for="(article, index) in posts"
:key="article.path" :key="article.path"
@@ -46,12 +54,11 @@ useSeoMeta({
}" }"
:authors="article.authors?.map(author => ({ ...author, avatar: { ...author.avatar, alt: `${author.name} avatar` } }))" :authors="article.authors?.map(author => ({ ...author, avatar: { ...author.avatar, alt: `${author.name} avatar` } }))"
:badge="{ label: article.category, color: 'primary', variant: 'subtle' }" :badge="{ label: article.category, color: 'primary', variant: 'subtle' }"
:variant="index === 0 ? 'outline' : 'subtle'" orientation="horizontal"
:orientation="index === 0 ? 'horizontal' : 'vertical'" class="ring-0 border border-t-0 border-default rounded-none"
:class="[index === 0 && 'col-span-full']"
/> />
</UBlogPosts> </UBlogPosts>
</UContainer> </UContainer>
</UPageBody> </UPageBody>
</UContainer> </div>
</template> </template>