UI Elements & Components
The UI Elements page hold the smaller components and their variants to help develop the website.
UI Elements
UI elements are standalone components made up of one or more classes and elements.
Buttons
Buttons share one base class, and you can combine style and size combo classes to create your different variations, as long as each of them exists as its own combo class.
For example: button cc-small cc-secondary
Icons
These are useful wether you are adding icons as images or as SVGs inside embeds. When adding as HTML embed, change the SVG's height and width properties to 100%, and the fill/stroke to currentColor (if you needed)
width: 1rem (16px)
height: same
width: 1.5rem (24px)
height: same
width: 2rem (32px)
height: same
Form
Form elements. For the label you can use text classes or create a new one.
Components
Commonly used components of this project.
Typical card shell
Approaches Card.
CTA Card component to use in a card list.
This is the main Contact Form component. Used in the footer CTA and Contact page.
This is the main Contact Form component. Used in the footer CTA and Contact page.
This is the Coaching Form component. Used to get specific data related to users asking for info on coaching appraoches.