feat(ux): depth + entrance on shared EmptyState (visual craft)#139
Merged
Conversation
Give every empty/error/idle screen more personality: the icon now sits in a layered badge (a faint concentric halo behind a tinted tile) instead of a flat grey square, switched to the brand tint, and the group eases in — the badge springs (ZoomIn), the title/description/action rise with a short stagger. The root stays a plain View so flex-1 centering is never affected by the animation; only the inner pieces animate. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
First slice of the 视觉工艺 (visual craft) track. The shared
EmptyState(used on every empty/error/idle screen) was a flat grey square with a static icon. Now:ZoomIn), title/description/action rise with a short staggerThe root stays a plain
Viewsoflex-1centering is owned by layout, not the animation — only the inner pieces animate.Verification
tsc --noEmitclean,eslintclean, 1337 tests passAnimated.View, which brokeflex-1centering on web (empty state pinned top-left). Caught it in the browser preview and refactored to animate only the children — included here as the fix.🤖 Generated with Claude Code