WordPress / wporg-theme-directory

12 stars 6 forks source link

Template column width: adjust center column pages. #134

Closed jasmussen closed 4 weeks ago

jasmussen commented 4 weeks ago

The current Page template has a max-width of 680px, center aligned:

Image

The grid of thumbnails has a max-width of 1160:

Image

Individual theme pages are also 1160:

Image

On pages like Commercial themes, the flow gets disrupted a little bit because both types of layout are present:

Image

The mix of these two causes a bit of a tipping layout. Suggestion: unify on 1160px across, but with a left aligned column for content, that's not quite full-wide. Here's an example from the original directory design:

Image

In that particular image, the left aligned column inside is 680px:

Image

This matches similar designs for Documentation:

Image

Whether it's 680 or something closer to the left-column width of theme permalinks, or even the 800px from the Learn mockups, the important part is that it's a left aligned column inside a container that's 1160px. Learn example:

Image

ndiego commented 4 weeks ago

I think this approach works. It would look like this. The Group just needs to be aligned wide and the justification set to left. The screenshot just shows the top of the page, but the bottom text would be the same.

image
ryelle commented 4 weeks ago

I can make that change, but I'm having trouble following all the screenshots above— is that the only change required here?

ryelle commented 4 weeks ago

Oh, does this need to happen for all pages?

jasmussen commented 4 weeks ago

Oh, does this need to happen for all pages?

I think that would be ideal. I don't think we have many pages where we have the 680px column plainly centered. It's always assumed to have either whitespace, or a sidebar (not present on the theme directory) in the area on the right.