Alerts have replaced Angular-Toaster as our way of displaying application level Alerts.

General Alert Notification Guidelines

• An Alert appears when the system needs to notify the user of something happening at the application level in an unobtrusive way and the user does not need to respond. Example: successful save/edit of a Time transaction.
• Toaster message should be short and concise, no longer than a sentence and has to readable within 5 seconds.
• If the user hovers over the alert it will continue to display. Once the mouse moves off of the alert is disappears. This is to allow for longer read time if necessary
• Multiple Alerts should stack in the upper right corner with the newest Toaster on top.
• Use sentence style text without punctuation
• The text will wrap extending the height of the Toaster if it does not fit in one line.
• Use simple wording in present tense. Eliminate unnecessary words

Dismissing Alerts

To make sure that alerts go away automatically the dismiss-on-timeout attribute to your alert. We reccomend the alerts stay visible for at least 5 seconds (5000ms) and that they do not disappear while the user is hovering over said alert (UI-Bootstrap Handles this behavior by default)

To make your alerts manually closeable, apply the Close() attribute to your alert element

For more information, see UI-Bootstrap'sdocumentation

Alert notifications should be unique in nature and not clutter the user's screen, however it may at some times be necessary to display multiple notifications. Try for a maximum of four Toasters displayed at once.