Quoted text unreadable in Thunderbird dark theme despite previous email fix

AI-generated summary

PortChange reports that quoted text in Discourse notification emails remains unreadable in Thunderbird 158.0.1 on Windows 11 when using the dark theme with “Use dark mode for message text” unchecked, despite previous fixes. The issue occurs because quotes have a light background (#f8f8f8) but no explicitly defined text color, resulting in light text on a light background. While acknowledging this is likely a Thunderbird bug, PortChange argues that Discourse should implement a workaround to ensure readability for users who are unaware of the specific Thunderbird setting.

A simple fix was identified: adding color:#222222 to the inline style of quotes makes the text readable without changing client settings. However, PortChange notes that this requires a corresponding override for email clients that properly support dark mode to prevent dark text on a dark background. A suggested CSS extension for dark mode includes:

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

Additionally, it was noted that code and pre code elements may suffer from the same lack of explicit text color definition. PortChange requests that Discourse include these compatibility fixes to improve the user experience.

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:

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.

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.

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

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