sveske-juice/deprived-main-website
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Theme switcher

Browse source
This commit is contained in:
MagicBOTAlex 2025-04-06 06:07:17 +02:00
parent 162158340b
commit e3f43f86f1
2 changed files with 30 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/app.html
View file

@ -12,16 +12,19 @@
%sveltekit.head%
<script>
let theme = null;
if (typeof localStorage !== 'undefined') {
theme = localStorage.getItem('theme');
}
const themesArr = ["green", "netherrack", "dark", "pink"];
}
window.AvailableThemes = ["green", "netherrack", "dark", "pink"];
if (!theme) {
const randomNumber = Math.floor(Math.random() * 4);
console.log("Slecting: " + themesArr[randomNumber]);
document.documentElement.setAttribute('data-theme', themesArr[randomNumber]);
localStorage.setItem('theme', themesArr[randomNumber]);
console.log("Slecting: " + AvailableThemes[randomNumber]);
document.documentElement.setAttribute('data-theme', AvailableThemes[randomNumber]);
localStorage.setItem('theme', AvailableThemes[randomNumber]);
} else {
console.log("Slecting: " + theme);
document.documentElement.setAttribute('data-theme', theme);

22
src/routes/+layout.svelte
View file

@ -6,6 +6,7 @@
import { fly } from 'svelte/transition';
import MediaQuery from 'svelte-media-queries';
export let hideOnPrint: boolean;
import { Dices } from "@lucide/svelte";
import DeprivedLogo from "$lib/images/DeprivedLogo.svelte";
import HamburgerMenuIcon from "$lib/images/HamburgerMenuIcon.svelte";
@ -37,6 +38,26 @@
lock.name = 'darkreader-lock';
document.head.appendChild(lock);
});
function nextTheme(){
let theme: string | null = null;
if (typeof localStorage !== 'undefined') {
theme = localStorage.getItem('theme');
}
const themesArr = (window as any).AvailableThemes;
let nextTheme = "dark";
if (theme == "null" || theme == "undefined" || theme == undefined || theme == null){
} else {
nextTheme = themesArr[(1 - -themesArr.indexOf(theme)) % themesArr.length];
}
console.log("Slecting: " + nextTheme);
document.documentElement.setAttribute('data-theme', nextTheme);
localStorage.setItem('theme', nextTheme);
}
</script>
@ -58,6 +79,7 @@
<!-- <a href="/">Home</a> -->
<!-- <a href="/zhen/notes/physics/1?hideOnPrint=1" target="_blank" style="width: 7.5rem;">Notes</a> -->
<button class="cursor-pointer" on:click={nextTheme}> <Dices/></button>
<a href="/zhen/cv/rev2?hideOnPrint=1" target="_blank" style="width: 7.5rem;">Zhen CV</a>
<a href="/tools" style="width: 7.5rem;">Tools</a>
<a href="https://botalex.itch.io/" target="_blank">Games</a>