alex/voyage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add Nord theme option to theme selection dropdown in Navbar.svelte

Browse Source
This commit is contained in:
Sean Morley
2024-04-17 00:20:56 +00:00
parent 5efb2912c0
commit f0eb5441f0
4 changed files with 13 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/lib/components/Navbar.svelte
View File

@@ -8,6 +8,7 @@
import { onMount } from "svelte";
import InfoModal from "./InfoModal.svelte";
import infoIcon from "$lib/assets/info.svg";
import type { SubmitFunction } from "@sveltejs/kit";
async function goHome() {
goto("/");
}
@@ -27,6 +28,13 @@
goto("/worldtravel");
}
const submitUpdateTheme: SubmitFunction = ({ action }) => {
const theme = action.searchParams.get("theme");
if (theme) {
document.documentElement.setAttribute("data-theme", theme);
}
};
let count = 0;
let infoModalOpen = false;
@@ -104,10 +112,11 @@
tabindex="0"
class="dropdown-content z-[1] menu p-2 shadow bg-base-100 rounded-box w-52"
>
<form method="POST">
<form method="POST" use:enhance={submitUpdateTheme}>
<li><button formaction="/?/setTheme&theme=light">Light</button></li>
<li><button formaction="/?/setTheme&theme=dark">Dark</button></li>
<li><button formaction="/?/setTheme&theme=night">Night</button></li>
<!-- <li><button formaction="/?/setTheme&theme=nord">Nord</button></li> -->
<!-- <li><button formaction="/?/setTheme&theme=retro">Retro</button></li> -->
<li><button formaction="/?/setTheme&theme=forest">Forest</button></li>
</form>