server/artcraft
1
0
Fork 0
mirror of https://github.com/storytold/artcraft.git synced 2026-10-20 17:02:53 -04:00
Code Issues Packages Projects Releases Wiki Activity

theme: suspend element transitions during the fade — no button flicker

Browse Source 
Element-level color transitions (invert-block's 120ms, the buttons'
transition-colors) re-target every frame against the animating tokens
during a theme fade — a visible stutter-chase on the secondary button
(the primary was immune only because its transition-opacity overrides
transition-colors). While .theme-anim is on, element transition
durations are zeroed and the root's token animation does all the
driving; everything restores when the class lifts.

Claude-Session: https://claude.ai/code/session_01YBoaBEt3gynzTwogBFtn4B
This commit is contained in:
Tanish Manku
2026-09-11 00:28:23 -07:00
parent 12d8da32d9
commit db05f628d0
1 changed files with 9 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/apps/artcraft-website-next/src/app/globals.css
+9
View File
@@ -167,6 +167,15 @@ html.theme-anim {
--scanline 0.4s ease;
}
/* While the theme fade runs, element-level transitions (invert-block's
120ms colors, the buttons' transition-colors) would re-target every
frame against the animating tokens — a visible stutter-chase. Suspend
them for the window; the root's token transition does all the driving,
and everything is restored when .theme-anim lifts (~0.45s). */
html.theme-anim body * {
transition-duration: 0s !important;
}
/* Intro-pending letter hide: stamped pre-paint by the head script when the
intro will play, so the wordmark never flashes complete before the
formation takes the letters. The formation and HeadingFlow write inline