docs(homepage): rewrite keyframe showcase with springy loop#7
Merged
tilucasoli merged 2 commits intomainfrom Apr 16, 2026
Merged
docs(homepage): rewrite keyframe showcase with springy loop#7tilucasoli merged 2 commits intomainfrom
tilucasoli merged 2 commits intomainfrom
Conversation
Replace the trigger-driven heart pop with a continuously looping Motion-style showcase that combines scale, rotate, border-radius, and color tracks. Uses springWithBounce for the transforms, ColorTween to animate between deepPurple.shade300 and shade900, and a trailing hold segment on each track to emulate Motion's repeatDelay. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
|
To view this pull requests documentation preview, visit the following URL: Documentation is deployed and generated using docs.page. |
Contributor
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Shrink the max scale from 2.0 to 1.5 for a subtler pop, and cut the repeat-delay hold from 1500ms to 600ms on all four tracks so the loop restarts sooner. Cycle is now ~3.6s. Co-Authored-By: Claude Opus 4.7 <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.
Summary
Replaces the trigger-driven heart-pop on the homepage with a continuously looping Motion-inspired showcase — the box scales 1→2→1, rotates 0→180→0, morphs between a rounded square and a circle, and shifts between lighter and darker
deepPurpleshades. UsesspringWithBounceon the transform segments (plusColorTweenfor color), with a trailing hold on each track to emulate Motion'srepeatDelay.Test plan
dart analyzeinpackages/mix_docs_previewis cleanhomepage/animationpreview and confirm the loop feels springy and paces correctly (~3s animation + 1.5s delay)🤖 Generated with Claude Code