[Medium]: Color Contrast: Insufficient color contrast for text controls.

[SumitDiyora]

Action Performed:

1. Using Chrome, open URL: staging.new.expensify.com
2. Navigate to Room Details Page by clicking on the header of the report page.
3. Navigate to the 'Members' control using the Tab key and activate it.
4. Navigate to the 'applausetester@applause.expensifail.com', 'applausetester+ab1243@applause.expensifail.com', '087a2axa@test.com', etc. text controls.
5. Observe that the analyser reports that the contrast ratio is not sufficient.

Expected Result:

The 'applausetester@applause.expensifail.com', 'applausetester+ab1243@applause.expensifail.com', '087a2axa@test.com', etc. text controls should have a contrast ratio against the control's background of 4.5:1 or greater.

Actual Result:

Background/foreground color combinations with an insufficient contrast ratio was found on control. For instance, the #7D8B8F 'applausetester@applause.expensifail.com', 'applausetester+ab1243@applause.expensifail.com', '087a2axa@test.com', etc. text controls has an insufficient color contrast ratio of 3.5.1 with a #FFFFFF background.

Other occurrences

Similar issue repro on PR #9276, #9144 - Insufficient color contrast for appear offline text.
Similar issue repro on PR #9347 for applausetester+ab1243@applause.expensifail.com,etc.. and 'Admin' and 'get Assistance' button
Similar issue repro on PR #9472

Workaround:

Yes

Area issue was found in:

All pages of the Expensify application where similar text is appearing.

Failed WCAG checkpoints

1.4.3

User impact:

It will be a bit confusing or there will be difficult to perceive the content for the low vision users if the color contrast ratio does not meet the minimum requirement.

Suggested resolution:

Ensure that each text/background color combination presents a contrast ratio of at least 4.5:1.

Platform:

• Web
• iOS
• Android
• Desktop App
• Mobile Web

Version Number: v1.1.49-1
Reproducible in staging?: Yes
Reproducible in production?: Yes
Reference link: https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html
Issue reported by: Sumit

[melvin-bot]

@SumitDiyora, this Monthly task hasn't been acted upon in 6 weeks; closing.

If you disagree, feel encouraged to reopen it -- but pick your least important issue to close instead.