Live Toast

A beautiful drop-in replacement for the Phoenix Flash system.

Customization

Elixir Function Settings

Many of the functions in LiveToast take settings to change the look and feel of the toasts, for minor customizations.

Custom Class Function

If you need more control over the styles, you can also pass a custom class function (that generates the class string for the main element). Note that there are a lot of required things in the default implementation of this class. It is best to take the example from the docs and extend it rather than start from zero.

Custom JavaScript

The JavaScript is also very customizable. When calling the function to create the hook, you can pass some settings to change how it behaves. I plan to extend this more in the future. If you need even more control in this area, you can also copy the TypeScript file that contains this function into your project and edit it completely.

Custom Components

If you need total control, you can pass a custom component to the toast functions. This hijacks the normal rendering and then you can pretty much do whatever you want in terms of generating the DOM elements.