feat(ComparisonSlider): move in/out animation to Section component

This commit is contained in:
Ilia Mashkov
2026-01-30 17:43:19 +03:00
parent 730eba138d
commit f0c0a9de45

View File

@@ -16,9 +16,7 @@ import {
createTypographyControl,
} from '$shared/lib';
import type { LineData } from '$shared/lib';
import { cubicOut } from 'svelte/easing';
import { Spring } from 'svelte/motion';
import { fly } from 'svelte/transition';
import CharacterSlot from './components/CharacterSlot.svelte';
import ControlsWrapper from './components/ControlsWrapper.svelte';
import Labels from './components/Labels.svelte';
@@ -180,7 +178,7 @@ $effect(() => {
aria-label="Font comparison slider"
onpointerdown={startDragging}
class="
group relative w-full py-16 px-0 sm:py-24 sm:px-0 overflow-hidden
group relative w-full py-16 px-24 sm:py-24 sm:px-24 overflow-hidden
rounded-[2.5rem]
select-none touch-none cursor-ew-resize min-h-100 flex flex-col justify-center
backdrop-blur-lg bg-gradient-to-br from-gray-100/70 via-white/50 to-gray-100/60
@@ -190,7 +188,6 @@ $effect(() => {
before:bg-gradient-to-br before:from-black/5 before:via-black/2 before:to-transparent
before:-z-10 before:blur-sm
"
in:fly={{ y: 0, x: -50, duration: 300, easing: cubicOut, opacity: 0.2 }}
>
<!-- Text Rendering Container -->
<div