Quoted text unreadable in Thunderbird dark theme despite previous email fix

Contribute Bug

AI-generated summary

PortChange opened a new topic to report that quoted text remains unreadable in email notifications when using Thunderbird 158.0.1 on Windows 11 with the dark theme. The issue persists despite a previous fix for Android devices, occurring specifically when “Use dark mode for message text” is unchecked in Thunderbird. In this configuration, quotes render with a light background but light-colored text, making them invisible.

Although the root cause is identified as a Thunderbird bug, PortChange argues that Discourse emails appear broken to end users, causing unnecessary frustration. They propose a client-side workaround in Discourse’s HTML email templates. By adding an explicit text color (color:#222222) to the inline styles of blockquotes, the text becomes readable without requiring users to change Thunderbird settings.

In a follow-up post, PortChange refined the proposal to address potential side effects. Adding a light text color requires corresponding overrides for clients that do support dark mode, to prevent dark text on dark backgrounds. The suggested solution involves extending the existing dark mode CSS to include color: #dddddd !important; for code, pre code, and blockquote elements, while also explicitly defining text colors for code and pre tags to prevent similar visibility issues.

PortChange offered to submit a pull request implementing these changes, asking if anyone from the development team (specifically mentioning @[awesomerobot]) was already working on the issue or agreed with the proposed fix. The summary highlights the balance between acknowledging Thunderbird’s role and providing a pragmatic solution for Discourse users who are unaware of email client-specific settings.

1

I’m opening a new topic because the previous bug report about unreadable quotes in dark mode has been closed.

Unfortunately, the issue still exists with Thunderbird 158.0.1 on Windows 11, even with an up-to-date Discourse installation that already includes the earlier fix.

How to reproduce

I’m using Thunderbird’s dark theme with “Use dark mode for message text” unchecked in the message appearance settings.

These are my settings:

grafik
grafik657×177 4.64 KB

With this configuration, quotes in Discourse notification emails have an almost white background, but the text is also displayed in a very light color. This makes them nearly impossible to read.

grafik
grafik536×145 2.74 KB

What I found

I came across an older discussion on Fedora’s Discourse forum describing exactly the same problem:

Quotes and monospace text unreadable in email with dark theme – Fedora Discussion

Back in 2023, the issue was already identified as a Thunderbird bug.

I’m aware that this isn’t necessarily a Discourse bug and that enabling “Use dark mode for message text” in Thunderbird works around the issue.

However, from a user’s perspective, it’s still Discourse notification emails that appear broken. People don’t necessarily know about the Thunderbird setting, and I can understand why they get frustrated with Discourse when parts of an email are unreadable.

Rather than waiting for Thunderbird to handle this properly, I’d prefer a small workaround on the Discourse side, if possible.

A simple fix that worked for me

I looked at the HTML source of one of the affected emails and noticed that the quote has an explicitly defined light background (#f8f8f8), but no text color.

I tried adding color:#222222 directly to the quote’s inline style.

Here is the relevant part of the email source, in quoted-printable format.

Original:

a-topic=3D"4328" style=3D"border-left:5px solid #e9e9e9;background-color:=
#f8f8f8;margin:0;padding:12px 25px 2px 12px;margin-bottom:10px">

Modified:

a-topic=3D"4328" style=3D"border-left:5px solid #e9e9e9;background-color:=
#f8f8f8;color:#222222;margin:0;padding:12px 25px 2px 12px;=
margin-bottom:10px">

And that was enough to make the quoted text readable again, without changing any Thunderbird settings.

grafik
grafik281×144 1.79 KB

Could this be addressed in Discourse?

I understand that simply adding a dark text color might also require a corresponding override for email clients that properly support dark mode. I haven’t tested that part.

Still, the fix for my particular case was surprisingly simple, and the problem has apparently been around for years.

Would it be possible to include a small compatibility fix in Discourse that explicitly defines a suitable text color for quotes?

I realize Thunderbird should handle this better, but I’d rather see readable Discourse emails for everyone than have to explain a Thunderbird workaround to each affected user.

Thanks for taking a look in advance, especially at @awesomerobot

2

I looked into this a bit further and realized that adding color: #222222 to the inline quote style would also require a corresponding dark mode override. Otherwise, email clients that correctly apply the dark mode styles could end up displaying dark text on a dark background.

The existing dark mode CSS could be extended like this:

code,
pre code,
blockquote {
  background: #323232 !important;
  border-color: #454545 !important;
  color: #dddddd !important;
}

I also noticed that code and pre code seem to have a light background without an explicitly defined text color. They could potentially run into the same issue, so it might make sense to add color: #222222 to their default styles as well.

I haven’t tested code blocks separately, but thought it was worth mentioning.

It would be great if this could be fixed soon. It’s a small issue from a technical perspective, but quite frustrating for people receiving these notifications.

Hope that helps @awesomerobot

3

Is there already anyone working on this? I could also create a pull request, if you agree with the proposal, adding color: #222222 to inline CSS for blockcode, code and pre. Plus adding
color: #dddddd !important; in the dark mode css.