feat(CharacterSlot): remove touch from characters

This commit is contained in:
Ilia Mashkov
2026-02-12 12:20:06 +03:00
parent f2e8de1d1d
commit d282448c53

View File

@@ -3,8 +3,6 @@
Renders a character with particular styling based on proximity, isPast, weight, fontAName, and fontBName.
-->
<script lang="ts">
import { appliedFontsManager } from '$entities/Font';
import { getFontUrl } from '$entities/Font/lib';
import { cn } from '$shared/shadcn/utils/shadcn-utils';
import { comparisonStore } from '../../../model';
@@ -28,33 +26,6 @@ let { char, proximity, isPast }: Props = $props();
const fontA = $derived(comparisonStore.fontA);
const fontB = $derived(comparisonStore.fontB);
const typography = $derived(comparisonStore.typography);
$effect(() => {
if (!fontA || !fontB) {
return;
}
const urlA = getFontUrl(fontA, typography.weight);
const urlB = getFontUrl(fontB, typography.weight);
if (!urlA || !urlB) {
return;
}
appliedFontsManager.touch([{
id: fontA.id,
weight: typography.weight,
name: fontA.name,
url: urlA,
isVariable: fontA.features.isVariable,
}, {
id: fontB.id,
weight: typography.weight,
name: fontB.name,
url: urlB,
isVariable: fontB.features.isVariable,
}]);
});
</script>
{#if fontA && fontB}
@@ -67,13 +38,18 @@ $effect(() => {
style:font-weight={typography.weight}
style:font-size={`${typography.renderedSize}px`}
style:transform="
scale({1 + proximity * 0.3})
translateY({-proximity * 12}px)
rotateY({proximity * 25 * (isPast ? -1 : 1)}deg)
scale({1 + proximity * 0.3}) translateY({-proximity * 12}px) rotateY({proximity *
25 *
(isPast ? -1 : 1)}deg)
"
style:filter="brightness({1 + proximity * 0.2}) contrast({1 + proximity * 0.1})"
style:text-shadow={proximity > 0.5 ? '0 0 15px rgba(99,102,241,0.3)' : 'none'}
style:will-change={proximity > 0 ? 'transform, font-family, color' : 'auto'}
style:filter="brightness({1 + proximity * 0.2}) contrast({1 +
proximity * 0.1})"
style:text-shadow={proximity > 0.5
? '0 0 15px rgba(99,102,241,0.3)'
: 'none'}
style:will-change={proximity > 0
? 'transform, font-family, color'
: 'auto'}
>
{char === ' ' ? '\u00A0' : char}
</span>
@@ -84,7 +60,7 @@ span {
/*
Optimize for performance and smooth transitions.
step-end logic is effectively handled by binary font switching in JS.
*/
*/
transition:
font-family 0.15s ease-out,
color 0.2s ease-out,