# Notifications ```

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quia laudantium ea delectus incidunt accusantium repudiandae deserunt excepturi non esse vero distinctio et reprehenderit, cupiditate quidem consectetur rerum iste magnam voluptatibus.

``` ## Info ```

``` ## Error ```

An error occured, here are the facts:

Fact 1: You made a mistake
Fact 2: You really made a mistake
Fact 3: You should fix it

``` ## Warning ```

This is a warning. You may ignore it, but bad things might happen.

``` ## Success ```

Successful update. A link to the past

``` ## Stackable ```

``` ``` @javascript (function($){ var viewArea = $('.notification-box--casing'); var notificationMessageTemplate = { notificationNumber: 0, printNotification: function(){ this.notificationNumber++; return $('#warning-message-zx00x').html() .replace(/{{number}}/g, this.notificationNumber); } }; $('#test-notifier').on('click', function(e){ e.preventDefault(); viewArea.prepend(notificationMessageTemplate.printNotification()); }); $(document).on('click', '.notification-box--close', function(e){ e.preventDefault(); $(this).closest('.notification-box').animate({ 'padding-top': 0, 'padding-bottom': 0, 'height': 0, 'opacity': 0 }, 'fast', function() { $(this).remove(); }); }); })(jQuery); ``` ## Upload notifications ### Upload progress ```

Uploading files ...

1 of 3 files finished

Awesome_Landscape1.png 20%
Awesome_Landscape2.png 50%
Awesome_Landscape3.png

``` ### Upload progress done ```

Uploading files ...

5 of 5 files finished

Awesome_Landscape1.png
Awesome_Landscape2.png
Something went wrong!...
Awesome_Landscape3.png
Awesome_Landscape3.png
Awesome_Landscape3.png

``` ### Upload progress more then five files simultaneously ```

Uploading files ...

3 of 5 files finished

```