Proton - Admin Template

Options

With Icons

Size Large Add this class `.btn-lg`

Size Small Add this class `.btn-sm`

Size Extra Small Add this class `.btn-xs`

Disabled state Add this `disabled="disabled"`

Active state Add this class `.active`

Single button dropdowns

Split button dropdowns Similarly, create split button dropdowns with the same markup changes, only with a separate button.

Dropup variation Trigger dropdown menus above elements by adding `.dropup` to the parent.

Block Level Buttons Add this class `.btn-block`

Buttons group Wrap a series of buttons with `.btn` in `.btn-group`

Button toolbar Combine sets of `<div class="btn-group">` into a `<div class="btn-toolbar">` for more complex components.

Nesting Place a `.btn-group` within another `.btn-group` when you want dropdown menus mixed with a series of buttons.

Vertical variation

Justified button groups

Left Middle Right

Left Middle

Memory

4GB of 8GB
HDD

250GB of 1TB
SSD

700GB of 1TB
Bandwidth

90TB of 100TB