-2

This is a weird one I'm scratching my head on. I have a WordPress page that has a HubSpot embedded form. My theme allows dark mode and works well, but when it goes to dark mode the embedded HubSpot form doesn't change. I kind of get it, but... I just can't have it like this. Is there a way that I can strip or override the form's colors or something?

Here's the page: https://datadelivery.app

Shawn Veillon
  • 31
  • 2
  • you really need to use some external service to make a single form? ... 0_o – Flash Thunder Sep 11 '21 at 09:21
  • 1
    @FlashThunder if I understand correctly the plugin integrates email interaction with a CRM so the form isn't there just for the user to send a message, but to record that as well. – A Haworth Sep 11 '21 at 09:32
  • @AHaworth Exactly. There's a LOT going on with it behind the scenes. Makes it easy for me. – Shawn Veillon Sep 12 '21 at 23:35

1 Answers1

0

Since the HubSpot form is embedded into your site, it had no way of knowing when your site's theme is changed. You will need to add some custom CSS to change the form's style when dark-mode is enabled. From the given link, the class .is-dark-theme is added to the <html> tag whenever dark-mode is enabled. So you should be able to add CSS to style your form whenever this class is used. For example, the code below changes the form's labels to white-text.

.is-dark-theme .hs-form * {
  color: #ffffff;
}

You should be able to add CSS for other classes used in the form to change the colors to match your site's dark-mode theme.

veesar
  • 422
  • 3
  • 11