---
import config from "@/config/config.json" assert { type: "json" };
import ImageMod from "../ImageMod.astro";
const { siteTitle, siteTitleHref } = Astro.locals.starlightRoute;
const { src, srcDarkmode }: { src?: string; srcDarkmode?: string } =
Astro.props;
const theme_switcher = config.settings.theme_switcher;
const {
logo,
logo_darkmode,
logo_width,
logo_height,
logo_text,
title,
}: {
logo: string;
logo_darkmode: string;
logo_width: any;
logo_height: any;
logo_text: string;
title: string;
} = config.site;
const logoSrc = src ? src : logo;
const logoDarkSrc = srcDarkmode ? srcDarkmode : logo_darkmode;
const base = import.meta.env.BASE_URL.replace(/\/$/, "");
const isPublicPath = (p: string) => p.startsWith("/");
const withBase = (p: string) => isPublicPath(p) ? `${base}${p}` : p;
const w = logo_width.replace("px", "");
const h = logo_height.replace("px", "");
---
<a href={siteTitleHref} class="navbar-brand inline-block">
{
logoSrc || logoDarkSrc ? (
<>
{isPublicPath(logoSrc) ? (
<img
src={withBase(logoSrc)}
class={`inline-block ${theme_switcher && "dark:hidden"}`}
alt={title}
width={w}
height={h}
style={{ height: h + "px", width: w + "px", objectFit: "contain" }}
/>
) : (
<ImageMod
src={logoSrc}
class={`inline-block ${theme_switcher && "dark:hidden"}`}
width={Number(w) * 2}
height={Number(h) * 2}
alt={title}
style={{ height: h + "px", width: w + "px", objectFit: "contain" }}
format="webp"
/>
)}
{theme_switcher && (
isPublicPath(logoDarkSrc) ? (
<img
src={withBase(logoDarkSrc)}
class="hidden dark:inline-block"
alt={title}
width={w}
height={h}
style={{ height: h + "px", width: w + "px", objectFit: "contain" }}
/>
) : (
<ImageMod
src={logoDarkSrc}
class="hidden dark:inline-block"
width={Number(w) * 2}
height={Number(h) * 2}
alt={title}
style={{ height: h + "px", width: w + "px", objectFit: "contain" }}
format="webp"
/>
)
)}
</>
) : logo_text ? (
logo_text
) : (
siteTitle || title
)
}
</a>