OpenWebUI/open-webui-custom
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refac

Browse Source
This commit is contained in:
Timothy Jaeryang Baek
2025-08-07 01:19:34 +04:00
parent 6598812a25
commit 73c92e2e3e
2 changed files with 49 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/lib/components/common/Switch.svelte
View File

@@ -1,26 +1,34 @@
<script lang="ts">
import { createEventDispatcher, tick } from 'svelte';
import { createEventDispatcher, tick, getContext } from 'svelte';
import { Switch } from 'bits-ui';
import { settings } from '$lib/stores';
import Tooltip from './Tooltip.svelte';
export let state = true;
export let id = '';
export let tooltip = false;
const i18n = getContext('i18n');
const dispatch = createEventDispatcher();
$: dispatch('change', state);
</script>
<Switch.Root
bind:checked={state}
{id}
class="flex h-5 min-h-5 w-9 shrink-0 cursor-pointer items-center rounded-full px-[3px] mx-[1px] transition {($settings?.highContrastMode ??
false)
? 'focus:outline focus:outline-2 focus:outline-gray-800 focus:dark:outline-gray-200'
: 'outline outline-1 outline-gray-100 dark:outline-gray-800'} {state
? ' bg-emerald-600'
: 'bg-gray-200 dark:bg-transparent'}"
<Tooltip
content={tooltip ? (state ? $i18n.t('Enabled') : $i18n.t('Disabled')) : ''}
placement="top"
>
<Switch.Thumb
class="pointer-events-none block size-4 shrink-0 rounded-full bg-white transition-transform data-[state=checked]:translate-x-3.5 data-[state=unchecked]:translate-x-0 data-[state=unchecked]:shadow-mini "
/>
</Switch.Root>
<Switch.Root
bind:checked={state}
{id}
class="flex h-5 min-h-5 w-9 shrink-0 cursor-pointer items-center rounded-full px-[3px] mx-[1px] transition {($settings?.highContrastMode ??
false)
? 'focus:outline focus:outline-2 focus:outline-gray-800 focus:dark:outline-gray-200'
: 'outline outline-1 outline-gray-100 dark:outline-gray-800'} {state
? ' bg-emerald-600'
: 'bg-gray-200 dark:bg-transparent'}"
>
<Switch.Thumb
class="pointer-events-none block size-4 shrink-0 rounded-full bg-white transition-transform data-[state=checked]:translate-x-3.5 data-[state=unchecked]:translate-x-0 data-[state=unchecked]:shadow-mini "
/>
</Switch.Root>
</Tooltip>