refac
This commit is contained in:
@@ -30,19 +30,19 @@
|
||||
{id}
|
||||
aria-labelledby={ariaLabelledbyId || undefined}
|
||||
aria-label={ariaLabel || undefined}
|
||||
class="flex h-[1.125rem] min-h-[1.125rem] w-8 shrink-0 cursor-pointer items-center rounded-full px-1 mx-[1px] transition {($settings?.highContrastMode ??
|
||||
class="relative h-4 min-h-4 w-7 shrink-0 cursor-pointer rounded-full mx-[1px] transition-colors duration-150 {($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-500 dark:bg-emerald-700'
|
||||
: 'bg-gray-200 dark:bg-transparent'}"
|
||||
: 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-400 dark:focus-visible:outline-gray-500'} {state
|
||||
? 'bg-gray-900 dark:bg-white'
|
||||
: 'bg-gray-300 dark:bg-gray-700'}"
|
||||
onCheckedChange={async () => {
|
||||
await tick();
|
||||
dispatch('change', state);
|
||||
}}
|
||||
>
|
||||
<Switch.Thumb
|
||||
class="pointer-events-none block size-3 shrink-0 rounded-full bg-white transition-transform data-[state=checked]:translate-x-3 data-[state=unchecked]:translate-x-0 data-[state=unchecked]:shadow-mini "
|
||||
class="pointer-events-none absolute top-[0.125rem] block h-3 w-3 shrink-0 rounded-full transition-all duration-150 data-[state=checked]:left-[0.875rem] data-[state=checked]:bg-white data-[state=checked]:dark:bg-black data-[state=unchecked]:left-[0.125rem] data-[state=unchecked]:bg-white data-[state=unchecked]:dark:bg-gray-500"
|
||||
/>
|
||||
</Switch.Root>
|
||||
</Tooltip>
|
||||
|
||||
Reference in New Issue
Block a user