Related pages: Message Popups
| Table of Contents |
|---|
Description
A toast is a small message box that appears in response to a user action or system event. It contains simple feedback about the event, while any current activity remains visible and interactive.
Types
Type | Usage | Example |
|---|---|---|
Information | General information related to an action. |  |
Success | Actions that were completed successfully. |  |
Warning | System warnings or actions that may cause a problem. |  |
Error | System errors or actions that have failed to complete. |  |
Continuous Action | An action that takes more than 3 seconds. |   |
...
All toasts appear from the bottom-left side of the screen (using a slide effect).
Toasts have a fixed width.
The height of a toast depends on the amount of text it contains. Where there are more than 3 lines an expand button will appear, allowing the user to enlarge the toast.
 |  |
Interaction
Mouseover a toast will keep it visible, even after exceeding the time limit before it disappears.
Clicking the closing button (x) closes the toast with a short fade effect.
When shown, clicking the Cancel button cancels the continuous action which has triggered the toast, and closes it. In this case, another information toast may appear, indicating that the action was canceled.
When shown, clicking the expand button:
expands the toast upwards with a slide effect, revealing the rest of the text.
hides the expand button.
pushes all other toasts upwards (see Multiple Toasts below).
...