Dynamic Progress bar
derogative404 opened this issue · comments
Description
As a user
I want to view a progress bar on the leaderboard page
So that I can understand how far I am from the next prize
Proposed Solution
Acceptance Criteria
- Designed as per Figma layout
- Route to be used is
/leaderboard
- Max height is 5 and min height is 0
- height is set as a variable and can be adjusted to make the progress bar dynamic
- Airplane travels with the top of the progress bar
- When the progress is full (aka height is 5), airplane is no longer visible and user routed to the "Leaderboard page - achieved a prize"
- prizes achieved counter should go up by 1 whenever the height is 5
- Redeem prize button is greyed out till bar height is 5. Then it becomes active
- Once redeem prize button is clicked, user routed to
leaderboard-prize
Notes
completed