feat(giveback): redesign Impact reward-ladder#6251
Merged
Conversation
Reworks the Impact tab's reward-ladder journey: rounded-square nodes, a single consistent green completed trail across nodes and connectors, a contrast-first palette (cabbage = live accent, green = done, summit gradient), the active goal as one coherent row, and the funded causes named in the heading. The claim celebration is now an expanding ring + sparkle burst (new claim-ring keyframe) that auto-clears and respects prefers-reduced-motion, replacing ConfettiSvg. The Impact panel drops the community-pot section, so the components that only served it are removed: GivebackCommunityGoalProgress and its now-dead GivebackSponsorBudgetBar + GivebackSponsorLogo, plus ConfettiSvg.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
The roadmap was one ~870-line file. Split by responsibility, no behavior change: - givebackRoadmapTypes.ts: shared RoadmapLevel / ConnectorFill / RoadmapNode - GivebackRoadmapRail.tsx: the Connector + RailToggle rail primitives - GivebackRoadmapNode.tsx: the NodeRow marker/claim rendering - GivebackPersonalRoadmap.tsx: the orchestrator (data shaping + layout)
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.
Changes
Third step of the giveback design pass from #6247 (PR 3/6). Redesigns the Impact tab's reward-ladder.
GivebackPersonalRoadmapreworked: rounded-square nodes, a single consistent green "completed" trail across nodes and connectors, a contrast-first palette (cabbage = the live accent for you/your next goal/claimable, green = done, summit gradient for the big one, locked stays muted), the active goal rendered as one coherent row, and the causes you're funding named in the heading.claim-ringkeyframe) that auto-clears after it plays (so it can replay) and respectsprefers-reduced-motion. This replaces the old confetti SVG.GivebackImpactPaneldrops the community-pot section; the tab is now purely the personal reward-ladder journey.Dead code removed (cascade from dropping the community section)
ConfettiSvg— only the roadmap used itGivebackCommunityGoalProgress— only the Impact panel used itGivebackSponsorBudgetBar— onlyCommunityGoalProgressused itGivebackSponsorLogo— onlySponsorBudgetBarused it(The last two were already dead in the #6247 source; cleaned up here.)
Scope notes
claim-ringkeyframe is added totailwind.config.ts; the funnel/coin animations from feat(giveback): full design pass — warm-up funnel, reward-ladder impact, causes tab #6247 belong with the funnel PR (PR5).Verification
tsc: no new errors (27 pre-existing, unrelated)Preview domain
https://feat-giveback-impact-ladder.preview.app.daily.dev