Stepper and Stepper Item - Ensure parts of graphical objects essential for understanding content have sufficient contrast - (2036570235)

[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: Stepper and Stepper Item - Ensure parts of graphical objects essential for understanding content have sufficient contrast - (2036570235)
• Module: Stepper and Stepper Item
  Issue
  The "Complete" icon with a color contrast ratio below 3.00:1, when checking with "Toggle theme" on.

Foreground: #1B6793
Background: #353535
Contrast ratio: 2.0:1

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

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/

---

Additional Resources:

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

[geospatialem]

The current contrast for the completed icon for our modes is:

• dark mode is 1.99:1
• light mode is 2:1

Should we mitigate to different color schemes?

[geospatialem]

For design consideration - is there an alternative color refer to the above comment we should provide for the "completed" icon, or since it is supplemental, should we close the issue? cc @SkyeSeitz @ashetland

[SkyeSeitz]

The optional icon prop is not essential for understanding status and considered an additive, decorative element for sighted users. For non-sighted users, can we confirm that AT is correctly providing status information?
Thanks so much!

[geospatialem]

The optional icon prop is not essential for understanding status and considered an additive, decorative element for sighted users. For non-sighted users, can we confirm that AT is correctly providing status information?
Thanks so much!

Context is not currently provided to AT when the stepper has the icon attribute, and its children have status information, such as complete or error. Since its an unrelated issue, will close out the above, which refers to the color contrast and open a new issue to tackle for a11y context. There does not appear to be an existing issue.