Additional options for dismissing Dialogs/Modals

[mdanlowski]

Is your feature request related to a problem? Please describe. When a dialog on a website can only be closed by clicking the "X" button, it can be frustrating, especially for those who rely on keyboard navigation or prefer not to use the mouse for interactions too much.

Describe the solution you'd like It is my honest opinion it feels more natural to a seasoned web dweller to be able to close dialogs with keyboard and/or without the need to aim at the close button, even more so on large resolution screens.

• Escape key: pressing Esc should close the dialog – as I presume – more aligning with user expectations.
• Overlay click: Clicking on the background outside the dialog's main body should also close the dialog – larger, more accessible target to interact with, making it less fuss overall

Describe alternatives you've considered Placing close buttons at both the top and bottom (as "Close" rather than "X") of the dialog could be another way to enhance accessibility, but this might clutter the dialog's design.

Additional context Addressing potential frustration related to loss of data

• one could have settings for that behavior and/or a (possibly timed as countdown)warning visual.
• or – storing state of last dialog form on the side

System:

 - OS: linux
 - CasaOS Version: 0.4.1
 - Disk Total: 27712 
 - Disk Used: 8779 
 - System Info: [Debian GNU/Linux 11   \l Bit:64 Mem:7801M Core:4 Linux CasaOS 5.10.0-10-amd64 #1 SMP Debian 5.10.84-1 (2021-12-08) x86_64 GNU/Linux]
 - Remote Version: 0.4.4.2
 - Browser: Chrome 
 - Version: 119.0.0.0

[CorrectRoadH]

Did it in todo list? I think maybe I could implement it🤔

[jerry-ne]

"+ Install a customized App" accept ESC key and close this dialog.

But dialog from this dialog: for example open "volumes" -> Host: select icon [] -> ESC does not close this child dialog. Only parent dialog "+ Install a customized App"