##### Milestone 30%

##### Release 60%

- Mailbox
- Calendar
- Contacts
- Media
- Documents
- Project
- Forum
- Dashboard

# Alerts

#### Simple

Add color contextual class.

NEWS : You have done 5 actions.
INFO : You have 198 messages
SUCCESS : The page has been added.
DANGER : The daily report has failed
WARNING : Bandwidth limit exceeded

#### Dark

Add `.dark` class to change the style.

NEWS : You have done 5 actions.
INFO : You have 198 messages
SUCCESS : The page has been added.
DANGER : The daily report has failed
WARNING : Bandwidth limit exceeded

#### With Icon

Add `.alert-icon` class.

You have done 5 actions.
You have 198 messages
The page has been added.
The daily report has failed
Bandwidth limit exceeded

#### With Title

Add title.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.

#### With Button

Add buttons.

You have done 5 actions.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.

#### With Avatar

Add `.alert-avatar` class.

You have done 5 actions.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.

#### Dismissible and Click

Build on any alert by adding an optional `.alert-dismissible` and close button.

Heads up! This alert needs your attention, but it's not super important.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.

#### Link In Alerts

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

Lorem ipsum dolor sit amet, consectetur adipiscing elit. not looking too good

#### Some Message

Lorem ipsum dolor sit amet, consectetur adipiscing elit. not looking too good

#### With List

An alert include title and item list with close button.

#### Alert With List

- Cras justo odio
- Dapibus ac facilisis in

#### Alert With List

- Cras justo odio
- Dapibus ac facilisis in

#### Alt Alerts

Swap modifier class `.alert-alt` to switch another four contextual feedback message style below.

Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Lorem ipsum dolor sit amet, consectetur adipisicing elit.

#### Dark Alt

Swap modifier class `.alert-alt` and `.dark` to switch another four contextual feedback message style below.

Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
Lorem ipsum dolor sit amet, consectetur adipisicing elit.

#### Social Messages

Add `.alert-social` class.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.

#### Some Message

Lorem ipsum Minim ad pariatur eiusmod ea ut nulla aliqua est quis id dolore minim voluptate.