Related pages: Popups, Dialogs, Toast
Lead: Liav Nadler ONGOING
Description
A message popup is a small modal window containing a warning, error message, help text or other important information
Types
Type | Example |
---|---|
Help | |
Information | |
Warning | |
Error |
Usage & Behaviour
General guidelines
Structure
- The message popup may contains these elements:
- Header, including a title (e.g. "Warning") and a closing icon
- Title, including Icon (e.g. question mark icon for help) and text
The message text
- Primary action button (usually OK)
- Secondary action button (usually Cancel) when relevant
- In some cases a checkbox may appear. For example:
- For basic guidelines see Popups
Size
- Message popups have a fixed width. The height of the popup may vary in regard to the length of the text
Best practices
- The message popup is more intrusive than a toast. Use it only for important messages (or long messaged in the case of help)
- Keep the title short and informative
- Keep the message text short and informative
Design
Zeplin link | Screen thumbnail |
---|---|
<<Zeplin Link>> | <<Screen with 200 width>> |
Code