Accessibility support #86
Conversation
|
Hello, thanks @Maskim for this PR! |
There was a problem hiding this comment.
Thanks again for this PR @Maskim
The tabbing navigation is working.👌
| @@ -6,33 +6,30 @@ | |||
| box-sizing: border-box; | |||
| } | |||
|
|
|||
| .tingle-modal *:focus { | |||
| outline: 1px solid black; | |||
There was a problem hiding this comment.
I would prefer to keep the browser's default focus ring instead of a 1px black ring. It's not very noticeable, especially around the close button.
Maybe we could make a nicer focus ring with box-shadow, but it's a bit unsafe knowing that the focusable elements in the modal's content may have box-shadow already.
I would like to have the @robinparisi opinion on that.
| } | ||
|
|
||
| function _handleKeyboardNav(event) { | ||
| // escape key | ||
| if (this.opts.closeMethods.indexOf('escape') !== -1 && event.which === 27 && this.isOpen()) { | ||
| this.close(); | ||
| } | ||
|
|
||
| // tab key | ||
| if (event.which === 9 && this.isOpen()) { |
There was a problem hiding this comment.
Well I don't know :o
I suppose I forgot to remove this test :)
I try to add accessibility support on your plugin.
I hope it will do the job :)
I used the link I paste in #85 ticket