Women-Coding-Community / wcc-frontend

MIT License
2 stars 4 forks source link

Landing: Hero Component #5

Closed stepsen89 closed 1 week ago

stepsen89 commented 2 weeks ago

Landing Page contains a hero component:

Review with design if reusability could be extended to also be able to be used for hero components with inverted sections (e.g. book-club) see https://www.figma.com/design/ncdevYZK7NGuTK3hc6mP4e/WCC-Platform-Material-UI-Designs?node-id=47909-2&t=4JC742BVuAwIdbiL-0

Image

taking in Title, subtitle and image (depends on view: mobile, tablet, phone)

lilyndk commented 2 weeks ago

Hi @MitaliShah,

I've added this 'yellow note' in Figma to map the hero component elements to the MUI ‘styling color and typography variables’. If we use those variables, the styles should closely align with the Figma designs once we add update the theme colors and typography styles (which I’m still working on defining).

Image

lilyndk commented 2 weeks ago

Since the hero border uses the same gradient styles as the footer gradient, we might want to consider creating a reusable 'gradient border' variable for that.