vakata / jstree

jquery tree plugin
http://jstree.com
MIT License
5.15k stars 1.38k forks source link

Accessibility -- High contrast support #2511

Closed semcgee closed 1 year ago

semcgee commented 3 years ago

jsTree doesn't give any indication of hover/selection states in high contrast view modes. This adds a forced-colors media query to add a border around hovered & selected nodes.

vakata commented 3 years ago

Wouldn't it be better to use outline or something similar? I am afraid using border will cause layout shift and issues when border-box is not used. What do you think?

semcgee commented 3 years ago

@vakata I just gave that a try and got some odd results.

Here's the version with outline. Like you said, it does look better without the shifting elements: image

I got a weird bug after selecting a different node. The selected outline disappears, even after selecting the original node again. The hovered node works fine: image

For some reason the outline works correctly when a different window is active: image

It seems like a bug with Chromium. Using border works as expected. Really strange.

vakata commented 1 year ago

At this point I believe it would be best if this code is added by the developer and not by jstree, as we can not ensure it will work consistently. I have already done so on a project of mine - thank you.