SimpleToast Demo

Demo

Installation

Installing SimpleToast is as easy as adding a script tag:

      <script src="https://cdn.jsdelivr.net/gh/itaypanda/simpletoast@master/SimpleToast.min.js"></script>
    

Usage

      // Initalize the toast library
toastInit();

// Show a success toast
toast("Success!", "SimpleToast is online!", toastStyles.success);

// Show an error toast
toast("Error!", "Whoops! we broke something.", toastStyles.error);

// Show a warning toast
toast("Warn!", "Field X is invalid.", toastStyles.warn);

// Show an info toast
toast("FYI!", "FYI - Info toast works.", toastStyles.info);
    

Adding your own styles

A custom style must have a color and an icon proerties:

      // Defining the style
const customStyle = {
    color: "purple", // Tailwind CSS color. Ex: [#ffffff].
    icon: "<div></div>" // Doesn't have to be an svg.
};

// Using it
toast('My own custom style!', 'This is a SimpleToast custom style', customStyle);
    

Show Custom Style Toast

License and additional info

All of the information you need can be found at this project's GitHub repo: https://github.com/itaypanda/SimpleToast