Communities

ID:
communities
Automated score:
95.8
URL:
https://sem1.dev.stackenterprise.co/communities
View JSON file

5 violations: Light: 1Dark: 1HC Light: 2HC Dark: 1

Ensure the contrast between foreground and background colors meets WCAG 2 AAA enhanced contrast ratio thresholds. Elements must meet enhanced color contrast ratio thresholds. Help URL

HTML

<li class="fs-fine tt-uppercase ml12 mt24 mb4 fc-light">
            Private Teams
        </li>

Target

.fs-fine

Summary

Fix any of the following:

  • Element has insufficient color contrast of 6.79 (foreground color: #525960, background color: #f9fafa, font size: 8.3pt (11px), font weight: normal). Expected contrast ratio of 7:1

HTML

<p class="s-page-title--description">

Target

.s-page-title--description

Summary

Fix any of the following:

  • Element has insufficient color contrast of 6.79 (foreground color: #525960, background color: #f9fafa, font size: 11.3pt (15px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/communities/new" class="s-btn s-btn__filled">Add Community</a>

Target

.s-btn__filled

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.66 (foreground color: #ffffff, background color: #1b75d0, font size: 9.8pt (13px), font weight: normal). Expected contrast ratio of 7:1

HTML

<button class="s-btn ml8 mb8 s-btn__outlined" data-controller="communities-toggle-membership-button" data-communities-toggle-membership-button-is-member-value="false" data-communities-toggle-membership-button-url-value="/communities/toggle-membership/7312" data-communities-toggle-membership-button-origin-value="CommunitiesList" data-communities-toggle-membership-button-fkey-value="21cd58cfedc56de8a0434a8c9a61fe744a250b2aa1ba28e2507f22bfc469e7ca" data-communities-toggle-membership-button-loading-class="is-loading" data-communities-toggle-membership-button-selected-class="is-selected" data-communities-toggle-membership-button-danger-classes-value="s-btn__danger">

Target

.ml8

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.66 (foreground color: #1b75d0, background color: #ffffff, font size: 9.8pt (13px), font weight: normal). Expected contrast ratio of 7:1

HTML

<h3 class="fs-body3 fw-normal mb12">Community-AHFk2jIMrQ</h3>

Target

h3

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.66 (foreground color: #1b75d0, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

Ensure that lists are structured correctly. <ul> and <ol> must only directly contain <li>, <script> or <template> elements. Help URL

HTML

<ul class="s-navigation s-navigation__vertical">

Target

nav[role="navigation"] > .s-navigation.s-navigation__vertical

Summary

Fix all of the following:

  • List element has direct children that are not allowed: ul

Ensure that lists are structured correctly. <ul> and <ol> must only directly contain <li>, <script> or <template> elements. Help URL

HTML

<ul class="s-navigation s-navigation__vertical">

Target

nav[role="navigation"] > .s-navigation.s-navigation__vertical

Summary

Fix all of the following:

  • List element has direct children that are not allowed: ul

Ensure that lists are structured correctly. <ul> and <ol> must only directly contain <li>, <script> or <template> elements. Help URL

HTML

<ul class="s-navigation s-navigation__vertical">

Target

nav[role="navigation"] > .s-navigation.s-navigation__vertical

Summary

Fix all of the following:

  • List element has direct children that are not allowed: ul

Ensure that lists are structured correctly. <ul> and <ol> must only directly contain <li>, <script> or <template> elements. Help URL

HTML

<ul class="s-navigation s-navigation__vertical">

Target

nav[role="navigation"] > .s-navigation.s-navigation__vertical

Summary

Fix all of the following:

  • List element has direct children that are not allowed: ul