Custom theme (dark) does not inject css into the email body (iframe)

[avelino]

I’m developing the Dracula theme for Mailspring, but I can’t inject css into the iframe to change the text color when the background is dark.

Looking at the dark theme shipped by default in Mailspring I saw that we have the file email-frame.less (which is injected into the body of the email by inverting the colors), but it doesn’t work in the custom theme, file email-frame.less is created in Dracula

Issue opened by users of the Dracula theme: Text readability MailSpring issue · Issue #6 · dracula/mailspring · GitHub

test done with 3 different themes:

[asparc (Caspar Gruijthuijsen)]

Hi avelino,

This is an issue that I also encountered when working on my dark theme Predawn. I managed to largely solve it, through a lot of hacks. You could try to install Predawn dark theme. If this theme does work as you want for your test case, you could have a look at these two topics, where I tried to explain what I did (+ some valuable comments of bengotow):
Bug: Dark text using dark themes · Issue #1928 · Foundry376/Mailspring · GitHub
Dark theme vs. Theme Starter version · Issue #5 · Foundry376/Mailspring-Theme-Starter · GitHub

Hope that helps!

[TabbyToffee]

Try creating an email-frame.less file, to modify the email iframe.

The default dark theme does this. This is the file:

.ignore-in-parent-frame {
  body {
    color: #44475a;
    filter: invert(100%) hue-rotate(180deg);
  }

  img {
    filter: invert(100%) hue-rotate(180deg);
  }
}