Skip to content

New Homepage

Warren Gifford requested to merge brett/home into main

Created by: bretthayes

The new and improved homepage! ✨

Closes #5230 (closed)

Changelog and and notes:

  • The customer logos section is now static including more compressed and updated svg assets. Assets that were renamed or replaced were updated throughout the codebase. This Component is now used throughout the codebase as well, which replaces older customer logos sections.
  • On our contact pages, the Customer Logos component now stacks below the forms to drive more leads. Stacking the component below the forms prevents drop off rates through CTA flows due to bad UX. The logos were ordered at the top before.
  • Added a new copy icon for the common Install component. It's much prettier and there was no decently comparable mdi-react icon alternative. Some one-off styles were also introduced to match the Figma more accurately. We can convert to arbitrary values in Tailwind when we get to that in the replatform.
  • The common Install component was updated which introduced a few changes on the getting started self hosted page.
  • Removed code insights banner
  • Homepage sections are now separated into collocated sub components for the home page. They are much easier to manage this way. We should start to collocate and abstract more related sibling files and only include them in global directories (ie: components, static, etc.) if they are common/shared files.
  • Improved the integrations section rendering for easier updates in the future. Also updated the content based on comments from #5011 (closed). This closes #5011 (closed).
  • Added venus gradient from our brand guidelines
  • Added typography and positioning utility classes based on Tailwind conventions for more convenient future conversions in the replatform
  • Removed some unused stylesheets
  • Added mp4/webm video animations and compressed all assets by 85% with h.264
  • Added logic to play and pause video animations when they come in and out of view

Test

  • Design matches the Figma spec as close as possible, keeping in mind trade-offs, usage of bootstrap defaults and design consistency
  • Responsiveness is fluid
  • Build compiles

Merge request reports