Interface

Buttons & Dropdowns

Buttons

Use the default and link buttons for interactions for the majority of interactions within the page. Primary buttons should be used sparingly – only for things such as calls-to-action or inputing forms.

Standard buttons

Disabled buttons

Button sizes

Panel heading buttons

Panel Heading

Wrap each button in btn-group and then wrap all your btn-groups with btn-toolbar.

Add the class links-divider to also put dividing lines between the buttons.


Dropdowns

Default

Right aligned

Checkboxes


Multi-select Dropdown

If you are using Ember to develop your application there is a multi-select dropdown component available to access on Github.

None checked

One checked

More than one selected

All selected

Optional search box

Optional select all