diff --git a/src/uix/eidos/generated/base.css b/src/uix/eidos/generated/base.css index fc42da4cd..bef0714f0 100644 --- a/src/uix/eidos/generated/base.css +++ b/src/uix/eidos/generated/base.css @@ -734,7 +734,7 @@ --checkbox-focus-ring: 0 0 0 var(--checkbox-focus-ring-offset) var(--checkbox-focus-ring-surface), 0 0 0 calc(var(--checkbox-focus-ring-offset) + var(--checkbox-focus-ring-width)) var(--checkbox-focus-ring-color); --checkbox-transition-duration: var(--duration-fast); --checkbox-transition-ease: var(--ease-default); - --checkbox-stroke-duration: 220ms; + --checkbox-stroke-duration: var(--duration-fast); --checkbox-stroke-ease: cubic-bezier(0.4, 0, 0.2, 1); --checkbox-bg-off: var(--color-surface-default); --checkbox-bg-off-hover: color-mix( in srgb, var(--color-surface-default) 82%, var(--color-surface-overlay) ); diff --git a/src/uix/eidos/lib/recipes/base.ts b/src/uix/eidos/lib/recipes/base.ts index 57f9f8242..3592fd055 100644 --- a/src/uix/eidos/lib/recipes/base.ts +++ b/src/uix/eidos/lib/recipes/base.ts @@ -660,7 +660,9 @@ export const THEME_BASE_RECIPE_TOKENS = { '0 0 0 var(--checkbox-focus-ring-offset) var(--checkbox-focus-ring-surface), 0 0 0 calc(var(--checkbox-focus-ring-offset) + var(--checkbox-focus-ring-width)) var(--checkbox-focus-ring-color)', 'transition-duration': 'var(--duration-fast)', 'transition-ease': 'var(--ease-default)', - 'stroke-duration': '220ms', + // Checkmark stroke draw — synced with the box transition (--duration-fast). + // Was a hardcoded 220ms, which read as laggy next to the 120ms box fill. + 'stroke-duration': 'var(--duration-fast)', 'stroke-ease': 'cubic-bezier(0.4, 0, 0.2, 1)', 'bg-off': 'var(--color-surface-default)', 'bg-off-hover':