JSFiddle - React, Tailwind, and code Playground

by Dipak1991

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojox/widget/Toaster/Toaster.css">

CSS

.dijitToasterMessage{ 
    color:#fff;
}

.dijitToasterContent {
    padding:1em;
    padding-top:0.25em;
    background:#000;
    border-radius: 8px;
}

JavaScript

dojo.require("dojox.widget.Toaster");

dojo.ready(function(){
    var errors = new dojox.widget.Toaster({
        messageTopic: '/app/error',
        positionDirection: 'br-up',
        duration: 5000
    });
    var info = new dojox.widget.Toaster({
        messageTopic: '/app/info',
        positionDirection: 'tr-down',
        duration: 5000
    });
    
    dojo.publish('/app/error', ["Error sending data"]);
    
    window.setTimeout(function(){ 
        dojo.publish('/app/info', ["New E-Mail"]);
    }, 1000);
    window.setTimeout(function(){
        dojo.publish('/app/info', ["New SMS"])
    }, 3000);
    window.setTimeout(function(){
        dojo.publish('/app/info', ["New Fax"])
    }, 6000);
});