Box

Cras justo odio, dapibus ac facilisis in, egestas eget quam. Nulla vitae elit libero, a pharetra augue. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

Base

SLDS box documentation.

This is a regular-sized box.

Small

SLDS box documentation.

This is a small-sized box.

GoDE Base

This is a regular-sized box.

GoDE Summary Box

This is a small-sized box.

GoDE Okta Sign In Box

This is an Okta box.

Text

Cras justo odio, dapibus ac facilisis in, egestas eget quam. Nulla vitae elit libero, a pharetra augue. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

Headings

Headings use the typical - markup, or can be created with .h1 - .h6 helper classes. Our theme uses -

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Body

SLDS provides only two body font sizes, regular and small. We've added a custom large size.

Regular

Small

Large

Vertical List

SLDS input documentation.

Base

  • Vertical List
  • List Item
  • List Item
{{#> vertical-list base="true" }}
  <li>Vertical List</li>
  <li>List Item</li>
  <li>List Item</li>
{{/vertical-list }}

Bullet

  • Vertical List
  • List Item
  • List Item
{{#> vertical-list bullet="true" }}
  <li>Vertical List</li>
  <li>List Item</li>
  <li>List Item</li>
{{/vertical-list }}

Decimal

  1. Vertical List
  2. List Item
  3. List Item
{{#> vertical-list decimal="true" }}
  <li>Vertical List</li>
  <li>List Item</li>
  <li>List Item</li>
{{/vertical-list }}