User Interface Elements

Table

Heading 1 Heading 2 Heading 3
Column 1 Column 2 Column 3
Column 1 Column 2 Column 3
Column 1 Column 2 Column 3

Tags

Toggleable Pills

HOME

Lorem ipsum dolor sit amet,consectetur adipisicing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Accordion Example

Note:The data-parentattribute makes sure that all collapsible elements under the specified parent will be closed when one of the collapsible item is shown.

Collapsible Group Item #1
Lorem ipsum dolor sit amet,consectetur adipisicing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet,consectetur adipisicing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet,consectetur adipisicing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Form elements





Headings

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet,consectetur adipiscing elit. Praesent mollis augue vitae nibh convallis,eget pretium magna ornare. Orci varius natoque penatibus.

Proin aliquam quis augue eu cursus. Praesent rhoncus elit in ipsum feugiat,et laoreet nunc porta. Nullam viverra felis purus,at suscipit massa molestie eu.

Alerts

Alerts are created with the .alert class,followed by a contextual color classes:

Success!This alert box could indicate a successful or positive action.
Info!This alert box could indicate a neutral informative change or action.
Warning!This alert box could indicate a warning that might need attention.
Danger!This alert box could indicate a dangerous or potentially negative action.
Primary!Indicates an important action.
Secondary!Indicates a slightly less important action.
Dark!Dark grey alert.
Light!Light grey alert.

Button Styles