Toast

Background gradient of any elements can have easily changed color, direction or start by adding its corresponding classes. The color palette is taken from material design colors.

Position

Initialization

To activate Toast instantiate class BMDToast: 

const toast = new BMDToast({timeOut:5000,position:'topRight'});
Plugin will attach event listener to elements with following classes:

Options

You can pass custom values to ptions with initialization of toast: List of available options:

  • timeOut - time for which toast should be shown
  • position - position of toast. possible values are: topRight, centerRight, bottomRight, bottomCenter, bottomLeft, centerLeft, topLeft, topCenter, topEdge, centerEdge, bottomEdge, middle.
  • background - a toast background color. Remember it must be a RGB value not a hex, as toast is using alpha opacity
  • text - toast text color - a hex value or keyword for CSS recognized color

How to trigger Toast

Once you initialized class you can start showing toasts with custom messages by triggering following code on defined events: 

toast.show({message: 'test message', title: 'toast title', image: 'image.jpg', position: "centerRight"});
List of available options:
  • position - you can change position per every initialized toast or toast group
  • image - an image to show in toast
  • title - a title
  • message - text to show