Homepage UI redesign

[sophiakc]

👓 See wireframe in Figma + get CSS attributes Get assets from the Openfarm Public folder

Priority:

• [x] Navbar: call to action + pages
• [x] Search bar
• [x] Header image
• [ ] Change text for each thumbnails based on the wires

Secondary:

• [ ] Font family, size, style, color (cf. guidelines for the whole website)
• [ ] Change images for each thumbnail
• [ ] Interface Architecture: by default going to the "search page" based on the criteria selected

[anant-dev]

@sophiakc I would like to help make this

[simonv3]

That's awesome @anant-dev what particular part of it interests you?

[anant-dev]

@simonv3 for starting i could help you with front end and you can guide me for the rest

[simonv3]

Cool! do you want to take a stab at the nav bar?

[nickedwards109]

@anant-dev there is at least one CSS rule in app/assets/stylesheets/styles/components/_nav.scss that uses the undesirable !important as a work-around to handle the colors of the existing nav bar buttons on the top right of the homepage. If you work on changing the styling to @sophiakc's graphic, it could be a good chance to see if any !importants (or entire rules) can be removed to simplify and improve the style of the CSS code.

[sophiakc]

Hey @anant-dev how are things going? Do you have any questions, concerns, feedbacks?

[anyangocynthia]

@sophiakc Do we need to retain the "Become a member" button for new users? I see its not included in the design

[sophiakc]

@anyangocynthia Indeed, no. The new wireframe is on purpose not including "become a member".

[anyangocynthia]

@sophiakc thanks for the feedback. @simonv3 There is a search box on the nav bar , as per the new designs it is not there should I include it?

[simonv3]

New designs are canonical!