Wave 4.5

The Wave theme is an advanced Adapt theme with Parallax Articles and Color Customization support that, by default, meets WCAG 2.1 AA color contrast.

You can download the color pallet for the default colors (click the image to the right to download) to incorporate the colors into your graphics. The top row of colors are the base theme colors and the lower row of colors are used as accents and for success/failure messaging.

Margins & Padding can be adjusted by using custom classes on any element. Keep in mind that most elements have margins already and in using these classes you may alter behavior in ways that cannot be predicted. Use with caution.

Class	Usage
.m{side}-{0-5}	Alters the margin for a particular side by the factor indicated. Example: mt-0 removes the top margin.
.m{side}-n{1-5}	Alters the margin for a particular side in the negative by the factor indicated. Example: mt-n5 will move the element up by a factor of 5 (about 32px).
.p{side}-{0-5}	Alters the padding for a particular side by the factor indicated. Example: pl-1 changes the padding on the left of the element to be a factor of 1 (about 4px).

Class	Usage
.card-dark	When applied to a card root, forces the card to use the tertiary-color as a base color and the tertiary-color-inverted as the font color.

This theme allows the course creator to alter the colors used in the theme.

In the table below, each entry indicates a color and it’s inversion. Inverted colors must meet WCAG AAA color specifications for normal text. This is because many of the colors are used in gradients and you cannot control the final gradient stop.

Color	Inversion	Description
Primary	Primary Inverted	This is the primary color used to style the course, and is applied to component items.
Accent	Accent Inverted	This is the accent color used to style the course, and is applied to various graphic accents in the theme.
Secondary	Secondary Inverted	This is the secondary color used to style the course, and is applied to buttons.
Tertiary	Tertiary Inverted	This is the tertiary color used to style the course, and is applied to the navigation bar. By convention Tertiary is the darkest color in the theme.
Quaternary	Quaternary Inverted	This is the quaternary color used to style the course, and is applied to the drawer.
Foreground	n/a	This is the foreground color, and is applied to all body text.
Background	n/a	This is the background color, and is applied to many elements including pages, articles and blocks.
Foreground Inverted	n/a	This is the inverted foreground color, and is applied to text on menus and page headers.
Background Inverted	n/a	This is the inverted background color, and is applied to menus and page headers.
Validation error	n/a	This is the validation error color, and is applied to elements which display an incorrect field.
Validation success	n/a	This is the validation success color, and is applied to elements which display a correct field.
Disabled	Disabled Inverted	This is the disabled color, and is applied to elements which have been disabled.

When using the Parallax Articles extension, these color combinations are used for the background and text and will override any general theme settings.

Parallax sections in the wave theme add a watermark and beginning/ending shapes. Because of this, two parallax sections cannot be placed one above the other.

Keep in mind that these are the default colors.