I have an operational contact form that I created for a client and it works fine.
A green background is shown briefly when the form is successfully validated on submission but my client is keen to change the color to something more in keeping with their template.
The color is #d0e9c6 or similar (see example below).
I suspect this may be a standard UI Kit or Bootstrap feature but have been unable to find where to change this.
Help is much appreciated!
Thanks,
Neil
A green background is shown briefly when the form is successfully validated on submission but my client is keen to change the color to something more in keeping with their template.
The color is #d0e9c6 or similar (see example below).
I suspect this may be a standard UI Kit or Bootstrap feature but have been unable to find where to change this.
Help is much appreciated!
Thanks,
Neil
Right click, inspect, find which thing is green.
Thanks Kamron, this is good advice but unfortunately, the green background is only visible for a second or so when the form is submitted and then the confirmation message is displayed.
In Chrome at least you can open Dev Tools with F12 and then when the form turns green, pause execution with F8.
Thanks for helping Kamron and the F8 pause execution is a good tip but doesn't seem to stop the form submission process so I can see what's happening.
OK, I managed to solve this eventually. Thanks for your help Kamron.
I couldn't get the green background to be shown long enough to inspect with web browser developer tools but there was also a red background shown when a field failed validation.
I was able to look at the red background with web browser developer tools which showed me that the background colour was being set in the main CSS file for the template (RocketTheme Iridescent Gantry 4 Template). I was then able to search the CSS file for #d0e9c6 and figure out which CSS needed to be overridden.
I was then able to insert the relevant code into the custom CSS for the template and finally change the colour.
I couldn't get the green background to be shown long enough to inspect with web browser developer tools but there was also a red background shown when a field failed validation.
I was able to look at the red background with web browser developer tools which showed me that the background colour was being set in the main CSS file for the template (RocketTheme Iridescent Gantry 4 Template). I was then able to search the CSS file for #d0e9c6 and figure out which CSS needed to be overridden.
I was then able to insert the relevant code into the custom CSS for the template and finally change the colour.
This topic is locked and no more replies can be posted.
