Accessibility Issue | AI Chatbot Form Fields

Howdy,

I could be wrong, but it appears Team Elfsight (i.e., developers) changed the background color of the AI Chatbot form fields. See below screenshot.

Currently, they are light gray. Due to several reasons (including accessibility), they should be white.

Kindly review and provide a fix (i.e., revert back to original, white color).

Thank you,

Petar


1 Like

Hi there, @AeroConsultants :waving_hand:

Thank you so much for bringing this to our attention!

You’re right, previously the form fields were right and this issue occurred after a recent update. I’ve forwarded it to the devs and will update you once it’s fixed :slightly_smiling_face:

As a temporary solution, you can use this CSS code:

.es-fields-short-text {
  background-color: white!important;
}
.es-choice-option-choice-control {
  background-color: ...;
}
1 Like

Thank you, @Max. Looking forward to the fix. Standing by. :slight_smile:

2 Likes

Hey @Max,

Upon testing your CSS rules, it appears the CSS rule you provided (see below), will not solve the issue I initially reported.

.es-choice-option-choice-control {
  background-color: ...;
}

Reason: When I use white (#fff) as the background color and check the box, the consent box changes to gray and the checkmark is not visible. Can you please take a look at your code once again? See below.

Tip: The consent box background color should be white and the checkmark color should match the user’s theme/site font color (in my case Gray) or theme/site baseline color (in my case Blue).

Thank you!


1 Like

Hi @AeroConsultants :waving_hand:

Please try to add white for the background color of the checkbox:

.es-choice-option-choice-control {
  background-color: white;
}

I’ve just tested it and everything worked fine:


Could you please double-check it?

1 Like

Hey @Max,

Go it, thanks! I was using “background-color: white!important;”.

I need more coffee! :hot_beverage:

Enjoy your day. :sun:

2 Likes

No problem at all!

Have a great day :wink:

1 Like