Skip to Main Content Skip to Footer Toggle Navigation Menu

text style utilities:

NOTE: all margins are included in utility classes for spacing relationships. These should be preferred over variations in design.

text-kicker

text-display

text-h1

text-h2

text-h3

text-h4/text-h5

text-body
Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptas adipisci quia, eaque modi facilis officia quam, iste illo quo temporibus laborum nesciunt praesentium perspiciatis quidem harum? Ut soluta recusandae commodi.

text color utilities:

NOTE: all color utilities will override to white if a parent component has class of .dark

text-gold

text-red

text-purple

text-white

text alignment utilities:

text-center

text-center-small

app-button:

NOTE: app-button will override to white if a parent component has class of .dark

App-Button app-button--white App-Button--Block

app-link:

App-Link app-link--white

app-lockup:

kicker text

Heading text lorem

Body text lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

CTA Label

.gradient-fill
@include gradient-fill

.gradient-border
@include gradient-border($width: 3px)

app-search.twig

Search form that submits query to the search results page. If you need just the form elment itself for filters or whatever just rip the html out.