---
import { getPosts } from "../../utils";
import Layout from "../../layouts/Layout.astro";
import Card from "../../components/Card.astro";
import HomeButton from "../../components/HomeButton.astro";

const projects = await getPosts("projects");
---

<Layout title="Leggy Land - All Projects">
    <HomeButton />

    <div class="header">
        <h1>All Projects</h1>
        <p>Come back next week for 4 new projects!</p>
    </div>

    <hr>

    <ul role="list" class="project-list">
        {projects.map(post => (
            <Card {post} base="/projects"/>
        ))}
    </ul>
</Layout>