Page MenuHomePhabricator

Bug: Homepage grid distorts layout regions at different breakpoints
Open, Needs TriagePublic

Description

Grid:

Problem
The page is changing too often and the different layout regions (primary call to action, the criteria, and the tags and footer) change in such a way that it distorts the overall layout.

Proposed fix:

    • Clearly define the layout regions
    • Since this appears to be responsive, define a few breakpoint sizes and then make sure that the design looks good in the smaller size. This means that screen sizes in between two defined breakpoint dimensions will inherit all dimensions of the breakpoint of smaller size.
  • Homepage description and Criteria list as a group should be at the center of the full width of the screen and both components should shrink/expand in width as the screen width changes

Buttons:

Problem:

  • They appear to be responsive and start at a very large size

Proposed fix:

  • Use OOUI
  • Mock up how the buttons should look in a few different screen sizes so that the engineers can see what it looks like in small, large, extra large breakpoint

Mockups

Designer to link mockups