<script setup lang="ts">

// types

type Props = {}

// props

const props = defineProps<Props>();
const {} = toRefs(props);

</script>

<template>
    <section class="h-[100svh] mt-20 px-20">
        <div class="flex items-center justify-between mb-20">
            <span class="typo-h-4 text-black">
                مقالات اخیر سایت
            </span>
            <Button variant="outlined" class="rounded-full" start-icon="ci:paper">
                نمایش همه
            </Button>
        </div>
        <div class="flex gap-12">
            <div class="flex-1 flex flex-col gap-12">
                <BlogPost
                    description="aaasd"
                    title="asd"
                    :comments="2"
                    link="#"
                    date="2020-06-10"
                    tag="asdsa"
                />
                <BlogPost
                    description="aaasd"
                    title="asd"
                    :comments="2"
                    link="#"
                    date="2020-06-10"
                    tag="asdsa"
                />
            </div>
            <div class="flex-[0.8] flex flex-col">
                <BlogPost
                    description="aaasd"
                    title="asd"
                    :comments="2"
                    link="#"
                    date="2020-06-10"
                    tag="asdsa"
                    variant="sm"
                />
                <BlogPost
                    description="aaasd"
                    title="asd"
                    :comments="2"
                    link="#"
                    date="2020-06-10"
                    tag="asdsa"
                    variant="sm"
                />
            </div>
        </div>
    </section>
</template>