How can I change the colour of the highlight effect that appears when a required field is not filled?

  • Profile Image
    Nixor
    Asked on December 21, 2011 at 03:59 AM

    Hey,

    Need some help with CSS codes.

    1. In my form, when a required field isn't filled, a pinkish higlighted effect appears. Since my theme is grey and orange, I need some help changing that effect to a lighter orange shade.

    2. The pop up box for the warning message also has a pinkish background. I need some help changing that to either a light grey or a lighter orange. 

     

    I have attached a screen shot too. Thanks 

  • Profile Image
    NeilVicente
    Answered on December 21, 2011 at 04:18 AM

    To change those colors, you would need to inject custom css to your form. Click here to learn how to do that.

    For the field background, use this css code:

    .form-line-error {
        backgroundnone repeat scroll 0 0 red !important;
    }

    For the error message background color, use this:

    .form-error-message {
    background: yellow !important;
    }
    .form-error-arrow-inner {
    border-color: transparent transparent yellow !important;
    }

     

    You may change the color value to whichever color name or color code you fancy.