Suitcase Mega Panel

Suitcase_Interim includes a flexible Panels layout called Mega Panels. Mega Panels adjusts the width of panes in a given row depending on the number of panes rendered is no empty space.

Structure

Mega Panels has two full width rows, and three rows with multiple columns. The column rows have six panes and is optimized for between two and four panes. The first and last panes in a row are Grow Panes, which will take up extra space. This allows, for example, a 2/3 column and 1/3 column. See the Mega Panels interactive demo.

See examples of some Mega Panels layouts at Luggage Docs

How to set up

Mega Panels comes with the latest version of Suitcase_Interim and requires the Drupal Panels module.

1. To change your panel, go to your panel's settings menu and click on the "Layout" tab. In the drop-down, select Suitcase: Mega Panels.

2. You can now add/remove/rearrange items in the Mega Panels panes. Remember, empty panes will not show up on the live page, and the other panes will grow to fill the available space.

Borders

Add a border to individual Panels panes by adding the panel-pane-bordered class to that pane.

1. Click on the gear on the pane and select Style > Change.
2. Select the 'Add Class' style
3. Add the panel-pane-bordered class in the field and save.