search

googlearchive / paper-dialog

A dialog à la Material Design
19 stars 16 forks source link

Follow WAI-ARIA best practices #6

Open ryanflorence opened 10 years ago

ryanflorence commented 10 years ago

http://www.w3.org/TR/wai-aria-practices/#dialog_modal http://www.w3.org/TR/wai-aria-practices/#dialog_nonmodal http://www.w3.org/TR/2011/CR-wai-aria-20110118/roles#dialog

dfreedm commented 9 years ago

The "toggle between app and dialog" behavior is a bit tricky, since the app and dialog will most likely be uncoupled from one another, and the web has rather poor focus control mechanics.

ryanflorence commented 9 years ago

yeah, it was pretty tricky but not too bad when I implemented it here:

https://github.com/instructure/ic-modal/blob/master/lib/modal.js#L7-L21 https://github.com/instructure/ic-modal/blob/master/lib/modal.js#L196-L206 https://github.com/instructure/ic-modal/blob/master/lib/modal.js#L249-L261 https://github.com/instructure/ic-modal/blob/master/lib/tabbable-selector.js

Without jQuery's pseudo selectors there you're going to have fun times.

Keeping a "global" ref to an open model feels icky, but there's really nothing else to do when the user tabs up to the browser chrome and back in.

dfreedm commented 9 years ago

Thanks for the reference ideas.

I imagine that if we build something like this into core-overlay, then perhaps future implementations could achieve this as well.

Or maybe <dialog> will come to save us all before that.

ryanflorence commented 9 years ago

maybe, depends on design abilities, its not like anybody uses prompt and we constantly battle the select tag styles :|