1---
 2import type { CollectionEntry } from "astro:content";
 3import { DateTime } from "luxon";
 4import { SITE_CONFIG } from "@/config";
 5import { url } from "@/utils/url";
 6
 7interface Props {
 8  posts: CollectionEntry<"posts">[];
 9}
10
11const { posts } = Astro.props;
12---
13
14<nav>
15  <ol class="text-xl lg:text-2xl no-counter">
16    {
17      posts.map((post) => {
18        const dt = DateTime.fromJSDate(post.data.date, {
19          zone: SITE_CONFIG.timeZone,
20        });
21        return (
22          <li class="grid grid-rows-1 grid-cols-[1fr_auto] gap-2">
23            <a href={url(`/posts/${post.id}`)}>{post.data.title}</a>
24            <time
25              datetime={dt.toISO()}
26              class="text-base lg:text-lg text-neutral-600 dark:text-neutral-400 self-center"
27            >
28              {dt.toISODate()}
29            </time>
30          </li>
31        );
32      })
33    }
34  </ol>
35</nav>