Component

Apply to the outer level of your component.

• audience-{audience}
• tone-{tone}
• bg-option-{option}

Elements

Apply to elements within the component. They will be styled depending on the audience, tone, and color palette for the component.

• wvu-b-display-heading
• wvu-b-subheading
• wvu-b-accent-bg
• wvu-b-accent-text
• wvu-b-btn

• helvetica-neue
• helvetica-neue-bold
• config-extra-bold
• config-light
• antonia
• antonia-bold
• antonia-italic
• antonia-light
• antonia-heavy
• antonia-heavy-italic

Text

• text-wvu-gold
• text-wvu-blue
• text-wvu-{color}

Backgrounds

• bg-wvu-gold
• bg-wvu-blue
• bg-wvu-{color}

Borders

• border-wvu-gold
• border-wvu-blue
• border-wvu-{color}

Buttons

• btn-wvu-gold
• btn-wvu-blue
• btn-wvu-{color}

Basic Unordered

• wvu-ul-arrows
• wvu-ul-arrows-{color}
• wvu-ul-chevrons
• wvu-ul-chevrons-{color}
• wvu-ul-slashes

Stylized Ordered

• wvu-ol-big-numbers
• wvu-ol-big-numbers-{color}
• wvu-ol-small-numbers
• wvu-ol-small-numbers-{color}

Slash

• wvu-slash
• wvu-slash--{color}
• wvu-slash--transparent--light
• wvu-slash--transparent--dark
• wvu-slash--{position}
• wvu-slash--skinny

Grid Background

• wvu-bg-pattern-grid
• wvu-bg-pattern-grid-transparent
• wvu-bg-pattern-grid-zoomed
• wvu-bg-pattern-grid-zoomed-transparent

• wvu-bg-position-{direction}
• wvu-bg-position-{breakpoint}-{direction}
• wvu-bg-position-{breakpoint}-{direction}--{value}
• wvu-bg-position-spacer-top
• wvu-bg-position-spacer-md-top
• wvu-bg-position-spacer-bottom
• wvu-bg-position-spacer-md-bottom