magda-io / magda

A federated, open-source data catalog for all your big data and small data
https://magda.io
Apache License 2.0
505 stars 92 forks source link

Fix color contrast in Demo #3432

Open mgifford opened 1 year ago

mgifford commented 1 year ago

Describe the bug Some of the text in the demo has insufficient color contrast.

To Reproduce Go here https://demo.dev.magda.io/search?q=climate

This is 1 of 10 identical issues on this page:

Title: WCAG 1.4.3: Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds (.dataset-summary-publisher) Tags: Accessibility, WCAG 1.4.3, color-contrast

Issue: Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds (color-contrast - https://accessibilityinsights.io/info-examples/web/color-contrast)

Target application: Datasets search: climate | Page 1 | Magda - https://demo.dev.magda.io/search?q=climate

Element path: .search-results__result:nth-child(1) > .dataset-summary > .dataset-summary-publisher

Snippet: Australian Bureau of Agricultural and Resource Economics and Sciences

How to fix: Fix any of the following: Element has insufficient color contrast of 3.34 (foreground color: #798fa2, background color: #ffffff, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1

Environment: Chrome version 107.0.0.0

====

This accessibility issue was found using Accessibility Insights for Web 2.35.0 (axe-core 4.4.1), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.