86 lines
1.8 KiB
Text
86 lines
1.8 KiB
Text
---
|
|
import { de, en } from "~/config"
|
|
import { getLangFromUrl, useTranslations } from "~/i18n/utils"
|
|
|
|
const lang = getLangFromUrl(Astro.url)
|
|
const t = useTranslations(lang)
|
|
|
|
const { home, archive, custom, links, about } =
|
|
lang === "de" ? de.navigation : en.navigation
|
|
|
|
const linkClasses = `nav-links inline-block hover:underline hover:underline-offset-4 text-blue-700 dark:text-amber-400`
|
|
---
|
|
|
|
<nav>
|
|
<div class="flex flex-row flex-wrap gap-4 text-lg">
|
|
{
|
|
home && (
|
|
<a
|
|
href={`/${lang}`}
|
|
class={linkClasses}
|
|
aria-label={t("nav.home")}
|
|
title={t("nav.home")}
|
|
data-astro-prefetch="viewport"
|
|
>
|
|
{t("nav.home")}
|
|
</a>
|
|
)
|
|
}
|
|
{
|
|
archive && (
|
|
<a
|
|
href={`/${lang}/archive`}
|
|
class={linkClasses}
|
|
aria-label={t("nav.archive")}
|
|
title={t("nav.archive")}
|
|
data-astro-prefetch="viewport"
|
|
>
|
|
{t("nav.archive")}
|
|
</a>
|
|
)
|
|
}
|
|
</div>
|
|
<div class="flex flex-row flex-wrap gap-4 text-lg pt-1">
|
|
{
|
|
custom?.map((tab) => (
|
|
<a
|
|
href={tab.link}
|
|
class={linkClasses}
|
|
target="_blank"
|
|
aria-label={tab.label}
|
|
title={tab.label}
|
|
data-astro-prefetch="viewport"
|
|
>
|
|
{tab.label}
|
|
</a>
|
|
))
|
|
}
|
|
</div>
|
|
|
|
{
|
|
links && (
|
|
<a
|
|
href={`/${lang}/links`}
|
|
class={linkClasses}
|
|
aria-label={t("nav.links")}
|
|
title={t("nav.links")}
|
|
data-astro-prefetch="viewport"
|
|
>
|
|
{t("nav.links")}
|
|
</a>
|
|
)
|
|
}
|
|
{
|
|
about && (
|
|
<a
|
|
href={`/${lang}/about`}
|
|
class={linkClasses}
|
|
aria-label={t("nav.about")}
|
|
title={t("nav.about")}
|
|
data-astro-prefetch="viewport"
|
|
>
|
|
{t("nav.about")}
|
|
</a>
|
|
)
|
|
}
|
|
</nav>
|