Themed modals

Modal - basic content

• Basic text content

Modal - top image left - theme--a

• Image (any ratio) at the top
• Image width is set by column
• Image to the left of the title
• 'theme--a' class applied to modal

Modal - top image right

• Image (any ratio) at the top
• Image width is set by column
• Image to the right of the title

Modal - top image - theme--b

• Full-width image (any ratio) above the title
• 'theme--b' class applied to modal

Modal - iframe content

• iFrame with content from another source.
• We can't directly style iFrame content from another source
• Javascript listener will try to set the iframe height based on the content.
• iFrame min-height can be set via CMS (inline style).

Modal - content + iframe

• Combined content and iFrame
• iFrame with content from another source.
• We can't directly style iFrame content from another source
• Javascript listener will try to set the iframe height based on the content.
• iFrame min-height can be set via CMS (inline style).