wevote / WebApp

We Vote's javascript (client-side) mobile website built with React/Flux. Twitter: @WeVote Apple Store: https://itunes.apple.com/us/app/we-vote-voter-guide/id1347335726 Android: https://play.google.com/store/apps/details?id=org.wevote.cordova&hl=en_US
94 stars 301 forks source link

Wv 583 place joined and days left over challenge images on challenge home page #4107

Closed itcreativeusa closed 3 weeks ago

itcreativeusa commented 3 weeks ago

Fixed 'Joined and Days Left' over challenge images on the Challenge home page. IMPORTANT After facing limitations adding this functionality through src/js/common/components/ChallengeListRoot/ChallengeCardForListBody.jsx, I integrated the feature directly into src/js/common/components/ChallengeListRoot/ChallengeCardList.jsx.

1) Created a custom-styled component JoinAndDaysForChallengePage specifically for the ChallengeCardList.jsx page, allowing absolute positioning and unique styles without affecting other components using JoinedAndDaysLeft. 2) Added DesignTokenColors in JoinedAndDaysLeft for consistent styles usage across the application. 3) Updated ChallengeCardList.jsx to import and use the JoinAndDaysForChallengePage styled component, positioning it correctly over the challenge card image.

itcreativeusa commented 3 weeks ago

https://github.com/user-attachments/assets/795d78a7-d500-47dc-bad8-7eb16032eca6

DaleMcGrew commented 3 weeks ago

👍