marzban-dev
35 lines
749 B
Vue
35 lines
749 B
Vue
<script lang="ts" setup>
|
|
|
|
// type
|
|
|
|
type Props = {
|
|
articles: Article[],
|
|
}
|
|
|
|
// props
|
|
|
|
const props = defineProps<Props>();
|
|
const { articles } = toRefs(props);
|
|
|
|
// state
|
|
|
|
const isMobile = useMediaQuery('(max-width: 1024px)');
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div class="columns-1 xs:columns-2 xl:columns-3 gap-6 sm:gap-8 w-full space-y-8">
|
|
<BlogPost
|
|
v-for="article in articles"
|
|
:key="article.id"
|
|
:image="article.cover_image"
|
|
:description="article.summery"
|
|
:title="article.title"
|
|
:comments="2"
|
|
:id="article.id"
|
|
:date="article.created_at"
|
|
:variant="isMobile ? 'sm' : 'lg'"
|
|
tag="تگ ندارد"
|
|
/>
|
|
</div>
|
|
</template> |