Home

Style Guide

Typography

Colors

Buttons

The Grid

Forms

BaseComponents

Components

cta card component

IMAGES:

We recommend a minimum image width of 768px for this component.

RULES & DEPENDENCIES:

This component will have fields for:

Image (optional)
Alternative Image Text (optional but recommended if an image is provided)
Title (optional)
Link (optional)
Description (optional)
Alignment: can be left, center or centered-on-mobile (optional, the default is left)

Note: the user is cookied so that once the close the banner they do not see the notice again for the rest of their session.

EXAMPLES:

placeholder image 1

Center Aligned CTA

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore reiciendis sequi tempore. Cum iure necessitatibus nobis quis reprehenderit! Ad asperiores atque ea exercitationem minus officiis optio quo rerum sit voluptatum.

placeholder image 2

Left Aligned CTA

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore reiciendis sequi tempore. Cum iure necessitatibus nobis quis reprehenderit! Ad asperiores atque ea exercitationem minus officiis optio quo rerum sit voluptatum.

placeholder image 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore reiciendis sequi tempore. Cum iure necessitatibus nobis quis reprehenderit! Ad asperiores atque ea exercitationem minus officiis optio quo rerum sit voluptatum.

placeholder image 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore reiciendis sequi tempore. Cum iure necessitatibus nobis quis reprehenderit! Ad asperiores atque ea exercitationem minus officiis optio quo rerum sit voluptatum.

placeholder image 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore reiciendis sequi tempore. Cum iure necessitatibus nobis quis reprehenderit! Ad asperiores atque ea exercitationem minus officiis optio quo rerum sit voluptatum.

placeholder image 2

Centered On Mobile

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore reiciendis sequi tempore. Cum iure necessitatibus nobis quis reprehenderit! Ad asperiores atque ea exercitationem minus officiis optio quo rerum sit voluptatum.