(Accessibility) - Discover Tab Navigation/Contrast

[barlowm]

Steps to reproduce WebAIM Contrast Checker

Tab through the page and observe where the focus is.
In tabbing through the page the indicator as to where the current focus is on tab 7 from Search (the "apm-" control receives focus) is almost invisible.

The next press of the tab key has no focus indicator that I can find. There IS a faint outline around "apm-" but this does not meet contrast requirements 002B48/003E68 - gives a contrast ratio of 1.29.

#9E9EFF/003e68 would give a CR of 4.65 which would pass contrast requirements. Though a #ffffff/003e68 would be better.

Continued tab key navigation highlights the "add" button but the focus is nearly invisible once again.

Meta Issue

Accessibility: Make Discover Accessible for 7.0

Kibana Version:

7.0

Relevant WCAG Criteria:

1.4.3 - Contrast (Minimum) - Level AA

Recommendation:

Adjust foreground/background colors to have a minimum of 4.50 contrast

References:

Guideline 1.4 – Distinguishable

1.4.3 - Contrast (Minimum) Level AA

The visual presentation of text and images of text has a contrast ratio of at least 4.5:1

Techniques:

• G18: Ensuring that a contrast ratio of at least 4.5:1 exists between text (and images of text) and background behind the text
• G148: Not specifying background color, not specifying text color, and not using technology features that change those defaults
• G174: Providing a control with a sufficient contrast ratio that allows users to switch to a presentation that uses sufficient contrast
• SL13: Providing A Style Switcher To Switch To High Contrast

[elasticmachine]

Pinging @elastic/kibana-app (Team:KibanaApp)