This commit is contained in:
Pagwin 2025-09-04 16:30:29 -04:00
parent 4bde55ad64
commit 6d33421164
2 changed files with 30 additions and 1 deletions

View file

@ -11,28 +11,53 @@
<body> <body>
<style> <style>
p {
max-width: 66ch;
}
@media (prefers-color-scheme: light) { @media (prefers-color-scheme: light) {
:root { :root {
--pico-color: black; --pico-color: black;
--pico-background-color: white; --pico-background-color: white;
& .red {
color: black;
background: red;
}
} }
:root:has(body.toggled) { :root:has(body.toggled) {
--pico-color: white; --pico-color: white;
--pico-background-color: black; --pico-background-color: black;
& .red {
color: red;
background: black;
} }
}
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
:root { :root {
--pico-color: white; --pico-color: white;
--pico-background-color: black; --pico-background-color: black;
& .red {
color: red;
background: black;
}
} }
:root:has(body.toggled) { :root:has(body.toggled) {
--pico-color: black; --pico-color: black;
--pico-background-color: white; --pico-background-color: white;
& .red {
color: black;
background: red;
}
} }
} }
@ -67,7 +92,9 @@
await navigator.serviceWorker.register("sw.js"); await navigator.serviceWorker.register("sw.js");
</script> </script>
<p>Here is some example text</p> <p>Don't copy this code at all, it is for demo purposes only and is terrible code. <span class="red">Note: if you
hard refresh you will get your system preference of light/dark due to this demo being powered by a service
worker</span></p>
<form action="./light-dark-toggle" method="get"> <form action="./light-dark-toggle" method="get">
<input id="full-demo" type="submit" value="Fully enhanced demo"> <input id="full-demo" type="submit" value="Fully enhanced demo">
</form> </form>

View file

@ -20,6 +20,8 @@ self.addEventListener("fetch", event =>{
async function handle_redirect(req){ async function handle_redirect(req){
const go_back_to = req.headers.get('Referer') || '/';; const go_back_to = req.headers.get('Referer') || '/';;
console.log("ref:",req.headers.get('Referer'), go_back_to);
console.log("headers:",req.headers)
const db_req = self.indexedDB.open("light-dark-store"); const db_req = self.indexedDB.open("light-dark-store");