Style Guide

BLOCKS

This is the “Intro Section” block pattern. It is added by default at the start of a page.

Once you add an image, you may want to adjust the size in the right sidebar. If you don’t need this block for this page, just delete it. If you want to add it back, click to add a new block and search for “intro section”. It should only be used as the very first block on the page, due to its overlap settings. If you want to use a similar block in the middle of the page, try the “Media + Text” block, or the “Overlapping Images” block.

“Overlapping Images” block

To add this block, search for “Overlapping Images”. Then click the block and use the settings in the right sidebar to add your photos, change the layout from 2 to 3 photos, add a caption, or swap the photos from left to right. You’ll add whatever content you need right here in the page like usual.

If you want this section to overlap the section above it, look for the “Advanced” tab on this block’s settings, then add the CSS class “overlap” into the field.You may want to play around with the vertical alignment dropdown if you find the text is overlapping the section below it. In general, you want the text to be shorter than the images if you plan to have the whole section overlap another section, as shown below.

This is the “pullquote” block. If you want this block to overlap the section above it, look for the “Advanced” tab on this block’s settings, then add the CSS class “overlap” into the field. Because this section has a background it will actually “underlap” the section.

Dev