Ubuntu

Background color for HTML messages

Asked by Vladimir Znak on 2012-04-29

After upgrading to Ubuntu 12.04 I noticed that background color of HTML messages was changed from white to grey. Plaintext emails are rendered as usual (with white background). I suppose it's caused by changes in Ambiance GTK theme.
Is it possible to change the default colors of HTML messages?

Question information

Language:
English Edit question
Status:
Expired
For:
Ubuntu evolution Edit question
Assignee:
No assignee Edit question
Last query:
2012-04-29
Last reply:
2012-05-14
Timo Sirainen (tss-iki) said : #1

Yeah, Evolution has changed quite annoyingly in 12.04 (both Ambiance and Radiance themes):

With me the plaintext message backgrounds are also rendered in grey.

Also the "inactive selected message" background color in mailbox list is bad: 1. Click a message in list -> orange background, 2. click the message body itself -> orange background becomes white/grey making it difficult to see which message is selected.

Selecting text (for copying) is horribly broken HTML messages.

Rhian Geleick (rhianmarie) said : #2

I have something similar on Xubuntu 12.04, all message headers seem to be black text on a black background.

Messages display OK though, both html and plain text, just that trying to find the right one is almost impossible.

Changing the desktop style to Bluebird produces a readable Evolution, but is not a longterm solution.

Launchpad Janitor (janitor) said : #3

This question was expired because it remained in the 'Open' state without activity for the last 15 days.

Rhian Geleick (rhianmarie) said : #4

Thgat is stupid, the fault still exists, just because it is ignored by devs it goes away?

Pablo180 (paultait22) said : #5

Have this problem too; some kind of workaround would be nice - even if it is just to say which gtk classes it uses so we can change the colours manually.

Ivan Mikheykin (diafour) said : #6

Notice same things:

1. grey background for plain text messages
2. grey background for HTML messages
3. selected messages looks non-selected when message list lost its focus

I fixed 2 and 3.

Just put this in file ~/.config/gtk-3.0/gtk.css

/* Black on white for HTML messages in Evolution */
EMailDisplay GtkHTML {
    color: #000000;
    background-color: #ffffff;
}
/* Properly select text in HTML message */
EMailDisplay GtkHTML:selected {
    color: @selected_fg_color;
    background-color: @selected_bg_color;
}
/* Highlight selected message in message list when list is unfocused */
EMailReader MessageList ECanvas:active {
    color: @selected_fg_color;
    background-color: @selected_bg_color;
}

Problem number 1 cannot be fixed without evolution patching. The root cause is deprecated gtk_widget_get_style call in evolution 3.2.3 (mail_display_update_formatter_colors in mail/e-mail-display.c ). 3.5.2 tag and master branch has the same code.

Pablo180 (paultait22) said : #7

Thanks Ivan that worked for me and evolution is displaying (almost) normally again. Much appreciated.

Andreas Pohl (a-ak-u) said : #8

If you change the gtk.css (see Ivan's post) to the following code, you get white background for all messages and also the composer:

/* Black on white for HTML messages in Evolution Reader/Composer */
EMailView GtkHTML {
    color: #000000;
    background-color: #ffffff;
}
EMsgComposer GtkHTML {
    color: #000000;
    background-color: #ffffff;
}
/* Properly select text in HTML message */
EMailDisplay GtkHTML:selected {
    color: @selected_fg_color;
    background-color: @selected_bg_color;
}
/* Highlight selected message in message list when list is unfocused */
EMailReader MessageList ECanvas:active {
    color: @selected_fg_color;
    background-color: @selected_bg_color;
}

Chris McDonough (chrism-plope) said : #9

I added the following to the above to get selected text to show up as orange instead of invisible (at least in plaintext messages and composition boxes):

EMailView GtkHTML:selected {
    color: @selcted_fg_color;
    background-color: @selected_bg_color;
}

EMsgComposer GtkHTML:selected {
    color: @selected_fg_color;
    background-color: @selected_bg_color;
}

Pablo180 (paultait22) said : #10

Thanks Chris, that has the last problem I was having working perfectly now (selected text not showing in plain text and when composing).

Thanks to Ivan and Andreas too, Evolution now seems to work fine, regardless of theme.

Vladimir Znak (init-sub) said : #11

AFAIK, the latest evolution (version from 12.10 for example) use WebKit instead of GtkHTML. I suppose the proposed CSS rules are not compatible with it. Does anybody know how to fix it for WebKit engine?

Pablo180 (paultait22) said : #12

Vladimir, I just upgraded to 12.10 and discovered that you are right, all the GtkHTML rules are ignored by Evolution in 12.10 and it is back to having a grey background in messages.

By chance I discovered that if you replace GtkHTML in the above CSS with WebKitWebView then they seem to be followed again by Evolution in 12.10 and messages have white backgrounds again.

Pablo180 (paultait22) said : #13

For some reason, that only works in the preview pane. Once you open an email, it starts off white then turns to a grey background, whereupon all the other emails in the preview pane also turn grey when reading them. The only way to get them white again is to close Evolution and then refrain from opening any emails in a window.

Back to the drawing board.

Pablo180 (paultait22) said : #14

OK, by trial and error I have discovered that most of the rules used for Evolution in 12.04 in the gtk.css file that solved the various problems are not needed and in fact all you need are the following lines:

EMailView WebKitWebView, EMailReader WebKitWebView {
    color: #000000;
    background-color: #ffffff;
}

This also corrects the behaviour that I mentioned before, opened emails now also have a white background as well as the ones in the preview pane. I didn't have any problems with the background of the composer, that was always white, nor did I have any problems selecting text from emails or the emails themselves in 12.10, so I have taken all the rest out and suffered no ill effects. The only problem I had this time around was the background colour and emails which the above code now corrects.

As I said, trial and error, so I don't *know* why this works, only that it does and there may be better ways of accomplishing this, but I hope this is of use to someone.

Vladimir Znak (init-sub) said : #15

Thanks, Pablo.

Your solution works properly, but it paints white not only the content of the email, but UI with email headers (From, To, ..) changes its color as well.

I would like to have a white background in the message itself only. Does anyone know how to restrict CSS rule to a message body instead of WebKitWebView class?

Alessio Gaeta (meden) said : #16

Using (just)

EPreviewPane .entry {
    background-color: @your_bg_color_var_here;
    color: @your_text_color_var_here;
}

sould do the trick. Basically, with this you are selecting the email text box only.

Vladimir Znak (init-sub) said : #17

It works, thanks a lot!

Thanks for all solutions. I hava applied all solutions for evolution 3.6.4 and it works great except one issue.
If a mail has attachment, after clicking on attachment in pane view the default selected color which was orange turned into gray and makes it difficult to view the attachment name .
Any idea?

Pablo180 (paultait22) said : #19

Samarjit, does that vary with the theme you are using? For example, the selected colour is blue in that scenario for me. What theme are you using?