8000 Website accessibility: syntax highlighting doesn't always match color contrast thresholds · Issue #8213 · typescript-eslint/typescript-eslint · GitHub
[go: up one dir, main page]

Skip to content
Website accessibility: syntax highlighting doesn't always match color contrast thresholds #8213
Closed
@JoshuaKGoldberg

Description

@JoshuaKGoldberg

Before You File a Documentation Request Please Confirm You Have Done The Following...

Suggested Changes

I ran the axe browser dev tools on https://typescript-eslint.io/getting-started. The report indicated we don't have enough color contrast...

  • In dark mode:
    • On block comments in code, such as /* eslint-env node*/: 3.23:1 (#737373 on #242529) instead of 4.5:1
  • In light mode:
    • On the command part of shell scripts, such as npm install: 2.76:1 (#569cd6 on #f6f8fa) instead of 4.5:1

Maintaining color contrast for all text above the minimum AA threshold of 4.5:1 is important so that users who need to visually perceive the website can. Lower color contrasts are a potential impediment for folks with reduced vision and/or worse hardware and/or bad lighting conditions. https://dequeuniversity.com/rules/axe/4.8/color-contrast

Accepting PRs to use brighter block comments in dark mode and darker shell script color in light mode.

Affected URL(s)

https://typescript-eslint.io/getting-started

Metadata

Metadata

Assignees

No one assigned

    Labels

    accepting prsGo ahead, send a pull request that resolves this issueaccessibility("a11y"): making the site more accessible to all usersbugSomething isn't workinggood first issueGood for newcomerspackage: websiteIssues related to the @typescript-eslint website

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions

      0