Jonas_Jones/wiki.jonasjones.dev
1
0
Fork 0
mirror of https://github.com/JonasunderscoreJones/wiki.jonasjones.dev.git synced 2025-10-23 14:19:18 +02:00
Code Issues Projects Releases Packages Wiki Activity

add working prefers-color-scheme implementation

Browse source
This commit is contained in:
J-onasJones 2023-09-16 23:52:25 +02:00
parent 57ab995f83
commit 91bdb91b62
6 changed files with 56 additions and 122 deletions
Download patch file Download diff file Expand all files Collapse all files

38
src/routes/+layout.svelte
View file

@ -2,32 +2,20 @@
import Header from '$lib/components/Header.svelte';
import Footer from '$lib/components/Footer.svelte';
import Navbar from '$lib/components/Navbar.svelte';
import { isDarkMode } from '$lib/stores/darkModeStore';
import '$lib/styles/style.css';
//change background color based on dark mode
//$: document.body.style.backgroundColor = $isDarkMode ? '#fff' : '#16181c';
</script>
<body style="background-color: {$isDarkMode ? '#fff' : '#16181c'};padding:0">
<div style="height:2rem"></div>
<Header />
<div class="container" class:invert={$isDarkMode}>
<div class="column"><Navbar /></div>
<div class="column content flex_grow" style="margin-left: 0;">
<main>
<slot />
<!-- Please god forgive me -->
<h1 style="color: #26292f;margin:0;padding:0" class="unselectable">YOU CANT SEE THIS YOU CANT SEE THIS YOU CANT SEE THIS YOU CANT SEE THIS</h1>
</main>
</div>
<div style="height:2rem"></div>
<Header />
<div class="container">
<div class="column"><Navbar /></div>
<div class="column content flex_grow" style="margin-left: 0;">
<main>
<slot />
<!-- Please god forgive me -->
<h1 style="color: var(--container-background-color);margin:0;padding:0" class="unselectable">YOU CANT SEE THIS YOU CANT SEE THIS YOU CANT SEE THIS YOU CANT SEE THIS</h1>
</main>
</div>
</div>
<div class:invert={$isDarkMode}>
<Footer />
</div>
<div style="height:2rem"></div>
</body>
<Footer />
<div style="height:2rem"></div>