WordPress / wporg-news-2021

The WordPress.org News Theme
https://wordpress.org/news/
31 stars 21 forks source link

Reduce the height of the homepage header. #413

Closed StevenDufresne closed 9 months ago

StevenDufresne commented 9 months ago

Fixes #394.

This removes the margin from the header to bring more of the content into view. It doesn't completely match the design in the original issue. All those components are not present anymore or at least with the latest post.

Before After
localhost_8888_ (5) localhost_8888_ (3)

Considerations

The "News" isn't completely centered in the top container because the subnav is the same color. That matches newer designs of developer.wordpress.org and documentation. Does that work? I can remove padding from the top of the section to make it even. Looks fine to me though.

adamwoodnz commented 9 months ago

All that said, on the 3 most common monitor sizes it looks ok

Screenshots

1: 1920x1080 2: 1366x768 3: 1536x864
localhost_8888_(1 1920x1080) localhost_8888_(2 1366x768) localhost_8888_(3 1536x864)
StevenDufresne commented 9 months ago

I agree, seeing only white under the top isn't ideal. I can update to not use padding but instead viewport units.

In terms of the example screenshot, I think we should be showing the first latest post.

StevenDufresne commented 9 months ago

Hmm, the brush smear is on the h1. Updating to viewport units is a bigger task than I would have thought. I think I'll merge this as-is, someone can follow up with additional changes.