Structure: Section Container

This component allows authors to group components and manage layouts.

Usage Criteria

This component helps authors manage the layout of content by grouping components into a width-adjustable container. It also helps to identify groups of content on a page for the purposes of creating a sub-section navigation (see Design Notes for more details).

Do's and Don'ts

• Use this component when looking to divide content into columns.
• Use this component when looking to center items that do not currently have that configuration.
• Do not use this container for components that are already resized (Once a component is inside a section container, it cannot be individually resized)

Design Notes

The Nav: Sub-section Nav component is heavily dependent on this container, which determines where a section of content ends and begins. The Structure: Section Container component is where the tabs for the sub-section navigation can be configured.

Configurable Options

This component is mainly used by dragging in and adding other components to the inside of the container.

In the container, the same methods apply as adding any component to a page (each individual component added needs to be configured, etc), with the exception that it occurs inside the box.

The section container also has a field for entering the title of the section (used by the Nav: Sub-section Nav), and a choice of 3 different formats: Standard, Card, and Card Centered. The card options offer inside padding and create space between columns if there are multiple section containers side by side in a row. Card Centered does this while also centering contents within the section container.

Developer Notes