swagger-ui icon indicating copy to clipboard operation
swagger-ui copied to clipboard

a11y: Page title version ID does not have enough color contrast

Open cjfreedman opened this issue 1 year ago • 0 comments

Q&A (please complete the following information)

  • OS: [e.g. macOS] Windows 10
  • Browser: [e.g. chrome, safari] Chrome
  • Version: [e.g. 22] 121
  • Method of installation: [e.g. npm, dist assets] npm
  • Swagger-UI version: [e.g. 3.10.0] Swagger UI React 5.11.3
  • Swagger/OpenAPI version: [e.g. Swagger 2.0, OpenAPI 3.0] OpenAPI 3.0

Content & configuration

Basic/default

Describe the bug you're encountering

We are using a tool called Sort site to evaluate our site for 508 accessibility. It is flagging that there is not enough color contrast in the version identifier at the top of the page. The Sort site error is below.
Violates WCAG 2.0 AA 1.4.3 https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html This is on the "pre" with "class=version" inside a "small", and on the "pre" with "class=version" inside a "small class=version-stamp", which are both contained in the h2 with class "title".

To reproduce...

View any OpenAPI spec title

Expected behavior

Color contract should be corrected

Screenshots

Here's the element with the error (the 1.0.0 and the OAS 3.0) image

Here's the Sort Site information: image

Additional context or thoughts

cjfreedman avatar Feb 13 '24 19:02 cjfreedman