Opened 11 years ago

Closed 10 years ago

Last modified 10 years ago

#201 closed defect (bug) (fixed)

Improve group tiling on homepage

Reported by: melchoyce's profile melchoyce Owned by:
Milestone: Priority: normal
Component: Make (Get Involved) / P2 Keywords: needs-patch


Right now, the groups are listed in rows, the height of which is determined by the taller tile in the row. This gets really awkward towards the bottom of the page:


  • Switch community and meta tiles so the height differences are less obvious
  • Or, define a min-height so all tiles are the same size
  • Best, use masonry.js ( so tiles flow together regardless of height

Attachments (1)

201.diff (774 bytes) - added by melchoyce 11 years ago.

Download all attachments as: .zip

Change History (11)

11 years ago

#1 @melchoyce
11 years ago

201.diff makes some small style tweaks to the Make homepage:

  • Increases top and bottom padding to the "get involved" section, giving the elements in some breathing room
  • Switches pts to ems
  • Increases line-height for better readability
  • Applies a min-height to each "get involved" group (not ideal — we should try masonry.js instead for seamless tiling)

PS — I made the diff from within the wporg-makehome directory.

Last edited 11 years ago by melchoyce (previous) (diff)

#2 @samuelsidler
11 years ago

  • Cc Otto42 added

Otto: Can we get these changes landed and deployed?

#3 @shaunandrews
11 years ago

  • Cc shaunandrews added

#4 @Otto42
11 years ago

Masonry is available to us as we're running WordPress trunk. So just wp_enqueue_script( 'jquery-masonry' ); and you will have the ability to use it in the theme.

I'll commit these changes in the meantime.

#5 @Otto42
11 years ago

In 103:

Add minor CSS tweaks to make home. props melchoyce. See #201

#6 @samuelsidler
11 years ago

  • Summary changed from Improve group tiling on to Improve group tiling on homepage

#7 @Otto42
10 years ago

In 547:

Kill the min-height, use masonry instead. See #201

#8 @Otto42
10 years ago

Was looking into the Masonry 3 code in 3.9 and remembered this one. So, switched it to use masonry.

Still not perfect at some smaller widths though. Not bad, admittedly. Maybe we should allow that container to be wider for widescreens as well, and expand the number of possible columns?

#9 @Otto42
10 years ago

  • Resolution set to fixed
  • Status changed from new to closed

Closing as fixed unless somebody has a better alternative. For design changes, open a new ticket.

This ticket was mentioned in IRC in #wordpress-meta by sams. View the logs.

10 years ago

Note: See TracTickets for help on using tickets.