src/lib/Settings/SettingToggle.svelte


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

<script lang="ts">
  import Spacer from '$lib/Layout/Spacer.svelte';
  import settings, { type Settings } from '$stores/settings';

  export let setting: keyof Settings;
  export let on = '';
  export let off = '';
  export let sectionBreak = false;
  export let disabled = false;
</script>

<a
  href={'#'}
  onclick={() =>
    disabled
      ? {}
      : $settings[setting]
        ? settings.setKey(setting, false)
        : settings.setKey(setting, true)}
>
  {#if disabled}
    <strike>
      {$settings[setting] ? on : off}
      <slot />
    </strike>
  {:else}
    {$settings[setting] ? on : off}
    <slot />
  {/if}
</a>

<br />

{#if sectionBreak}
  <Spacer />
{/if}