Archived topic
theme overriding gravity forms colours
7 replies · Started by orlaith on April 3, 2023
Hi there, I have colours set via the customizer for gravity forms contact form. Text is set to black & background is set to white. Everything works well but after text has been input it goes white and cannot be seen. I added the CSS below but don't see any changes. Is this being overwritten somewhere that I cannot see?
/*Gravity Forms input colour*/
body #gform_wrapper_1 .gform_body .gform_fields .gfield input {color: black;}
Thanks
Hi there,
Gravity forms is using a bunch of CSS custom properties ( variables to load colors ).
This one in particular is setting that text color:
color: var(--gform-theme-local-color);
good thing about variables as they can be locally scoped. So you can change them on a specific element for better specificity. Try this:
.gform-theme--framework {
--gform-theme-local-color: #000000;
}
Hi David, thanks a bunch. I've added that but it doesn't seem to be doing anything.
Can you disable the SG optimizer so i can see whats going on with the CSS ?
Sure David I have disabled the SG optimiser :) Thanks
Can you try adding this CSS instead?
.gform_wrapper {
--gform-theme-color-inside-control-contrast: #000000 !important;
}
Just checked your CSS file, the CSS above David's CSS is missing a } at the end, make sure you add it.
Thank you Ying & David, that worked perfectly :)
You are welcome :)