Allow Concept of Section Wrappers

Problem/Motivation

At times, sections in a layout will need to be grouped by an HTML wrapper, such as <div> or <section>. Following are two such scenarios:

Problem 1

Themer needs a background texture or image to underlay several layout sections.

Problem 2

Themer needs flexibility to set differing container widths for different sections of the page. See sketch below.

Proposed resolution

• As the Field Group module wraps groups of fields with an HTML wrapper, so layout builder should be able to wrap one, several, or all layout sections with an HTML wrapper.
• In addition, layout builder users should be able to add settings to the wrapper via the settings tray, such as selecting the wrapper's HTML tag or adding classes to the wrapper.

Based on comment #10:

1. Create a "Group sections" link at the top of the layout builder.
2. That link should open in the off-canvas dialog and use a form to select sections to be group together, excluding any already grouped sections. Only sections next to each other should be groupable.
3. Also in that form, add whatever properties for the group.

Remaining tasks

User interface changes

Yes.

API changes

Data model changes

Release notes snippet