Format files
This commit is contained in:
parent
2eb6a9c0ba
commit
ccc7a897d5
|
@ -1,35 +1,35 @@
|
|||
<script lang="ts" context="module">
|
||||
export const themes = ["light", "dark"] as const
|
||||
export type Theme = (typeof themes)[number]
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
import { slide } from "svelte/transition"
|
||||
let { theme } = $props<{ theme: Theme }>()
|
||||
|
||||
function toggleTheme() {
|
||||
const currentIndex = themes.indexOf(theme)
|
||||
theme = themes[(currentIndex + 1) % themes.length]
|
||||
}
|
||||
|
||||
let icon = $derived.by(() => {
|
||||
if (theme === "light") return "🌞"
|
||||
if (theme === "dark") return "🌙"
|
||||
})
|
||||
</script>
|
||||
|
||||
{#key theme}
|
||||
<button transition:slide={{ axis: "x" }} onclick={toggleTheme}>
|
||||
{icon}
|
||||
</button>
|
||||
{/key}
|
||||
|
||||
<slot />
|
||||
|
||||
<style lang="postcss">
|
||||
button {
|
||||
@apply absolute top-0 right-0;
|
||||
@apply text-3xl;
|
||||
@apply cursor-pointer;
|
||||
}
|
||||
</style>
|
||||
<script lang="ts" context="module">
|
||||
export const themes = ["light", "dark"] as const
|
||||
export type Theme = (typeof themes)[number]
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
import { slide } from "svelte/transition"
|
||||
let { theme } = $props<{ theme: Theme }>()
|
||||
|
||||
function toggleTheme() {
|
||||
const currentIndex = themes.indexOf(theme)
|
||||
theme = themes[(currentIndex + 1) % themes.length]
|
||||
}
|
||||
|
||||
let icon = $derived.by(() => {
|
||||
if (theme === "light") return "🌞"
|
||||
if (theme === "dark") return "🌙"
|
||||
})
|
||||
</script>
|
||||
|
||||
{#key theme}
|
||||
<button transition:slide={{ axis: "x" }} onclick={toggleTheme}>
|
||||
{icon}
|
||||
</button>
|
||||
{/key}
|
||||
|
||||
<slot />
|
||||
|
||||
<style lang="postcss">
|
||||
button {
|
||||
@apply absolute top-0 right-0;
|
||||
@apply text-3xl;
|
||||
@apply cursor-pointer;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -24,4 +24,3 @@
|
|||
@apply bg-background text-foreground;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
</main>
|
||||
|
||||
<style lang="postcss">
|
||||
main {
|
||||
main {
|
||||
@apply text-center;
|
||||
@apply mx-auto my-64;
|
||||
}
|
||||
|
|
|
@ -135,9 +135,7 @@
|
|||
|
||||
<main>
|
||||
<div>
|
||||
<h1>
|
||||
Prevent CVS
|
||||
</h1>
|
||||
<h1>Prevent CVS</h1>
|
||||
{#if $state !== "Ready"}
|
||||
<p>{$state}</p>
|
||||
<p>Time left until end of break: {$timeLeftDisplay}</p>
|
||||
|
@ -145,14 +143,11 @@
|
|||
<p>Time left until break: {$timeLeftDisplay}</p>
|
||||
{/if}
|
||||
{#if $state !== "Ready"}
|
||||
<button
|
||||
on:click={skipBreak}>Skip Break</button
|
||||
>
|
||||
<button on:click={skipBreak}>Skip Break</button>
|
||||
{/if}
|
||||
</div>
|
||||
</main>
|
||||
|
||||
|
||||
<style lang="postcss">
|
||||
main {
|
||||
@apply text-center;
|
||||
|
|
|
@ -3,7 +3,6 @@ import { vitePreprocess } from "@sveltejs/vite-plugin-svelte"
|
|||
|
||||
/** @type {import('@sveltejs/kit').Config} */
|
||||
const config = {
|
||||
|
||||
// vitePlugin: {
|
||||
// dynamicCompileOptions({filename}){
|
||||
// if(filename.includes('node_modules')){
|
||||
|
@ -13,8 +12,8 @@ const config = {
|
|||
// },
|
||||
|
||||
// compilerOptions: {
|
||||
// runes: true
|
||||
// },
|
||||
// runes: true
|
||||
// },
|
||||
|
||||
// Consult https://kit.svelte.dev/docs/integrations#preprocessors
|
||||
// for more information about preprocessors
|
||||
|
|
Loading…
Reference in New Issue