Tagged: , ,

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • February 25, 2016 at 3:36 pm #589184
    aB-Agenta

    Hi!

    in my contact form, i have elements with and without validation. the element without validation still are marked with an *asterix – the form is still sending if the field is blank, but it is irritating. how can it be removed?

    i also tried to change the background color, if a validation field is left empty. it worked for the text input, but not the email element. can i also change the font color if it is tried to send with the empty validation fields?

    #top #wrap_all .error  .is_empty  {
	background-color: #df6f1f !important;
	}

    another thing at the page: in the URL it attaches a slug: http://www.xxxxx/xxxx/animated-image
    Where is that coming from?????

    thx for looking!
    Lucie

    February 29, 2016 at 3:00 am #590530
    Josue

    Hello,

    Have you tried disabling all third-party plugins to see if it gets fixed?

    Regards,
    Josue

    February 29, 2016 at 10:00 am #590627
    aB-Agenta

    Hi Josue,

    jap, i checked the plugins, no change….

    March 1, 2016 at 7:35 am #591377
    Vinay

    Hey!

    To change background and font color on error please try this CSS

    
/* Validation error bg*/
.form_element.error input {
     background-color: #df6f1f !important;
}
/* Validation error font color*/
.form_element.error input::-webkit-input-placeholder {
     color:#FFF!important;
}

    To target all the browsers please add the following with the above CSS snippet

    ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #FFF;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #FFF;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #FFF;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #FFF;
}
:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
  color:    #FFF;
}

    I checked the validation it works fine except for the date picker it looks like users should enter the date.

    Cheers!
    Vinay Kashyap

    March 1, 2016 at 10:28 am #591442
    aB-Agenta

    Hi!
    the change of the bg color worked fine;
    stays the problem with the font color, the * at the none validation field (the date) and the weird “animated image” slug. :(

    could you take another peek?
    thx!
    Lucie

    March 2, 2016 at 5:28 pm #592200
    Vinay

    Hey!

    Please add the following CSS to Quick CSS to change the font color

    
/* Validation error font color*/
.form_element.error input::-webkit-input-placeholder, 
.form_element.error input:-moz-placeholder,
.form_element.error input::-moz-placeholder,
.form_element.error input:-ms-input-placeholder,
.form_element.error input:placeholder-shown{
     color:#FFF!important;
     opacity: 1;
}

    Best regards,
    Vinay Kashyap

    March 3, 2016 at 1:58 pm #592612
    aB-Agenta

    Hi Vinay!
    nope, unfortunately nothing…

    regards
    Lucie

    March 3, 2016 at 9:10 pm #592931
    Vinay

    Hey!

    This is the final code we added and it is working correctly now 

    /* Validation error font color*/
.form_element.error input {
     background-color: #df6f1f !important;
}

.form_element.error input::-webkit-input-placeholder {
     color:#FFF!important;
}

.form_element.error input:::-moz-placeholder {
     color:#FFF!important;
}

.form_element.error input::-ms-input-placeholder {
     color:#FFF!important;
}

.form_element.error input::placeholder {
     color:#FFF!important;
}

    Regards,
    Vinay Kashyap

    March 8, 2016 at 11:58 am #594954
    aB-Agenta

    Hi Vinnie,

    perfect, thank you very much!
    best regards
    Lucie

    March 8, 2016 at 12:04 pm #594957
    aB-Agenta

    oh, short thing again: it is not working with firefox….

    March 8, 2016 at 12:08 pm #594962
    aB-Agenta

    found it! there was one colon to much. :D
    now it s working fine, thx!

    March 8, 2016 at 1:39 pm #594986
    Vinay

    Hi!

    Glad we could help :)

    Some info we have put together about enfold theme please feel free to check it out here – http://kriesi.at/documentation/enfold/

    Thank you for using Enfold :)

    Regards,
    Vinay Kashyap

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.