684376 - [Message header]: Make the tango orange more eye-friendly (and a gradient)

Status: RESOLVED FIXED

(Thunderbird :: Theme, defect)

Description

[Nomis101]

Attachment: Patch

The current tango orange is not very eye-friendly and doesn't look so nice in the new header. So, make it better.

Comment 1

[Nomis101]

Attachment: Patch in action

What it looks like. The gradient is adopted from Finder.

Comment 2

[Blake Winton (:bwinton) (:☕️)]

Comment on attachment 557967 [details] [diff] [review]
Patch

I don't mind the gradient, but the text shadow makes it too hard to read.  (Note that the Finder screenshot doesn't have a text shadow either.  ;)

Comment 3

[Jim Porter (:squib)]

Maybe a more subtle text shadow? I kind of like it, but then I don't use a Mac, so I suppose it's all academic to me. :)

Comment 4

[Nomis101]

(In reply to Blake Winton (:bwinton - Thunderbird UX) from comment #2)
> Comment on attachment 557967 [details] [diff] [review]
> Patch
> 
> I don't mind the gradient, but the text shadow makes it too hard to read. 
> (Note that the Finder screenshot doesn't have a text shadow either.  ;)

Oh, I did the shadow because in my feelings its than easier to read (and because it looks cool :-D ). You are right, in my Finder screenshot there is no shadow, but in the Mac-UI there are shadows (see Bug 554113).
But no problem, I can remove the shadow, or make it more subtle, as Jim suggested.

Comment 5

[Nomis101]

Attachment: Subtle and non-shadow

This are examples with a more subtle shadow and with no shadow. For me, I like the subtle shadow more, than the one without shadow. What do you think?

Subtle shadow from: http://mxr.mozilla.org/comm-central/search?string=text-shadow%3A+rgba%28255%2C+255%2C+255%2C+0.4%29+0+1px&find=&findi=&filter=%5E%5B%5E%5C0%5D*%24&hitlimit=&tree=comm-central

Comment 6

[Blake Winton (:bwinton) (:☕️)]

I'm going to have to stick with no shadow.  :)  (I also asked a couple of people, and they chose it as the easier to read option.)

Thanks,
Blake.

Comment 7

[Nomis101]

Attachment: Patch v1.1

OK, here is the patch with no shadow

Comment 8

[Blake Winton (:bwinton) (:☕️)]

Comment on attachment 558746 [details] [diff] [review]
Patch v1.1

Review of attachment 558746 [details] [diff] [review]:
-----------------------------------------------------------------

I mostly like it.  It's rather subtle, but nice.  My one concern is that the focused border on the top is kind of jarring.  I've suggested something below, but I don't know if those are quite the correct colours to use.  (I still see the dotted border when I hover over the focused element, which I think isn't what I want, so the colours might need a little tweaking.)

However, it is better, and close, so I'm going to say ui-r=me, and r=me, with that fixed.

Thanks,
Blake.

::: mail/themes/pinstripe/mail/messageHeader.css
@@ -636,4 +636,4 @@
> >  }
> >  
> >  .emailDisplayButton:focus {
> > -  border: 1px dotted #fcaf3e; /* tango orange */
> > +  border: 1px dotted #F6A942; /* Darkest hue from orange gradient */

What do you think about adding "border-top: 1px dotted #F9CE90; /* Lightest hue from orange gradient */" just after this line?

Comment 9

[Nomis101]

(In reply to Blake Winton (:bwinton - Thunderbird UX) from comment #8)
> What do you think about adding "border-top: 1px dotted #F9CE90; /* Lightest
> hue from orange gradient */" just after this line?

I can do that. But if I fix the top, than we still would see the border on the left and the right side. I think, than we need a gradient at the right and left border. I will see what I can do...

Comment 10

[Nomis101]

Attachment: Fixed review comment (for checkin)

OK, this does the trick for me. I've tested it on my MacBook and my iMac. And I can't see the dotted border anymore while hovering.

Comment 11

[Mark Banner (:standard8)]

Checked in: http://hg.mozilla.org/comm-central/rev/d368e3282946