fixed css
All checks were successful
Vercel Production Deployment / Deploy-Production (push) Successful in 1m40s
All checks were successful
Vercel Production Deployment / Deploy-Production (push) Successful in 1m40s
This commit is contained in:
parent
e31a64658e
commit
e0c0b9a887
@ -1,48 +0,0 @@
|
||||
<script>
|
||||
// On click function for darkmode switch
|
||||
import { browser } from '$app/environment';
|
||||
let darkMode = true;
|
||||
function handleSwitchDarkMode() {
|
||||
darkMode = !darkMode;
|
||||
localStorage.setItem('theme', darkMode ? 'dark' : 'light');
|
||||
darkMode
|
||||
? document.documentElement.classList.add('dark')
|
||||
: document.documentElement.classList.remove('dark');
|
||||
}
|
||||
if (browser) {
|
||||
if (
|
||||
localStorage.theme === 'dark' ||
|
||||
(!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)
|
||||
) {
|
||||
document.documentElement.classList.add('dark');
|
||||
darkMode = true;
|
||||
} else {
|
||||
document.documentElement.classList.remove('dark');
|
||||
darkMode = false;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div>
|
||||
<input checked={darkMode} on:click={handleSwitchDarkMode} type="checkbox" id="theme-toggle" />
|
||||
<label for="theme-toggle" />
|
||||
</div>
|
||||
|
||||
<style>
|
||||
#theme-toggle {
|
||||
@apply invisible;
|
||||
}
|
||||
|
||||
#theme-toggle + label {
|
||||
@apply inline-block cursor-pointer h-6 w-6 fixed top-4 right-4 rounded-full duration-300 content-[''];
|
||||
}
|
||||
|
||||
#theme-toggle:not(:checked) + label {
|
||||
@apply bg-yellow-200;
|
||||
}
|
||||
|
||||
#theme-toggle:checked + label {
|
||||
@apply bg-transparent;
|
||||
box-shadow: inset -7px -5px 1px 1px #ddd;
|
||||
}
|
||||
</style>
|
@ -1,7 +1,6 @@
|
||||
<script>
|
||||
import { blur } from 'svelte/transition';
|
||||
import '../app.css';
|
||||
import ThemeSwitch from '$lib/ThemeSwitch.svelte';
|
||||
import '../app.css';
|
||||
import CloudflareAnalytics from '../lib/CloudflareAnalytics.svelte';
|
||||
import { DarkMode } from 'flowbite-svelte';
|
||||
|
Loading…
Reference in New Issue
Block a user