Buttons

Default buttons

Add .btn-{style-name} modifier to change style.

Disabled buttons

Add disabled attribute or .disabled modifier to change style.

Button group

Wrap your buttons into .btn-group element.

Outline buttons

Add .btn-outline-{style-name} modifier to change style.

Rounded buttons

Add .btn-rounded modifier to change style.

Link buttons

Add .btn-link modifier to change style.

Button toolbar

Wrap buttons into .btn-toolbar blpck to stack and alignment buttons.

Large size

Add .btn-lg modifier to increase button size.

Small size

Add .btn-sm modifier to reduce button size.

Button block

Add .btn-block modifier to change button style.

Loading button

Put <i class="i-spinner loading"></i> element into button.

Buttons with tooltip

Add data-tooltip="{text}" attribute to any element to create tooltip.

Use data-tooltip-placement attribute to change tooltip placement. Available placements: top, bottom, left, right. Default placement - top.

Buttons with popover

Add data-popover-placement="{placement}" attribute to the element to create popover trigger. Available placements: top, bottom, left, right. Default placement - top.

Popover block should be a separate DOM element. You should place popover block after button (or some else DOM element with data-popover-placement attribute).

Add data-popover-once attribute to show popover once.

Popover
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel vero reprehenderit nulla, maiores nihil non.
Popover on left
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel vero reprehenderit nulla, maiores nihil non.
Popover on top
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel vero reprehenderit nulla, maiores nihil non.
Popover on bottom
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel vero reprehenderit nulla, maiores nihil non.
Popover on right
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel vero reprehenderit nulla, maiores nihil non.

Pagination

Pagination large

Add .pagination-lg to increase block size.

Pagination small

Add .pagination-sm to reduce block size.