---
import DefaultLayout from "../../layouts/DefaultLayout.astro";
import { listDocuments } from "../../lib/documents";
import "../../styles/document.css";

const documents = listDocuments().filter((d) => d.visible === true);
---

<DefaultLayout title="Dokumenty">
  <section class="f-documents">
    <h1 class="f-documents-title">Dokumenty</h1>

    <div class="f-documents-grid">
      {documents.map((doc) => (
        <a
          href={`/dokumenty/${doc.slug}`}
          class="f-document-card"
        >
          <h3 class="f-document-title">{doc.title}</h3>

          {doc.intro && (
            <p class="f-document-intro">{doc.intro}</p>
          )}

          <span class="f-document-link">Otwórz →</span>
        </a>
      ))}
    </div>
  </section>
</DefaultLayout>
