mirror of
https://github.com/YouHaveTrouble/youhavetrouble.github.io.git
synced 2026-05-11 22:06:56 +00:00
delete light mode!!!!!!!!!!
This commit is contained in:
@@ -1,5 +1,4 @@
|
||||
---
|
||||
import ThemeToggleButton from './ThemeToggleButton.svelte';
|
||||
const { current = '' } = Astro.props;
|
||||
---
|
||||
|
||||
@@ -81,7 +80,4 @@ const { current = '' } = Astro.props;
|
||||
<a class={current === "projects" ? "selected" : ""} href='/projects'>projects</a>
|
||||
<a class={current === "blog" ? "selected" : ""} href='/blog'>blog</a>
|
||||
</div>
|
||||
<div class="theme-toggle-container">
|
||||
<ThemeToggleButton client:load />
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@@ -1,65 +0,0 @@
|
||||
<script>
|
||||
const rootEl = typeof document !== 'undefined' ? document.documentElement : null;
|
||||
const themes = ['light', 'dark'];
|
||||
let theme = ''
|
||||
|
||||
if (typeof localStorage !== 'undefined' && localStorage.getItem('theme')) {
|
||||
theme = localStorage.getItem('theme');
|
||||
} else if (typeof window !== 'undefined' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
theme = 'dark';
|
||||
}
|
||||
|
||||
function handleChange(event) {
|
||||
theme = event.target.value;
|
||||
localStorage.setItem('theme', theme);
|
||||
}
|
||||
|
||||
$: if (rootEl && theme === 'light') {
|
||||
rootEl.classList.remove('theme-dark');
|
||||
} else if (rootEl && theme === 'dark') {
|
||||
rootEl.classList.add('theme-dark');
|
||||
}
|
||||
|
||||
const icons = [
|
||||
`<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 20 20"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
</svg>`,
|
||||
`<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 20 20"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z" />
|
||||
</svg>`,
|
||||
];
|
||||
</script>
|
||||
|
||||
|
||||
<div class="theme-toggle">
|
||||
{#each themes as t, i}
|
||||
<label class={theme === t ? 'checked' : ''}>
|
||||
{@html icons[i]}
|
||||
<input
|
||||
type="radio"
|
||||
name="theme-toggle"
|
||||
checked={theme === t}
|
||||
value={t}
|
||||
title={`Use ${t} theme`}
|
||||
aria-label={`Use ${t} theme`}
|
||||
on:change={handleChange}
|
||||
/>
|
||||
</label>
|
||||
{/each}
|
||||
</div>
|
||||
Reference in New Issue
Block a user