crop_7_5Buttons

Colors

To create a nice button, just choose a class: btn-primary, btn-success, btn-info, btn-primary, btn-warning, btn-danger.

---

Disabled

You have two options to disable a button:

• Use the attribute disabled and really disable it;
• Use the class disabled and only make it look disabled.

When you use only the class, actions continue to be triggered when you click the button.

In the example bellow, all buttons would trigger an alert, but the first three are disabled with the attribute, so it won't work. Try clicking on them:

Note that links don't support the disabled attribute, so they will behave as if using the class instead of the attribute.

To get a behavior close to the disabled button, you can use the class disable-pointer so the element wont respond to mouse events (click and hover), and use the a negative tabindex to prevent the focus on keyboard navigation.

---

Sizes

To set a different size, just add the class btn-xs, btn-sm or btn-lg to your button.

---

Color Trigger

LiteAdmin also provides discrete buttons, that are highlighted when the user needs them.

Using it is easy: add the class color-trigger to any element and the buttons inside it will be discrete, being highlighted when the user hovers the given element.

In the example below, the class was added in the table's rows:

In devices that are not good to hover (like touchscreens) or in browsers that we can't detect it, the buttons are colored by default, for accessibility.

---

Pagination

If you need pagination, we've got you covered. Just create a <div class="pagination"> with links inside, and you're good to go.