---
import type { CollectionEntry } from "astro:content";

import PostCard from "@components/post/postCard.astro";


const { page } = Astro.props;

let delay = 0;
const interval = 30;
---

<div class="transition flex flex-col gap-3 py-1 md:py-0 md:gap-4 mb-4">
    {page.data.map((entry: CollectionEntry<"posts">) => (
        <PostCard
            entry={entry}
            class:list="onload-animation-up"
            style={`animation-delay: ${delay++ * interval}ms;`}
        ></PostCard>
    ))}
</div>