You are viewing limited content. For full access, please sign in.

Question

Question

Fields Highlighted in Green and Red

asked on February 9, 2017

I've noticed since upgrading to 10.2 when previewing a form, that when a field is filled in, it highlights it in green, and when it is missing required fields, it highlights it in red.  I don't mind the red, but I'm not really liking the green, it kind of clashes with the color scheme of my form theme.

I know I can edit this with CSS, and I am planning to do that, but I'm curious why this isn't included in the Themes customization screen, since that would be a more preferable way to change the settings (and would allow me to more easily adjust multiple forms, by adjusting the reused theme).

Thank you!

0 0

Answer

SELECTED ANSWER
replied on February 9, 2017

We will consider support customize it using Theme tabs, thanks for your feedback.

0 0

Replies

replied on February 13, 2017 Show version history

Here's the CSS code to turn the green highlighting off if desired.

/*eliminate the default setting of green highlighting when a field is populated correctly*/
input.parsley-success { 
  color : #555;
  background-color : white;
  border-width : 1px; 
  border-color : #A9A9A9; 
} 

 

3 0
replied on February 13, 2017

Of course input.parsley-success only applies to input fields, other options would be:

input.parsley-success, textarea.parsley-success, select.parsley-success, etc.

0 0
replied on June 18, 2020

 

Hi Matthew,

 

Did you have to change any settings to have this functionality?

 

I have Forms 10.4.3 and can't get it to highlight fields without CSS.

 

Thanks,

0 0
replied on June 19, 2020

It's possible that the functionality of the form highlighting changed between the version of Forms that I'm on and 10.4.3 (I'm not there yet).

You would need to review your form when the green highlighting is in place due to valid data entry.  Go to your browsers inspect element view (F12 in Google Chrome) and examine the highlighted field.  If you see that the field has the parsley-success class assigned to it, then this CSS should be working.

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.