A GraphQL-powered, NextJs-based, PWA storefront for Saleor. IMPORTANT: This project is [DEPRECATED] in favor of saleor/react-storefront soon to become our default demo and storefront starter pack.
Fix any of the following: Element has insufficient color contrast of 1.5 (foreground color: #ffffff, background color: #51e9d2, font size: 13.5pt (18px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
["button > span"]
<span>Shop sale</span>
Fix any of the following: Element has insufficient color contrast of 1.74 (foreground color: #c4c4c4, background color: #ffffff, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
Fix any of the following: Element has insufficient color contrast of 1.74 (foreground color: #c4c4c4, background color: #ffffff, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
Fix any of the following: Element has insufficient color contrast of 1.74 (foreground color: #c4c4c4, background color: #ffffff, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
Fix any of the following: Element has insufficient color contrast of 1.74 (foreground color: #c4c4c4, background color: #ffffff, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
Fix any of the following: Element has insufficient color contrast of 1.74 (foreground color: #c4c4c4, background color: #ffffff, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
Fix any of the following: Element has insufficient color contrast of 1.74 (foreground color: #c4c4c4, background color: #ffffff, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
Fix any of the following: Element has insufficient color contrast of 1.74 (foreground color: #c4c4c4, background color: #ffffff, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
Fix any of the following: Element has insufficient color contrast of 1.74 (foreground color: #c4c4c4, background color: #ffffff, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
[".slider-slide:nth-child(6) > a > .product-list-item > .product-list-item__category"]
Fix any of the following: Element has insufficient color contrast of 1.74 (foreground color: #c4c4c4, background color: #ffffff, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
Fix any of the following: Element has insufficient color contrast of 1.61 (foreground color: #c4c4c4, background color: #f6f6f6, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
Fix any of the following: Element has insufficient color contrast of 1.61 (foreground color: #c4c4c4, background color: #f6f6f6, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1
Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.
What I'm trying to achieve
What I'm trying to achieve is to have accessibility friendly website, some of the elements have an Incorrect color-contrast.
Steps to reproduce the problem
System information Operating system: Mac OS Browser: Chrome v.84 Help URL: https://dequeuniversity.com/rules/axe/3.5/color-contrast?application=AxeChrome
<span>Shop sale</span>
<p class="product-list-item__category">Juices</p>
<span>3,00 USD</span>
<p class="product-list-item__category">Juices</p>
<p class="product-list-item__category">Polo Shirts</p>
<p class="product-list-item__category">Alcohol</p>
<span>3,00 USD</span>
<p class="product-list-item__category">Groceries</p>
<p class="product-list-item__category">Homewares</p>
<span>20,00 USD</span>
<a href="/collection/summer-collection/1/">Summer collection</a>
<a href="/collection/winter-sale/2/">Winter sale</a>