Material Admin Extended Dark

## Bootstrap Notify Notifications

Pretty simple jQuery plugin that turns standard Bootstrap alerts into "Growl-like" notifications.

Official website and detailed documentation at http://bootstrap-notify.remabledesigns.com/

In order to check the previews of these notifications, please visit the page `/notification-dialog.html`

In order to use this plugin, make sure to include it's Javascript asset file in the `<head>` section.

    <script src="vendors/bower_components/remarkable-bootstrap-notify/dist/bootstrap-notify.min.js"></script>

#### Basic example

    $.notify({
        message: 'This is a sample Bootstrap Notify message!'
    },{
        type: '-light',
        allow_dismiss: true,
        placement: {
            from: 'bottom',
            align: 'left'
        },
        delay: 2500,
        animate: {
                enter: 'animated fadeInUp',
                exit: 'animated fadeOutDown'
        },
        offset: {
            x: 30,
            y: 30
        }
    });

#### Custom Positions

This controls where if the notification will be placed at the top, bottom, right or left of your element.

    ...
    placement: {
        from: 'top', //or 'bottom'
        align: 'right' //'left or center'
    },
    ...

#### Custom Variants

Defines the style of the notification using bootstraps native alert styles. Please keep in mind that when the notification is generated the type gets prefixed with alert-. When using native alert styles this will not be an issue, but if you create a new style such as pink when setting up the css you have to use the class `alert-pink`.

    ...
    type: 'info', //or '-light', 'success', 'warning', 'danger'
    ...

For more information about `alert`, please refer the page `/alerts.html`

#### Custom Animations

One of the most powerful features in Bootstrap Notify is that you can easily animate how it enters and exits the screen using CSS. For this it's recommended to use a wonderful resource called Animate.css which is already integrated in Material Admin (`/animations.html`).

Please note that in Animate.css (`/animations.html`), all the `entrance` and `exit` animations are most suitable for this case.

    ...
    animate: {
        enter: 'animated zoomIn',
        exit: 'animated zoomOut'
    },
    ...

Source files:

- Plugin
  - CSS: `none`
  - JS: `vendors/bower_components/remarkable-bootstrap-notify/dist/bootstrap-notify.min.js`
- LESS: `/less/bootstrap-overrides/alert.less`
- HTML: `/alert.html`, `/notification-dialog.html`
- JS(demo): `/demo/js/misc.js`