microsoft-graph-toolkit icon indicating copy to clipboard operation
microsoft-graph-toolkit copied to clipboard

[MGTP Person Card-Style - Custom size properties]: The Luminosity Contrast Ratio of ‘Email, message, video, audio…’ icons controls are '2.599:1' which is less than 3:1.

Open Raisul123 opened this issue 1 year ago • 0 comments

Test Environment: OS Build: Windows 11  Version: 24H2 (OS Build 26058.1400)  Browser: Edge dev  Browser Version 123.0.2400.1 (Official build) dev (64-bit) URL: Overview - Docs ⋅ Storybook (mgt.dev) Tool: Accessibility Insight for web

Repro Steps:

  1. Open the above URL.
  2. The ‘Microsoft Graph Toolkit Playground' Overview page will get displayed.
  3. Navigate to the ‘MGTP-Person-Card’ and activate it.
  4. Navigate to the ‘Style’ and activate it.
  5. Navigate to the ‘Custom size properties’ and activate it.
  6. Check luminosity ratio of ‘Email, message, video, audio…’ icons control with AI tool and observe the issue.

Actual Result: The Luminosity Contrast Ratio of ‘Email, message, video, audio…’ icons controls are '2.599:1' which is less than 3:1.

Expected Result: The Luminosity Contrast Ratio of ‘Email, message, video, audio…’ icons controls should be equal or greater than 3:1.

User Impact: Low vision users would face difficulty in seeing the icon controls if the color contrast ratio of the control is less than 3:1.

WCAG Reference: Understanding Success Criterion 1.4.11: Non-text Contrast | WAI | W3C

“ Have feedback on bugs logged, please tag bug as “A11yRCA“ and add your feedback in the comment section. “

Attachments: mgtp-person-card-CCA fail for icon controls

Raisul123 avatar Mar 06 '24 10:03 Raisul123