Colors
These are the colors used throughout the site. Each has been assigned to a variable in the variables.scss file.
Base
Brand
Grays
Typography
These are our basic typographic styles. Make updates in the typography.scss file.
Headings
h1. The quick brown fox jumps over the lazy dog.
h2. The quick brown fox jumps over the lazy dog.
h3. The quick brown fox jumps over the lazy dog.
h4. The quick brown fox jumps over the lazy dog.
h5. The quick brown fox jumps over the lazy dog.
h6. The quick brown fox jumps over the lazy dog.
Headings - Secondary
h1. The quick brown fox jumps over the lazy dog.
h2. The quick brown fox jumps over the lazy dog.
h3. The quick brown fox jumps over the lazy dog.
h4. The quick brown fox jumps over the lazy dog.
h5. The quick brown fox jumps over the lazy dog.
h6. The quick brown fox jumps over the lazy dog.
Headings - Tertiary
h1. The quick brown fox jumps over the lazy dog.
h2. The quick brown fox jumps over the lazy dog.
h3. The quick brown fox jumps over the lazy dog.
h4. The quick brown fox jumps over the lazy dog.
h5. The quick brown fox jumps over the lazy dog.
h6. The quick brown fox jumps over the lazy dog.
Headings - Underline
h1. The quick brown fox jumps over the lazy dog.
h2. The quick brown fox jumps over the lazy dog.
h3. The quick brown fox jumps over the lazy dog.
h4. The quick brown fox jumps over the lazy dog.
h5. The quick brown fox jumps over the lazy dog.
h6. The quick brown fox jumps over the lazy dog.
Lead Paragraph
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec in dui ex. Nullam vel porta lectus. Morbi eu libero finibus, dapibus erat a, aliquam felis.
Default Paragraph
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec in dui ex. Nullam vel porta lectus. Morbi eu libero finibus, dapibus erat a, aliquam felis.
Small Paragraph
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec in dui ex. Nullam vel porta lectus. Morbi eu libero finibus, dapibus erat a, aliquam felis.
Lists
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ligula est, aliquam eu blandit ac, dictum nec erat.
- Nulla quis sapien non lacus rutrum mollis suscipit scelerisque velit. In hac habitasse platea dictumst.
- Duis in justo tincidunt, luctus ligula sed, placerat diam. Morbi eget tellus ipsum. Fusce iaculis maximus sem eget tincidunt.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ligula est, aliquam eu blandit ac, dictum nec erat.
- Nulla quis sapien non lacus rutrum mollis suscipit scelerisque velit. In hac habitasse platea dictumst.
- Duis in justo tincidunt, luctus ligula sed, placerat diam. Morbi eget tellus ipsum. Fusce iaculis maximus sem eget tincidunt.
Alerts
These are our basic alert styles. Make updates in the alerts.scss file.
Forms
These are our basic form styles. Make updates in the forms.scss file.
Event List
Event heading
Event description Event description Event description Event description Event description Event descriptionEvent heading
Event description Event description Event description Event description Event description Event descriptionEvent heading
Event description Event description Event description Event description Event description Event descriptionPagination
These are our pagination styles. Make updates in the pagination.scss file.
Panels
These are our panel styles. Make updates in the panels.scss file.
Default
Panel default
Color Alternatives
Panel purple
Panel orange
Panel light brown
Panel dark brown
Panel tan
Wells
These are our well styles. Make updates in the wells.scss file.
Default
Sizes
Modals
These are our modal styles. Make updates in the modals.scss file.
Accordions
These are our accordion styles. Make updates in the accordions.scss file.
Loading Elements
These are our built-in options to add loaders to a section or page. Make updates in the loading.scss file.
Social Sharing
We have a some built-in functions that make use of data attributes to make sharing on common social networks easier. You can find out more by viewing the
lib/wl-share.jsfile.