How do I style the form component

[tobitech]

Please help. I've tried all I could to style the MailChimpSubscribe component but nothing is working. I've used className to add a css class <MailChimpSubscribe className="footer-form" />

I've also used style attribute <MailChimpSubscribe style={{ color: "red" }} />

none of these seem to be working.

[webdiego]

const CustomForm = () => ( <MailchimpSubscribe url={url} render={({ subscribe, status, message }) => (

Use this div as reference, and add your style

  <div>
    <SimpleForm onSubmitted={formData => subscribe(formData)} />
    {status === "sending" && <div style={{ color: "blue" }}>sending...</div>}
    {status === "error" && <div style={{ color: "red" }} dangerouslySetInnerHTML={{__html: message}}/>}
    {status === "success" && <div style={{ color: "green" }}>Subscribed !</div>}
  </div>
)}

/>

Example

div+input { some style }

If you are using styled components .... <FormStyle> <SimpleForm onSubmitted={formData => subscribe(formData)} /> {status === "sending" && <div style={{ color: "blue" }}>sending...} {status === "error" && <div style={{ color: "red" }} dangerouslySetInnerHTML={{__html: message}}/>} {status === "success" && <div style={{ color: "green" }}>Subscribed !} </FormStyle> ....

const FormStyle= styled.div` some style

input{ some style }

`