Pop up Dialogs Design Components

[crchong1]

We currently have pop up dialogs in the Admin Panel flow and the Client Dashboard flow - mostly to confirm deletion of items. It should probably be in any flow that has a list of documents / applications or a list of users. They should possibly also be in the My Account Settings pages to confirm changes made on that page?

We need a standardized design for pop up dialogs. We also need to decide the use cases for these dialogs (should they have any purpose other than confirming deletion?). There may be overlap with notifications/alerts so might be helpful to read through what we have for our notification/alert component research + guidelines.

Things to keep in mind:

• Is there any use case other than confirming deletion in our website? (Possibly confirming signup or adding a new member to the organization?)
• What does the dialog look like if we want to add an illustration?
• Button + dialog copy?
• Should we have an x icon?
• Pop ups can be annoying - how do we minimize their frequency of use?

See: https://material.io/components/dialogs https://blueprintjs.com/docs/#core/components/overlay

[scye09]

See #114 for examples of other component redesigns and a description of what to research + good sources for UI/UX principles.

[scye09]

Figma file here: https://www.figma.com/file/02s4FmwwYjnIyvxpChAfEi/Pop-up-Dialogs?node-id=6%3A245 @leonna26 @mishyi @chels20 could you guys quickly go through the Final Design Review checklist and react to this comment if you approve it? If you think there are changes that need to be made, please comment here and I'll make the changes.

[leonna26]

hey Sophia, I was going through our site to track our design audit issues. did you consider this pop-up when creating your dialogs/are we keeping this authenticate pop-up?