diff --git a/frontend/src/lib/components/Toggle.svelte b/frontend/src/lib/components/Toggle.svelte index bb53bd81c0..088cfffe29 100644 --- a/frontend/src/lib/components/Toggle.svelte +++ b/frontend/src/lib/components/Toggle.svelte @@ -18,7 +18,7 @@ export let id = (Math.random() + 1).toString(36).substring(10) export let lightMode: boolean = false - export let size: 'sm' | 'xs' = 'sm' + export let size: 'sm' | 'xs' | '2xs' = 'sm' const dispatch = createEventDispatcher() const bothOptions = Boolean(options.left) && Boolean(options.right) @@ -37,7 +37,7 @@ class={twMerge( 'mr-2 font-medium duration-50 select-none', bothOptions || textDisabled ? (checked ? 'text-disabled' : 'text-primary') : 'text-primary', - size === 'xs' ? 'text-xs' : 'text-sm', + size === 'xs' ? 'text-xs' : size === '2xs' ? 'text-[0.5rem]' : 'text-sm', textClass )} style={textStyle} @@ -74,6 +74,8 @@ : 'peer-checked:bg-nord-950 dark:peer-checked:bg-nord-400', size === 'sm' ? 'w-11 h-6 after:top-0.5 after:left-[2px] after:h-5 after:w-5' + : size === '2xs' + ? 'w-5 h-3 after:top-0.5 after:left-[2px] after:h-2 after:w-2' : 'w-7 h-4 after:top-0.5 after:left-[2px] after:h-3 after:w-3' )} /> diff --git a/frontend/src/lib/components/graph/renderers/triggers/TriggersWrapper.svelte b/frontend/src/lib/components/graph/renderers/triggers/TriggersWrapper.svelte index 6b5fcdf819..3bf1073ae1 100644 --- a/frontend/src/lib/components/graph/renderers/triggers/TriggersWrapper.svelte +++ b/frontend/src/lib/components/graph/renderers/triggers/TriggersWrapper.svelte @@ -16,8 +16,7 @@ import type { GraphEventHandlers } from '../../graphBuilder' import { twMerge } from 'tailwind-merge' import MapItem from '../../../flows/map/MapItem.svelte' - import { fade, scale } from 'svelte/transition' - import { flip } from 'svelte/animate' + import Toggle from '$lib/components/Toggle.svelte' export let path: string export let isEditor: boolean @@ -239,19 +238,25 @@ {/each} {#if data.flowIsSimplifiable} -