
-
AuthorPosts
-
January 24, 2019 at 10:31 pm #1058368
Hi Enfold team,
I’m working on customising the dark contact form and was able to adjust quite a bit thanks to your documentation.
As of now everything I added is working except for some or the ‘button’ adjustments.
1. I’m trying to get the border-width of the send button to be 3px – even though I added it it is not changing on my site, but it does work when hovering over the button.
2. I’m trying to change the button font-color to be #cf3662
3. I trying to change the button hover font-color to be white4. Additionally I would like to change the font-size and color of the text I added to a check-box label and for the Captcha Text – but couldn’t find anything that was working
I’m posting what I have added to the Quick CSS styling area here. Please let me know if you need any further information. Thanks :)
#top div .av-dark-form input[type=’text’] {
border-color: #333333 !important;
background-color: transparent;
border-radius: 6px;
font-family: ‘montserrat-regular’
}#top .avia_ajax_form .text_area {
border-color: #333333 !important;
background-color: transparent;
border-radius: 6px;
font-family: ‘montserrat-regular’;
}.av-custom-form-color .button {
border-color: #cf3662 !important;
border-width: 3px !important;
font-color: #cf3662 !important;
background-color: transparent !important;
border-radius: 6px;
font-family: ‘montserrat-regular’;
font-size: 17px;
}.av-custom-form-color .button:hover {
border-color: #cf3662 !important;
border-width: 3px !important;
font-transform: #ffffff !important;
background-color: #cf3662 !important;
border-radius: 6px;
font-family: ‘montserrat-regular’;
font-size: 17px;
}#top .avia_ajax_form .error input[type=’text’],
#top .avia_ajax_form .error .text_area {
background: #ffffff!important;
}January 25, 2019 at 6:15 pm #1058837Hey Diana,
Could you please give us a link to your website, we need more context to be able to help you.
Could you please attach a mockup of what you’re trying to achieve?
Best regards,
VictoriaJanuary 25, 2019 at 7:19 pm #1058879Hello Victoria,
thanks for your fast reply :)
My site is still under construction…can I attach screenshots here?
Thanks,
DianaJanuary 27, 2019 at 10:15 pm #1059443Hi,
Sure, we will see if we can get somewhere with the screenshot.
Best regards,
BasilisJanuary 28, 2019 at 4:52 pm #1059673Hi Again,
sorry is there a way to upload screenshots here? Or is it easier if I give you access to my website?
regards,
DianaJanuary 28, 2019 at 6:13 pm #1059734This reply has been marked as private.February 2, 2019 at 4:33 am #1061834Hi,
Sorry for the late reply, to change the font size of the labels, please use this css:#top.page-id-45 label[for=avia_5_1], #top.page-id-45 label[for=avia_6_1] { font-size: 16px !important; }
To change the border width of the submit button, and the font color, we will have to override a !important; that is in current use, but this should do it:
#top.page-id-45 #av_section_1 .av-dark-form .button { border-width: 3px !important; color: #cf3662 !important; }
To change the background color of the submit button, and font, when hovering:
#top.page-id-45 #av_section_1 .av-dark-form .button:hover { background-color: #cf3662 !important; color: #ffffff !important; }
Best regards,
MikeFebruary 2, 2019 at 1:26 pm #1061979Thanks so much Mike.
Works perfectly :)
Have a great day.
DianaFebruary 2, 2019 at 3:14 pm #1062000Hi,
Glad we were able to help, we will close this now. Thank you for using Enfold.For your information, you can take a look at Enfold documentation here
For any other questions or issues, feel free to start new threads under Enfold sub forum and we will gladly try to help you :)Best regards,
Mike -
AuthorPosts
- The topic ‘Customising dark transparent contact form’ is closed to new replies.