<script lang="ts">
	import type { PageData } from './$types';
	export let data: PageData;
	const { allPosts } = data;
	import siteMetadata from '$content/metadata.json';
	import PostHeader from '$lib/components/PostHeader.svelte';
</script>

<svelte:head>
	<title>{siteMetadata.blogName}</title>
</svelte:head>

<hr class="separator" />
<ul id="catalog" class="content">
	{#each allPosts as post}
		<li>
			<PostHeader metadata={post.meta} link={post.path} />
		</li>
	{/each}
</ul>
<hr class="separator" />

<style>
	#catalog li {
		margin-bottom: 10px;
	}
</style>
