Notilert

Notilert is a highly customisable yet simple javascript notification component integrates with ease within your app !

demo

• live Notilert demo

setup

npm install --save notilert

import Notilert from 'notilert' ;

Usage

create an instance of the Notilert class enter options and everything else is handled automatically .

// simple
new Notilert({content : 'hello from notilert'})

// more options ? hold my beer !
new Notilert({content : ' i said hold my beer ! ' ,
                    position : 'bottom-left',
                    timeout : 5,
                    color : 'white',
                    bgColor : 'black',                   
             });

Options

1. content : accepts text or html

2. position : for now there are 4 possible positions

   • 'top-left'
   • 'top-right'
   • 'bottom-left'
   • 'bottom-right'

3. color : use css values ( #000000 , black , rgb(0,0,0) etc...)

4. bgColor : same as color

5. width : use css values ( 2rem , 32px , em % etc...)

6. height : same as width

7. timeout : defined in seconds

8. closeable : 'true' for the close button , false turn it non closeable

9. type : select a predifined type instead of custom inputs

   • 'success' : green
   • 'danger' : red
   • 'alert' : yellowish
   • 'default' : ugly black and gray (test)

10. link : accepts either a string or an array

    • string of the url , example :

        new Notilert({content : "google" , link : "http://google.com" })

    since this has no option , default behavior is to open in the same window

    • array has two items a string and a boolean

      • the string is for the link
      • the link target is set to _blank if the boolean is true (default is false)
      • example :

      new Notilert({content : "google" , link : ["http://google.com" , true]})

Methods (manual handle)

• ...

Demo repo

download the demo project from here : notilert-demo

License

MIT