---
import { t, l } from "astro-i18n";
import LanguageSwitcher from "./LanguageSwitcher.astro";
---

<nav role="navigation" aria-label={t("header.mainNav")}>
	<ul class="main-nav" role="list">
		<li>
			<a href={l("/")}>{t("accueil")}</a>
			<span aria-hidden="true">&middot;</span>
		</li>
		<li>
			<a href={l("/articles")}>{t("article.titre")}</a>
			<span aria-hidden="true">&middot;</span>
		</li>
		<li>
			<a href={}>{t("fragments.titre")}</a>
			<span aria-hidden="true">&middot;</span>
		</li>
		<li>
			<a
				href="mailto:contact@nardu.in"
				class="nice-link"
				title={t("contactLien")}
				>{t("contact")}
			</a>
			<span aria-hidden="true">&#x7C;</span>
		</li>
		<li>
			<LanguageSwitcher />
		</li>
	</ul>
</nav>

<style>
	.main-nav {
		display: flex;
		flex-flow: row wrap;
		gap: var(--space-2xs);
		justify-content: center;
	}
	a {
		text-decoration: none;
	}
</style>