search

NASA-IMPACT / veda-ui

Frontend for the Dashboard Evolution project
Other
25 stars 5 forks source link

Card image/description independent of hero image/description #1244

Closed dzole0311 closed 2 weeks ago

dzole0311 commented 2 weeks ago

Related Ticket: https://github.com/US-GHG-Center/veda-config-ghg/issues/636

Description of Changes

  1. Introduced new cardDescription and cardMedia props to enable customizable card content
  2. Implemented a fallback background color for cases where no media (e.g image source) is provided

These updates are applied across various places where the card component is used (story cards) but also layer cards in the Data Catalog and the E&A Catalog to better control displayed descriptions and images.

Notes & Questions About Changes

Validation / Testing

  1. Add cardDescription to the 'This is the life of water' story in the MDX configuration file
  2. Verify that /stories displays the newly added cardDescription on the card
  3. Click on the story -> verify that the hero section retains its previous description, separate from the card description
  4. Try the same with cardMedia
  5. Also try to remove both the cardMedia and the media prop -> verify that there's a fallback background color shown

Verify that the behavior below (copied from the issues' acceptance criteria) is applied:

  1. Story and dataset administrators can define a hero image and a card image separately from one another, within the mdx file
  2. Story and dataset administrators can define a hero description and a card description separately from one another, within the mdx file
  3. If a story or dataset does not have any hero or card images configured, then we default to a blank space of a solid primary color (like the blue hero for Data Catalog in GHGC)
  4. If a story or dataset has a hero image defined, but no card image defined, then the card image shows the hero image (like how it currently functions)
netlify[bot] commented 2 weeks ago

Deploy Preview for veda-ui ready!

Name Link
Latest commit 842216db03c105e148f958233dab3dec11d265c4
Latest deploy log https://app.netlify.com/sites/veda-ui/deploys/672dcf5470d3590008b0a217
Deploy Preview https://deploy-preview-1244--veda-ui.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.