Women-Coding-Community / wcc-frontend

Frontend for Women Coding Community Platform Project
MIT License
5 stars 13 forks source link

Landing: Hero Component #5

Closed stepsen89 closed 5 months ago

stepsen89 commented 5 months 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 5 months 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 5 months 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.