48 lines
1.4 KiB
Plaintext
48 lines
1.4 KiB
Plaintext
---
|
|
import { ThemeSelector } from "./ThemeSelector"
|
|
import NavbarSkeleton from "./NavbarSkeleton.astro";
|
|
import { LangSwitcher } from "./LangSwitcher";
|
|
import { NavButton } from "./NavButton";
|
|
import { useTranslations, getLangFromUrl } from "../i18n/utils";
|
|
|
|
function selected(path) {
|
|
var currentURL = Astro.url.pathname
|
|
.replace(Astro.currentLocale + "/", "") || "/"
|
|
if( path == "/blog" && currentURL.startsWith("/blog") ){
|
|
return (true);
|
|
}
|
|
return (
|
|
currentURL == path
|
|
);
|
|
}
|
|
|
|
const locale = Astro.currentLocale ? Astro.currentLocale : "en"
|
|
|
|
const t = useTranslations(getLangFromUrl(Astro.url));
|
|
|
|
---
|
|
<NavbarSkeleton>
|
|
<!-- Page Navigation -->
|
|
<div class="flex gap-1">
|
|
<a href={`/${locale}/`}>
|
|
<NavButton selected={selected("/")} variant="home" tooltip={t("navbar")["home"]} client:load />
|
|
</a>
|
|
<a href={`/${locale}/blog`}>
|
|
<NavButton selected={selected("/blog")} variant="blog" tooltip={t("navbar")["blog"]} client:load />
|
|
</a>
|
|
<a href={`/${locale}/music`}>
|
|
<NavButton selected={selected("/music")} variant="music" tooltip={t("navbar")["music"]} client:load/>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Logo -->
|
|
<div>
|
|
<!-- <Icon icon="favicon" class={"h-8 w-8 text-content"} /> -->
|
|
</div>
|
|
|
|
<!-- Options (language, light/dark mode) -->
|
|
<div class="flex gap-1">
|
|
<LangSwitcher tooltip={t("navbar")["lang"]} client:load client:only="react"/>
|
|
<ThemeSelector tooltip={t("navbar")["mode"]} client:load client:only="react"/>
|
|
</div>
|
|
</NavbarSkeleton> |