[Resolved] Prime site template

[Terence]

On Prime site template the CF7 contact form displays a result message when the form sends correctly/spam/errors etc, all in several different colours. Only it doesn’t, it only shows the coloured border of the result message. The text of the result message is black on black and not visible.

How do I best change the CSS to ensure it displays the message too, in the right colour?

[Leo]

Hi there,

Looks like it’s just inheriting the body font color in Customizer > Colors > Body.

Try this CSS:

.wpcf7-response-output {
    color: #ffffff;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

Let me know if this helps 🙂

[Terence]

Hi Leo,

Yes, that was as far as I got.

What I wanted the text to do is to have the text inherit the colour from whichever border it appears in.

Terence,

[Leo]

That’s not possible with CSS unfortunately.

[Terence]

What I came up with is this…

/* WPCF7 Form Response Output 
**********************************************/

div.wpcf7-response-output {
	color: #ff0000;
}
div.wpcf7-mail-sent-ok {
	color: #398f14;
}
div.wpcf7-mail-sent-ng,
div.wpcf7-aborted {
	color: #ff0000;
}
div.wpcf7-spam-blocked {
	color: #ffa500;
}
div.wpcf7-validation-errors,
div.wpcf7-acceptance-missing {
	color: #f7e700;
}

[Leo]

Yup you can definitely set them one by one.

What I meant was there is no way to set them to inherit the border colors.

Glad you’ve figured out 🙂

[Terence]

I guess I didn’t explain myself very well because that’s what I meant.

Thank you for helping me get there.

[Leo]

No problem 🙂

[Author]

Posts