Modal Dialogs

Modal Dialogs are high priority messages that freeze the user's flow and talk about critical information.

Modal Types

• Confirmation Modals: They ask users to make a decision before they can resume their work flow.
  • Key UX Rules:
  • The title of the dialog is phrased in the form of a question.
  • The dialog's actions are aligned to the right.
  • The primary action goes to the right of any secondary actions.
  • Clicking outside the dialog does not dismiss it.
  • The dialog can only be dismissed by clicking the action buttons or the close icon (not by clicking outside the modal).

• Notification Modals: read-only critical information; non-actionable.
  • Key UX Rules:
  • The dialog's actions are aligned to the right.
  • The dialog doesn't have a close icon. It can only be dismissed by clicking the primary button (not by clicking outside the modal).