Thunderbird 68: CSS to change Quote Colours

Question

in older Thunderbird, I used the addon "QuoteColors", which nicely color quoted text in emails. With Thunderbird 68, this addon is no loner compatible, so I am trying to achieve the same with css:

This is my userContent.css

blockquote[type=cite] {
  border-color: #ff3f55 ! important;
  color: #ff463a ! important;
  background: #454545;  ! important;
}

blockquote[type=cite] blockquote {
  border-color: #fad123 ! important;
  color: #fad123 ! important;
  background: #656565;  ! important;
}

blockquote[type=cite] blockquote blockquote {
  border-color: #3022f0 ! important;
  color: #1e0fe4 ! important;
  background: #858585;  ! important;
}

This works very nicely, but only in the main window.

When I click "reply" and the compose window opens, the quoted text is unaffected.

How can I use my css colors, to change the quoted text in com,pose window as well ?

I am using plaintext format in the compose window, in case that's relevant.

@αғsнιη - when I used the QuoteColors addon in earlier version, it worked with plaintext as well — Martin Vegter, Jan 18 '20 at 07:16
@400-the-cat hehe :D you should of tagged me directly lol i'll post the solution later today ;) αғsнιη may be right about the plaintext thing but there is probably an other way around — intika, Jan 20 '20 at 12:30
@intika - we meet again, old friend. I new I could rely on you. — Martin Vegter, Jan 20 '20 at 13:40
@400theCat i am updating quotecolors extension to make it compatible v68x... with userContent.css that wont be easy because of the plaintext format (no css) — intika, Jan 20 '20 at 13:44

score 2 · Accepted Answer · answered Jan 20 '20 at 18:14

Thunderbird addon

I just updated the extension QuoteColors; it is released under the name New QuoteColors, note that the extension's xpi file is signed to ease the installation. The extension does not handle the message composer/editor, this require additional work to make it compatible with that section, i will edit my answer later on if i have the time to work on this.

Sources & site: Github page

Download: v0.3.5 release (compatible v60.x and v68.x)

Mozilla addons site: addons.thunderbird.net (still under review)

Custom CSS:

Customizing the message composer while in plain-text mode is not an easy task as plain-text editing does not have any css and thus can not handle css customisations, BUT this depend on the way you are applying plain-text because Thunderbird can be setup to compose the message in html while sending it in plain-text.

please test the following code and let me know ;) note that this is an exhaustive custom CSS list for the matter from TB v68.4.1 for testing purpose while technical details about your setup are missing

span[_moz_quote=true] {
  color: green !important;
  background: green !important;
  background-color: green !important;
  border-color: green !important;
}

pre[_moz_quote=true] {
  color: green !important;
  background: green !important;
  background-color: green !important;
  border-color: green !important;
}

/* :::: ---------------------------------------------------------------------------------------- ::::: */

/* ::::: message text, incl. quotes ::::: */

.moz-text-flowed blockquote,
.moz-text-plain blockquote {
  border-color: red !important;
  color: red !important;
  background: red !important;
  background-color: red !important;
}

.moz-text-plain pre {
  border-color: red !important;
  color: red !important;
  background: red !important;
  background-color: red !important;
}

.moz-text-plain[wrap="true"] {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

.moz-text-plain[wrap="false"] {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

.moz-text-plain[wrap="flow"] .moz-txt-sig {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

.moz-text-plain[graphical-quote="false"] blockquote {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

.moz-text-plain[graphical-quote="true"] .moz-txt-citetags {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

.moz-txt-underscore {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

.moz-txt-formfeed {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

/* :::: ---------------------------------------------------------------------------------------- ::::: */

body.light blockquote {
  border-inline-start: 2px solid blue !important;
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

body.sepia blockquote {
  border-inline-start: 2px solid blue !important;
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

body.dark blockquote {
  border-inline-start: 2px solid blue !important;
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

.moz-reader-content blockquote {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

/* :::: ---------------------------------------------------------------------------------------- ::::: */

body blockquote[type=cite] {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

/* :::: ---------------------------------------------------------------------------------------- ::::: */

body blockquote[type=cite] {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

blockquote[type=cite] blockquote[type=cite] {
  color: red !important;
  background: red !important;
  background-color: red !important;
}

blockquote[type=cite] blockquote[type=cite] blockquote[type=cite] {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

blockquote[type=cite] blockquote[type=cite] blockquote[type=cite] blockquote[type=cite] {
  color: red !important;
  background: red !important;
  background-color: red !important;
}

blockquote[type=cite] blockquote[type=cite] blockquote[type=cite] blockquote[type=cite] blockquote[type=cite] {
  color: red !important;
  background: red !important;
  background-color: red !important;
}

/* :::: ---------------------------------------------------------------------------------------- ::::: */

.moz-email-headers-table,
.moz-email-headers-table > tbody > tr > th,
.moz-email-headers-table > tbody > tr > td,
blockquote[type=cite] table,
blockquote[type=cite] table > tbody > tr > th,
blockquote[type=cite] table > tbody > tr > td {
  border: 1px solid transparent !important;
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

table.moz-email-headers-table:hover,
table.moz-email-headers-table:hover > tbody > tr > th,
table.moz-email-headers-table:hover > tbody > tr > td,
blockquote[type=cite] table:hover,
blockquote[type=cite] table:hover > tbody > tr > th,
blockquote[type=cite] table:hover > tbody > tr > td {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

/* :::: ---------------------------------------------------------------------------------------- ::::: */

body > p:-moz-first-node, td > p:-moz-first-node, th > p:-moz-first-node,
body > dl:-moz-first-node, td > dl:-moz-first-node, th > dl:-moz-first-node,
body > multicol:-moz-first-node, td > multicol:-moz-first-node, th > multicol:-moz-first-node,
body > blockquote:-moz-first-node, td > blockquote:-moz-first-node, th > blockquote:-moz-first-node,
body > h1:-moz-first-node, td > h1:-moz-first-node, th > h1:-moz-first-node,
body > h2:-moz-first-node, td > h2:-moz-first-node, th > h2:-moz-first-node,
body > h3:-moz-first-node, td > h3:-moz-first-node, th > h3:-moz-first-node,
body > h4:-moz-first-node, td > h4:-moz-first-node, th > h4:-moz-first-node,
body > h5:-moz-first-node, td > h5:-moz-first-node, th > h5:-moz-first-node,
body > h6:-moz-first-node, td > h6:-moz-first-node, th > h6:-moz-first-node,
body > listing:-moz-first-node, td > listing:-moz-first-node, th > listing:-moz-first-node,
body > plaintext:-moz-first-node, td > plaintext:-moz-first-node, th > plaintext:-moz-first-node,
body > xmp:-moz-first-node, td > xmp:-moz-first-node, th > xmp:-moz-first-node,
body > pre:-moz-first-node, td > pre:-moz-first-node, th > pre:-moz-first-node,
body > ul:-moz-first-node, td > ul:-moz-first-node, th > ul:-moz-first-node,
body > menu:-moz-first-node, td > menu:-moz-first-node, th > menu:-moz-first-node,
body > dir:-moz-first-node, td > dir:-moz-first-node, th > dir:-moz-first-node,
body > ol:-moz-first-node, td > ol:-moz-first-node, th > ol:-moz-first-node {
  color: red !important;
  background: red !important;
  background-color: red !important;
  border-color: red !important;
}

@400-the-cat ChangeQuote can be used to enforce replying in text mode... — intika, Jan 20 '20 at 18:45
the first block (the first 6 lines) does basically 95% of what I needed. I have no idea what the rest of the code is for. — Martin Vegter, Jan 21 '20 at 05:36
@400-the-cat I bet that one would work it's why i put it at first :D ... other code are for quote in different situation depending on the setup (i posted all/any editable code for quote for v68). what's the missing 5% ? can you update the question with some captures. — intika, Jan 21 '20 at 10:39
here is a screenshot: https://ibb.co/JBz9cGb as it looks now (using your first 6 lines). Ideally, the different levels of reply should be able to be colored differently (,ie <, <<). Also the first line starting with > is not colored. But these are details. — Martin Vegter, Jan 22 '20 at 02:50
@400theCat thanks for the bounty, i appreciate it, i still have this on my todo for this week, i will comment back here later on for the missing 5% ;) — intika, Jan 23 '20 at 19:13

Thunderbird 68: CSS to change Quote Colours

1 Answers1