MetricsDAO / xyz

MetricsDAO XYZ Website
https://metricsdao.xyz
Apache License 2.0
12 stars 8 forks source link

UI Improvements: Completed vs active challenges, counters and page scrolling #622

Closed thekakamora closed 1 year ago

thekakamora commented 1 year ago

User Impacted

0x20e0F0d4FFfB9A8b4C6d48F68b1058A294503886

Discord ID (including number)

kakamora#2549

Workflow Impacted

Analyze

Feature Impacted

Create Marketplace

Issue description

  1. Can you please consider distinguishing completed vs active challenges on UI?
  2. Also the count of challenges is still off. We have two challenges but the screeshot shows 3.
  3. click on tabs "Challenges", "Prerequisites" and "Rewards" scrolls the page to the top. We are forced to scroll down to view details.

image

Blocking

no it is not

Relevant log output

No response

gnomadic commented 1 year ago

couple things in here, cc @elisemarika

2 is good - that's a known issue!

1 - @mahgillis and @A4x1 heads up we should take a pass on styling completed vs active challenges differently that's noticeable at a glance - not sure timing on this but we can figure it out

3 - @termaatFlipside do you think we can stash scroll position and keep it (if possible) when changing tabs?

elisemarika commented 1 year ago

moving to In Design so we can at least solve styling on completed vs. active ASAP - I was thinking that yesterday! @mahgillis @A4x1

termaatFlipside commented 1 year ago

@gnomadic Yeah can probably do that scrolling bit

mahgillis commented 1 year ago

Here's my suggestion to distinguish between active and past challenges: https://www.figma.com/file/66Myyf1MVmY8UKv7BrVUa5/MDAO-App-Designs?node-id=6352%3A17489&t=dvpyUN5VgzIUvgkk-1

elisemarika commented 1 year ago

@termaatFlipside scope for this issue for now

sebruiz commented 1 year ago

@termaatFlipside Can probably use this attribute for the scrolling: https://reactrouter.com/en/main/components/link#preventscrollreset

elisemarika commented 1 year ago

@termaatFlipside are you still working on greying out the past challenges? note all styling to differentiate active vs. completed challenges: https://www.figma.com/file/66Myyf1MVmY8UKv7BrVUa5/MDAO-App-Designs?node-id=6357-18317&t=uWisrLq78wXKdE4m-0

termaatFlipside commented 1 year ago

@elisemarika yeah that's on the todo list