Automattic / Iris

A(n awesome) Color Picker

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

No slider handle focus outlines in WordPress 4.3.1

joshcummingsdesign opened this issue · comments

The slider handles do not have focus outlines for accessibility when clicking or tabbing on a clean install of WordPress 4.3.1. I tried adjusting the CSS outline property with no success. You can see somewhat of a blue square in the middle of the center handle when clicked or focused using the tab key.

Reproduced issue in the latest versions of Chrome, Safari, Firefox, and Edge with a clean install of WordPress 4.3.1 and enqueuing the script using the 'iris' handle.

iristest

I imagine that you already figured out a fix for your own needs, but until it gets updated in the repo for future users, you can add this to your CSS to add focus in that matches the circle selector focus:

.iris-picker .ui-slider-handle:focus {
    box-shadow: 0 0 2px rgba(0,0,0,.75);
}