Dashboard

  1. Dashboard
  2. UI-Alerts

Alerts

Alerts are created with the .alertclass, followed by one of the four contextual classes .alert-success, .alert-info, .alert-warningor .alert-danger:

Success!Indicates a successful or positive action.
Success!Indicates a successful or positive action.
Info!Indicates a neutral informative change or action.
Warning!Indicates a warning that might need attention.
Danger!Indicates a dangerous or potentially negative action.
Danger!Indicates a dangerous or potentially negative action.

Alert Links

Add the alert-linkclass to any links inside the alert box to create "matching colored links":

Success!You should read this message.
Success!You should read this message.
Success!You should read this message.
Success!You should read this message.
Success!You should read this message.
Success!You should read this message.

Closing Alerts

To close the alert message, add a .alert-dismissableclass to the alert container. Then add class="close"and data-dismiss="alert"to a link or a button element (when you click on this the alert box will disappear).

×Success!Indicates a successful or positive action.
×Success!Indicates a successful or positive action.
×Success!Indicates a successful or positive action.
×Success!Indicates a successful or positive action.
×Success!Indicates a successful or positive action.

Animated Alerts

The .fadeand .inclasses adds a fading effect when closing the alert message:

×Success!Indicates a successful or positive action.
×Success!Indicates a successful or positive action.
×Success!Indicates a successful or positive action.
×Success!Indicates a successful or positive action.
×Success!Indicates a successful or positive action.

This dashboard was generated on Refresh Dashboard