Team showcase - colour contrast levels for text to meet accessibility standards

The text over profile photo option does not meet basic colour contrast accessibility standards. Could a filter be placed on the lower part of the images to make the contrast greater or even a block coloured background?

Even on the layout that has the name sit below the photo, the link text does not meet the standards and is very difficult to read.

2 Likes

Hi there, @tfilippi :wave:

Our devs confirmed that the dark filter is already added to the lower part of the images. If you’d like to make it darker to create a greater contrast, please use this code in the Custom CSS field on the Style tab of your widget’s settings:

.eapp-team-showcase-member-card-gallery-component:hover .eapp-team-showcase-member-card-see-more-component {
  opacity: 1;
}

Regarding the link text that doesn’t meet accessibility standards, you mean the Read Bio button, right?

If this is the case, this CSS code will help you adjust the button’s opacity:

.eapp-team-showcase-member-card-gallery-component:hover .eapp-team-showcase-member-card-see-more-component {
  opacity: 1;
}

Please try it out and let me know if it helped :slightly_smiling_face:

1 Like