-
Notifications
You must be signed in to change notification settings - Fork 419
Interactive Dynamic Progress Steps Ribbon Selector #6739
Copy link
Copy link
Closed
Labels
GSSoC-26Official GSSoC 2026 issueOfficial GSSoC 2026 issueacceptedContribution approved for integration into EaseMotion CSSContribution approved for integration into EaseMotion CSSanimationAnimation effects, hover interactions, motion ideas, transitionsAnimation effects, hover interactions, motion ideas, transitionsgood first issueGood for newcomersGood for newcomersgssoc:approvedApproved for GSSoC contributionsApproved for GSSoC contributionshelp wantedExtra attention neededExtra attention neededlevel:intermediateRequires moderate project understandingRequires moderate project understanding
Metadata
Metadata
Assignees
Labels
GSSoC-26Official GSSoC 2026 issueOfficial GSSoC 2026 issueacceptedContribution approved for integration into EaseMotion CSSContribution approved for integration into EaseMotion CSSanimationAnimation effects, hover interactions, motion ideas, transitionsAnimation effects, hover interactions, motion ideas, transitionsgood first issueGood for newcomersGood for newcomersgssoc:approvedApproved for GSSoC contributionsApproved for GSSoC contributionshelp wantedExtra attention neededExtra attention neededlevel:intermediateRequires moderate project understandingRequires moderate project understanding
The Component Gap: The repository lacks a lightweight wizard or sign-up onboarding progress ribbon that lights up past steps, indicates current positions, and transitions form content views without relying on JavaScript event frameworks.
The Solution: Engineer a multi-stage wizard layout using hidden input radio choices wrapped inside semantic checkbox button tracks. By utilizing standard CSS adjacent and general sibling combinators (input:checked ~ .step-node), step status highlights and connecting bridge line fills recalculate and animate smoothly across the workspace.