<script lang="ts">
	import '$lib/styles/styles.css';
	import Article from '$lib/components/Article.svelte';
	let { data } = $props();

	$inspect(data.documents);
</script>

<header>
	<h1>Alliances Transcoloniales</h1>
	<nav>
		<ul>
			<li><a href="#evenements">Événements</a></li>
			<li><a href="#archives">Archives</a></li>
			<li><a href="#principes">Déclaration de principes</a></li>
			<li><a href="#bibliographie">Bibliographie sélective</a></li>
		</ul>
	</nav>
</header>

<section>
	<h2 id="evenements">Événements</h2>
	{#each data.documents as d}
		<Article document={d} />
	{/each}
	<h2 id="archives">Archives</h2>
	<h2 id="principes">Déclaration de principes</h2>
	<h2 id="bibliographie">Bibliographie sélective</h2>
	<article>
		<p>
			Retrouvez ressources bibliographiques partagées par les intervenants de nos différents
			événements sur le <a
				href="https://www.zotero.org/groups/5871768/alliances-transcoloniales/library">Zotero</a
			>
			des <i>Alliances Transcoloniales</i>
		</p>
	</article>
</section>
