search

nl-design-system / backlog

Central product backlog of the NL Design System.
European Union Public License 1.2
7 stars 1 forks source link

Modal dialog #66

Open usethetics opened 3 years ago

usethetics commented 3 years ago

Naam

Modal dialog

Link naar GitHub Discussion

Notities

Description

A modal dialog displays information a user has to act on before it can be dismissed. It gains prominence in the interface by setting visual and interactive focus on the dialog.

Example

https://hidde.blog/dialog-modal-popover-differences/#:~:text=dialog%20when%20submitted.-,Examples,-Modal%20dialog%3A%20add

Use when

Nothing behind it can be interacted with while this modal dialog is open.

Don’t use when

While the dialog is open, the user should still be able to access the forms and page-content underneath.

Use a #181 non-modal-dialog instead

usethetics commented 3 years ago

A modal dialog should be dismissible by activating the confirmation or cancellation button when a user has to take an action. If a modal only provides information, it should additionally be dismissible with the esc key, clicking outside of the modal or clicking a close button in the top-right corner of a dialog.

Yolijn commented 1 year ago

Daar is een blogpost over: https://hidde.blog/dialog-modal-popover-differences/