diff --git a/src/lib/Cover.svelte b/src/lib/Cover.svelte index d5e4eec..cf3901d 100644 --- a/src/lib/Cover.svelte +++ b/src/lib/Cover.svelte @@ -1,4963 +1,8 @@ - diff --git a/src/lib/cover-work.svg b/src/lib/cover-work.svg new file mode 100644 index 0000000..9669700 --- /dev/null +++ b/src/lib/cover-work.svg @@ -0,0 +1,5275 @@ + + + + diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 3cc52fb..e3e2131 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -3,7 +3,7 @@ import { derived } from 'svelte/store' import { routes } from "$lib/sitemap.ts" import { Separator } from "$lib/components/ui/separator/index.js"; - import { theme, getThemeObject } from '$lib/theme' + import { theme, setTheme, getThemeObject } from '$lib/theme' import { Rss } from "lucide-svelte"; import ThemeSwitch from "$lib/components/ThemeSwitch.svelte" import Cover from "$lib/Cover.svelte" @@ -13,9 +13,25 @@ let button_blog; + function toggleTheme() { + theme.update((currentTheme) => { + const newTheme = currentTheme === 'tokiwa' ? 'star' : 'tokiwa' + + document.documentElement.setAttribute('color-scheme', newTheme) + localStorage.setItem('color-scheme', newTheme) + + if (newTheme === "tokiwa") { + document.documentElement.classList.remove('dark'); + } else { + document.documentElement.classList.add('dark'); + } + setTheme(newTheme); + return newTheme + }) + } onMount(() => { - let entity_blog = document.getElementById("visor"); - let link_about = document.getElementById("link-about"); + let entity_switch = document.getElementById("switch"); + entity_switch.addEventListener("click", toggleTheme); }); function onScroll() { if (scrollHeight > 1) { @@ -48,18 +64,16 @@ }; const iconLinks: [string, string][] = Object.entries(metadata.links).map( ([key, link]) => [iconMap[key], link]); - - const frontCover = derived( - theme, - ($theme) => getThemeObject($theme, metadata.frontCover) - ) {metadata.name} -
+
@@ -116,9 +130,9 @@