Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

How to implement zebra striping?

  • 12 replies
  • 0 have this problem
  • 14 views
  • Last reply by david

more options

I grew too used to the zebra striping pattern in my message list, but could not find a way of implementing it in Thunderbird settings. I'm using version 139.0.2 - aarch64.

I did try to use the code available in this forum, which involves creating a folder "chrome" in the user profile and then a file userChrome.css under it. I did turn on toolkit.legacyUserProfileCustomizations.stylesheets and understand this is not recommended, but it did not make any difference anyways.

Any pointer would be much appreciated.

I grew too used to the zebra striping pattern in my message list, but could not find a way of implementing it in Thunderbird settings. I'm using version 139.0.2 - aarch64. I did try to use the code available in this forum, which involves creating a folder "chrome" in the user profile and then a file userChrome.css under it. I did turn on toolkit.legacyUserProfileCustomizations.stylesheets and understand this is not recommended, but it did not make any difference anyways. Any pointer would be much appreciated.

Chosen solution

Mapenzi, David,

I figured out what my issue was. The original code that I had, as well as the one that David sent was working all along. It is just that in dark mode this was not visible due to the choice in the rgba settings (i.e. the rgb colors and the alpha channel settings). More specifically the setting: background-image: linear-gradient(rgba(0,0,0,.06), rgba(0,0,0,.06)!important; means that a black (no red, no green, no blue) and very light tinted (6% of opaqueness or 94% of transparency) mask would be applied to the canvas. In a white background (i.e. under all of the Thunderbird's light themes) you get a very light grey as a result since you are placing a very transparent black mask over a white canvas. In a black background (i.e. under all of the Thunderbird's dark themes) you see nothing, which made me to assume the code was not working.

I addressed my problem by changing that setting to: background-image: linear-gradient(rgba(192,192,192,.4), rgba(127,127,127,.2)) !important; This results in a light-grey background with both dark or light mode.

In hindsight, this should have been obvious to me but, alas, it wasn't. I only noted as in one of my tests in dark mode I saw a very, very slight zebra pattern and then realized what was going on. Anyways, thank you both for your help on this. It made finding the issue a lot easier.

Read this answer in context 👍 0

All Replies (12)

more options

Since you've done the preliminaries, get the CSS from https://pastebin.com/uUXPpT8N and precede it with this line:

@namespace html url("http://www.w3.org/1999/xhtml");

Helpful?

more options

David,

Thank you very much for your prompt reply. Unfortunately, it did not work. I might have misunderstood your (quite clear) instructions so I am attaching a screenshot of the resulting userChrome.css file. Basically, I simply added the line you mentioned and saved the file.

To ensure there was nothing conflicting with my configuration, I: - created a new user profile - added ../chrome/userChrome.css to the new profile - started Thunderbird with that new profile - switched the flag "toolkit.legacy..." to True - restarted Thunderbird - changed from the default card view to table view in vertical mode I still just get a dark continuous background instead of a zebra pattern.

Please, let me know whether I am missing anything obvious. BTW, I noticed that when starting Thunderbird from a terminal (/Applications/Thunderbird.app/Contents/MacOS/thunderbird, I'm on a mac today) I do get a lot of error messages with the same content: "...Rethrowing (from nts_ValueForProperty:) NSInternalInconsistencyException: Unhandled error (NSCocoaErrorDomain, 134092) occurred during faulting and was thrown: Error Domain=NSCocoaErrorDomain Code=134092 "(null)" CoreData: error: Unhandled error occurred during faulting: Error Domain=NSCocoaErrorDomain Code=134092 "(null)" ({ })" ... but Thunderbird does open normally and this doesn't seem related to the problem at hand. I am listing here just in case this might be causing any issue.

Anyways, thanks for your help. Any hints/pointers would be welcomed.

Best regards, Paulo ...

Helpful?

more options

Do you have file explorer to show suffixes? That is, that you don't inadvertently have userChrome.css.txt.

Helpful?

more options

Good point, but if you see in the picture you will note that Sublime Text is color coding it correctly as a css so this should not be the issue. In any case, I also "ls -agh" from the terminal and can confirm that the sufix is css. screenshot attached. Thanks again for your time.

Helpful?

more options

Paulo Costa said

- changed from the default card view to table view in vertical mode I still just get a dark continuous background instead of a zebra pattern.

I'm using the following CSS code to display the "zebra striping" in my thread pane:

/* Alternating row colors in thread pane */

.tree-table { background-color: azure !important; }

#threadTree tr:nth-child(2n) {

background-image: linear-gradient(rgba(0,0,0,.06), rgba(0,0,0,.06)) }

It works on my Mac with actuel release and beta versions of TB

Modified by Mapenzi

Helpful?

more options

Thank you, Mapenzi. Are you using any specific theme?

David: FYI, when I used your code with the new profile it did not work. I then changed the theme from default dark to the default light mode and now I see the zebra pattern. Yet, it does not seem to work on the dark mode. I believe the theme settings are overwriting the code. Does your Thunderbird installation uses dark mode? Also, when I move for my regular profile it does not work with any of the themes so this seems to be a hard-to-track issue.

I'll keep testing.

Helpful?

more options

I am using the "System theme -- auto 1.4.1 " My code also works with the "Light" theme.

Helpful?

more options

I am at a loss on this, but there are some CSS gurus who may see this thread.

Helpful?

more options

Mapenzi said

I am using the "System theme -- auto 1.4.1 " My code also works with the "Light" theme.

The code you sent did work on the new profile when using light mode, but not when using dark mode. Does it work in your computer when the auto mode goes to dark? or in regular dark modes? Thanks for your help.

Helpful?

more options

Off course my code doesn't work - or only partially - in dark mode. I'll sleep over it and tomorrow search for the equivalent code working in dark mode.

Modified by Mapenzi

Helpful?

more options

Chosen Solution

Mapenzi, David,

I figured out what my issue was. The original code that I had, as well as the one that David sent was working all along. It is just that in dark mode this was not visible due to the choice in the rgba settings (i.e. the rgb colors and the alpha channel settings). More specifically the setting: background-image: linear-gradient(rgba(0,0,0,.06), rgba(0,0,0,.06)!important; means that a black (no red, no green, no blue) and very light tinted (6% of opaqueness or 94% of transparency) mask would be applied to the canvas. In a white background (i.e. under all of the Thunderbird's light themes) you get a very light grey as a result since you are placing a very transparent black mask over a white canvas. In a black background (i.e. under all of the Thunderbird's dark themes) you see nothing, which made me to assume the code was not working.

I addressed my problem by changing that setting to: background-image: linear-gradient(rgba(192,192,192,.4), rgba(127,127,127,.2)) !important; This results in a light-grey background with both dark or light mode.

In hindsight, this should have been obvious to me but, alas, it wasn't. I only noted as in one of my tests in dark mode I saw a very, very slight zebra pattern and then realized what was going on. Anyways, thank you both for your help on this. It made finding the issue a lot easier.

Helpful?

more options

Thanks for sharing. I am color-challenged and rely mostly on others to get acceptable settings.

Helpful?

Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.