diff --git a/OliverBooth/Pages/Shared/_Layout.cshtml b/OliverBooth/Pages/Shared/_Layout.cshtml index fc5c87b..ea92463 100644 --- a/OliverBooth/Pages/Shared/_Layout.cshtml +++ b/OliverBooth/Pages/Shared/_Layout.cshtml @@ -48,6 +48,8 @@ } + + diff --git a/src/img/favicon-dark.png b/src/img/favicon-dark.png new file mode 100644 index 0000000..67c4077 Binary files /dev/null and b/src/img/favicon-dark.png differ diff --git a/src/ts/app.ts b/src/ts/app.ts index c370eea..319f8e1 100644 --- a/src/ts/app.ts +++ b/src/ts/app.ts @@ -69,4 +69,14 @@ declare const lucide: any; } }); } + + function setFavicon() { + const darkMode = window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches; + const favicon = document.querySelector("link[rel~=\"icon\"]"); + // @ts-ignore + favicon.href = `/img/${darkMode ? "favicon-dark.png" : "favicon.png"}`; + } + + setFavicon(); + window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", setFavicon); })();