33 lines
No EOL
955 B
Vue
33 lines
No EOL
955 B
Vue
<template>
|
|
<section id="blog" class="Blog content">
|
|
<div class="grid">
|
|
<BlogCard v-for="article in articles" v-bind="makeBlogCard(article)"/>
|
|
</div>
|
|
</section>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { Category } from '../../components/Blog/types'
|
|
|
|
const { data } = await useAsyncData('articles', () => queryCollection('blog').order('date', 'DESC').limit(10).all())
|
|
|
|
const articles = data.value!
|
|
|
|
const makeBlogCard = (article: typeof articles[0]) => ({
|
|
title: article.title,
|
|
description: article.description,
|
|
image: article.meta.image as string,
|
|
date: article.date as string,
|
|
excerpt: article.excerpt,
|
|
link: article.path,
|
|
tags: article.meta.tags as string[],
|
|
category: article.meta.category as Category,
|
|
author: article.meta.author as { name: string, image: string },
|
|
})
|
|
|
|
useHead({
|
|
link: [
|
|
{ rel: 'alternate', type: 'application/rss+xml', href: '/blog/rss.xml', title: 'blogfussel' },
|
|
],
|
|
})
|
|
</script> |