Description

The default theme has a number of elements that fail the Web Content Accessibility Guidelines (WCAG) 2.0 AA contrast ratio thresholds (https://dequeuniversity.com/rules/axe/2.2/color-contrast).

The Lighthouse Accessibility audit identifies the failing elements:

• hyperlinks/buttons
• quote/blockquote
• footer text

The failing elements can be addressed with the following CSS changes:

Hyperlinks/buttons

• Increase contrast of $accent-color with change from #00848a to #00838a

Quote/blockquote/footer

• Increase contrast of $text-color with change from #222831 to #181c22, or
• Change color value from tint($text-color, 40%) to tint($text-color, 35%) to reduce tint for blockquote, q (_base.scss) and .site-footer (_footer.scss)

The first approach can be implemented with a new theme skin.

Alternatively, the default theme can be updated directly with the $accent-color change, and either the $text-color change or reduced tint.

I'm happy to create a pull request if any of these approaches are acceptable.

Environment

• Basically Basic version: 1.4.0
• Ruby gem or remote theme version: Both
• Jekyll version: 3.7.3
• Git repository URL:
• Operating system: All
• GitHub Pages hosted (if yes provide URL to site):

Expected behavior

Increase the default theme skin score to 100 on the Lighthouse Accessibility audit.

Steps to reproduce the behavior

1. In Google Chrome, go to https://mmistakes.github.io/jekyll-theme-basically-basic/markup/markup-html-elements-and-formatting/
2. Open Chrome DevTools.
3. Click the Audits tab.
4. Click Perform an audit. DevTools shows you a list of audit categories. Untick all except Accessibility.
5. Click Run audit. Once completed, the Lighthouse report lists the elements that do not have a sufficient contrast ratio.