Black Borders on Input Fields in Elfsight Plugins

Ask the Community General Questions
, ,
1
  • Issue description:

Hi!

I have two plugins with input fields: Form-Builder and WhatsApp-Chat. Both plugins display black borders when used. I suspect that something in Squarespace might be interfering.

I’ve already tried removing all custom code and custom CSS from the site, but the issue persists. I’m not sure where this problem is originating from.

Interestingly, I don’t experience this problem in the preview on Elfsight; it only appears once I integrate them into the site.

Can someone help me identify the source of this issue?

image
image725×283 6.57 KB

image

1 Like
3

#1. With Form input
Use this code to Website Tools > Custom CSS (Squarespace)

div.code-block input {
    outline-color: transparent !important;
}

#2. With Whatsapp
Use this code to Custom CSS box

div[class*="eapps-whatsapp-chat"] textarea {
    outline-color: white !important;
}
3 Likes
4

Hey there @Patrick_Prziborsky :wave:

I guess the solution by @tuanphan should work great. However, our devs have already added these codes to the Custom CSS fields of your widget’s setting to fix the issue:

Form Builder:

input, textarea {
  outline: none !important;
}

WhatsApp Chat:

textarea {
  outline: none !important;
}

Please check your website and let me know if the widgets look fine now :slightly_smiling_face:

1 Like
5

Yes it works! Thank you.
Also thanks for the help @tuanphan

2 Likes
6

Great! You are always welcome :wink: