@@include("partials/main.html") @@include("partials/title-meta.html", {"title": "Alerts"}) @@include("partials/head-css.html") @@include("partials/body.html")
@@include("partials/menu.html", {"title": "Alerts"})

#### Default Alerts

Alerts are available for any length of text, as well as an optional dismiss button. For proper styling, use one of the four required contextual classes (e.g., `.alert-success`). For inline dismissal, use the alerts jQuery plugin.

A simple primary alert—check it out!
A simple secondary alert—check it out!
A simple success alert—check it out!
A simple danger alert—check it out!
A simple warning alert—check it out!
A simple info alert—check it out!
A simple light alert—check it out!
A simple dark alert—check it out!

#### Link Color

Use the `.alert-link` utility class to quickly provide matching colored links within any alert.

A simple primary alert with an example link. Give it a click if you like.
A simple secondary alert with an example link. Give it a click if you like.
A simple success alert with an example link. Give it a click if you like.
A simple danger alert with an example link. Give it a click if you like.
A simple warning alert with an example link. Give it a click if you like.
A simple info alert with an example link. Give it a click if you like.
A simple light alert with an example link. Give it a click if you like.
A simple dark alert with an example link. Give it a click if you like.

#### Dismissing

Add a dismiss button and the `.alert-dismissible` class, which adds extra padding to the right of the alert and positions the `.btn-close` button.

A simple success alert—check it out!
A simple danger alert—check it out!
A simple warning alert—check it out!
A simple info alert—check it out!

#### Alert with Icon

You can use flexbox utilities and Icons to create alerts with icons

A simple success alert—check it out!
A simple danger alert—check it out!
A simple warning alert—check it out!
A simple info alert—check it out!

#### Outline Alerts

Add `.alert-outline` class with for Outline alerts.

Success - Outline success alert example
Danger - Outline danger alert example
Warning - Outline warning alert example
Info - Outline info alert example

#### Left Border Alerts

Add `.alert-outline` class with for Outline alerts.

Success - Left border alert
Danger - Left border alert
Warning - Left border alert
Info - Left border alert

#### Top Border Alerts

Left Border Alert example

Success - Top border alert
Danger - Top border alert
Warning - Top border alert
Info - Top border alert

#### Label Icon Arrow Alerts

Alert label arrow example

Success - Label icon arrow alert
Danger - Label icon arrow alert
Warning - Label icon arrow alert
Info - Label icon arrow alert

#### Alert Live Examples

Click the button below to show an alert (hidden with inline styles to start), then dismiss (and destroy) it with the built-in close button.

#### Alert Examples

Success, Error and Warning Alert Examples.

##### Success

A simple success alert

##### Error

A simple danger alert

##### Warning

A simple warning alert

##### Info

A simple info alert

@@include("partials/footer.html")
@@include("partials/right-sidebar.html") @@include("partials/vendor-scripts.html")