Skip to content

docs-infra: a11y issues with API docs #31265

@Splaktar

Description

@Splaktar

📚 Docs or angular.io bug report

Description

#31118 and #31252 made changes to some of the placeholder styling on AIO.

I tested the changes in Firefox and these versions (plus previous versions) have the same issue of being overly transparent and not meeting a11y contrast guidelines that we saw in AngularJS Material (angular/material#11497).

🔬 Minimal Reproduction

What's the affected URL?**

Reproduction Steps**

Inspect the placeholder styling of the filter input.
Run a Lighthouse A11y audit against the page.

Expected vs Actual Behavior**

The placeholder text and background should have a recommended contrast of 4.5 (AA).

📷Screenshot

Firefox:
Screen Shot 2019-06-25 at 14 47 46
This is unreadable for many people, even those without significant vision issues.

Chrome:
Screen Shot 2019-06-25 at 14 47 58
This color is still well under the recommended contrast guidelines for a11y
Screen Shot 2019-06-25 at 15 29 19

🔥 Exception or Error

Contrast ratio of 1.45 is well under AA recommendation of 4.5.

🌍 Your Environment

Browser info

Chrome 75 and Firefox 67.0.3

Anything else relevant?

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions