Input, Input Message - Ensure parts of graphical objects essential for understanding content have sufficient contrast - (2036569948)

[dqateam]

Violation:

Ensure parts of graphical objects essential for understanding content have sufficient contrast

WCAG Reference:

• 1.4.11 Non-test Contrast

Severity:

5

Media Type:

Color and Contrast

---

Areas for Remediation:

• Title: Input, Input Message - Ensure parts of graphical objects essential for understanding content have sufficient contrast - (2036569948)
• Module: Input, Input Message
  Issue
  The "success" icon with a color contrast ratio below 3.00:1.

Foreground: #35AC46
Background: #F8F8F8
The contrast ratio is: 2.8:1

User Impact
Users with low vision will have difficulty identifying this content.

Code Reference

HTML:
<svg class="svg" fill="currentColor" height="100%" viewBox="0 0 16 16" width="100%" xmlns="http://www.w3.org/2000/svg">(...)</svg>

CSS:
host([status="valid"]) .calcite-input-message-icon {
   color: var(calcite-ui-success: #35ac46;);
}

Suggestion
Ensure parts of graphical objects essential for understanding content have sufficient contrast. The required minimum contrast ratio is 3.00:1.

Common examples of qualifying objects include lines in a chart, meaningful icons, and annotations within an image.

Graphics that require particular presentation to preserve their meaning are exempt from this requirement.

To evaluate color contrast, see the Accessible Color Picker extension: https://www.accessibility.dev/

Compliant Code Example

N/A

---

Additional Resources:

• Report Source: Product accessibility evaluation conducted on the Calcite Design System in August, 2022.

[geospatialem]

This doesn't seem like something we need to mitigate, but want to get some design expertise on this prior to closing it out to be sure this is outside of the scope of what we should support.

[ashetland]

I think we can refer to #3145 and close.

[brittneytewks]

Propose to close based on work in #3145 cc: @geospatialem

[geospatialem]

Closing per #7791 (comment) and #7791 (comment).