Closed Bug 710831 Opened 8 years ago Closed 8 years ago

Tab selector does not blend well with Gloda search pane or mail header

Categories

(Thunderbird :: Theme, defect)

x86_64
Windows 7
defect
Not set

Tracking

(thunderbird11+ fixed)

RESOLVED FIXED
Thunderbird 12.0
Tracking Status
thunderbird11 + fixed

People

(Reporter: mconley, Assigned: andreasn)

References

Details

Attachments

(4 files, 7 obsolete files)

There is a slight discolouration from the tab selector to the tab content for both the Gloda search panes, as well as the message header, when viewing an individual message.

Proposed solutions:

1)  Have the message header use a gradient to transition smoothly from the tab selector.  This is fine if this persists in the normal 3pane view...it might actually look kind of nice.

2)  The right half of the Gloda search pane (the big white chunk) could also stand to be transitioned with a gradient.
Squib also suggested an alternative to my Gloda solution above - we have a toolbar that contains a Gloda search input.  That'd also resolve the issue of the Gloda search input being unavailable when viewing the search results.

Paenglab:  feel like tackling the message pane bit?
Regarding the idea of including another Gloda search input in a toolbar at the top of the Gloda pane - perhaps we could be less duplicate-y by having the Gloda search input default to being in the tabs toolbar... see attached screenshot.

Thoughts?

-Mike
Taking this on.
Assignee: nobody → nisses.mail
Attached patch Fixes Windows headers (obsolete) — Splinter Review
Mike suggested just changing the message header color, so this patch does that.
I think this looks a bit slightly odd in the 3-pane window, so I'll publish another patch doing this for just the single message case, then we can figure out what one to use.
Attached image screenshot of above patch (obsolete) —
from top to bottom:
1. aero glass - single tab
2. aero glass - 3-pane
3. basic - single tab
4. basic - 3-pane
5. classic - single tab
6. classic - 3-pane
Comment on attachment 581953 [details]
screenshot of above patch

I don't really mind this - but then again, it's kinda hard to tell what it looks like in total context...thoughts, Blake?
Attachment #581953 - Flags: ui-review?
Comment on attachment 581953 [details]
screenshot of above patch

I don't really mind this - but then again, it's kinda hard to tell what it looks like in total context...thoughts, Blake?
Comment on attachment 581953 [details]
screenshot of above patch

Argh, submitted too soon.
Attachment #581953 - Flags: ui-review? → ui-review?(bwinton)
Attachment #581953 - Flags: ui-review?(bwinton)
Comment on attachment 581950 [details] [diff] [review]
Fixes Windows headers

So, I dunno.  I agree that it looks weird in the 3-pane, but it looks way better in the message tab.  And I think it looks a little better in the message window.

Perhaps we could do something like we do on Mac, and fade over the first 15-20 pixels from the darker blue of the active tab to the lighter blue of the current header?
Attachment #581950 - Flags: ui-review-
I actually like it. Since that's not a real reason for it to be checked in, here's a more objective one: if we use the tab bar color for the header everywhere, we'll help minimize the number of different (meaningless) colors in the UI, which should make us look more internally consistent.

This might imply some other background color changes too, e.g. the quick filter bar, and maybe the folder pane.
Oh, right, the fewer different colours _was_ one thing I liked that I wanted to mention, but forgot to.  Thanks for pointing that out, Jim!  :)
Good point. It seems I was unable to special case the single message tab case anyhow :)
Attached patch Fix for Linux (obsolete) — Splinter Review
Here is the fix for the header for Linux.
Attached image screenshot of above patch (obsolete) —
(In reply to Andreas Nilsson (:andreasn) from comment #12)
> Good point. It seems I was unable to special case the single message tab
> case anyhow :)

Andreas, you can try this rule:

#folderPaneBox[collapsed="true"] + splitter + vbox #displayDeck[collapsed="true"] +
splitter + #messagepaneboxwrapper #msgHeaderView {
  background: something;
}
(In reply to Richard Marti [:paenglab] from comment #15)
> (In reply to Andreas Nilsson (:andreasn) from comment #12)
> > Good point. It seems I was unable to special case the single message tab
> > case anyhow :)
> 
> Andreas, you can try this rule:
> 
> #folderPaneBox[collapsed="true"] + splitter + vbox
> #displayDeck[collapsed="true"] +
> splitter + #messagepaneboxwrapper #msgHeaderView {
>   background: something;
> }

It would probably be sufficient to do this:

  #displayDeck[collapsed="true"] + splitter + #messagepaneboxwrapper #msgHeaderView

This way would be nice, since then if you collapse the threadpane in the 3pane tab, the colors will match up nicely there too. :)
(In reply to Jim Porter (:squib) from comment #16)
> This way would be nice, since then if you collapse the threadpane in the
> 3pane tab, the colors will match up nicely there too. :)

Wait... actually you can't collapse the threadpane. Of course, that means the CSS in comment 16 is still sufficient.
Thanks for the tip, will do that!
Attached patch new patch (wip) (obsolete) — Splinter Review
Only puts the gradient on if the message is in a tab so that we maintain the flat appearance in the 3-pane view.
Attached patch new patch for Linux and Windows (obsolete) — Splinter Review
Personas not yet fixed, coming up!
Attachment #589874 - Attachment is obsolete: true
Trying to apply the persona to the message header just made it look weird, so I'm going to ask for review on the last patch.
Attachment #589957 - Attachment description: new patch for Linux and Windows (wip) → new patch for Linux and Windows
Attachment #589957 - Flags: ui-review?(bwinton)
Attachment #589957 - Flags: review?(mconley)
Andreas:

Does this affect the appearance of the Gloda tab in any way?

-Mike
(In reply to Mike Conley (:mconley) from comment #23)
> Does this affect the appearance of the Gloda tab in any way?

No. I recall we've been talking about adding a toolbar to that tab in other bugs, so I've left it alone for now. I could add some kind of strip to it if needed.
Andreas:

Ok, cool.  Yeah, my work with the search-in-gloda-tab feature adds a toolbar.  Just wanted to make sure we were still on the same page there.  :)

Reviewing...

-Mike
Comment on attachment 589957 [details] [diff] [review]
new patch for Linux and Windows

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

Just a few nits, but other than that, the code looks pretty good to me.  Before I give my r+, do we have to worry about qute's messageHeader.css?  We only seem to be dealing with Aero here.

::: mail/themes/gnomestripe/mail/messageHeader.css
@@ -51,2 +51,5 @@
> >  }
> >  
> > +/* :::::  message in a tab ::::: */
> > +#displayDeck[collapsed="true"] + splitter + #messagepaneboxwrapper .main-header-area {
> > +  background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 19px);

Is this < 80 characters?  If not, we should split it up with a newline.

::: mail/themes/qute/mail/messageHeader-aero.css
@@ +51,5 @@
>  
> +/* :::::  message in a tab ::::: */
> +#displayDeck[collapsed="true"] + splitter + #messagepaneboxwrapper .main-header-area {
> +  background-image: -moz-linear-gradient(rgba(255, 255, 255, .5),
> +                    rgba(255, 255, 255, .5) 100%);

Since this is inside the -moz-linear-gradient parentheses, we should align it so that the other rgba(255, 255, 255, .5) is right above.

@@ -52,0 +52,9 @@
> > +/* :::::  message in a tab ::::: */
> > +#displayDeck[collapsed="true"] + splitter + #messagepaneboxwrapper .main-header-area {
> > +  background-image: -moz-linear-gradient(rgba(255, 255, 255, .5),
> > +                    rgba(255, 255, 255, .5) 100%);
NaN more ...

These two lines should be indented two spaces.
Comment on attachment 589957 [details] [diff] [review]
new patch for Linux and Windows

Based on the screenshots, I'm saying ui-r=me.  :)
Attachment #589957 - Flags: ui-review?(bwinton) → ui-review+
(In reply to Mike Conley (:mconley) from comment #26)
> Just a few nits, but other than that, the code looks pretty good to me. 
> Before I give my r+, do we have to worry about qute's messageHeader.css?  We
> only seem to be dealing with Aero here.

Good catch. I've finally learned how to trick TB into XP mode and it seems it's not picking up the styling properly. Will fix.
Attached patch patch v3 (obsolete) — Splinter Review
Mike: Did you mean like this?
Attachment #591102 - Flags: ui-review+
Attachment #591102 - Flags: review?(mconley)
Attached patch patch v4Splinter Review
Missed to indent line 63 and 64! :/
Now it should be Perfect. ;)
Attachment #581950 - Attachment is obsolete: true
Attachment #581953 - Attachment is obsolete: true
Attachment #582049 - Attachment is obsolete: true
Attachment #582050 - Attachment is obsolete: true
Attachment #589957 - Attachment is obsolete: true
Attachment #591102 - Attachment is obsolete: true
Attachment #589957 - Flags: review?(mconley)
Attachment #591102 - Flags: review?(mconley)
Attachment #591106 - Flags: ui-review+
Attachment #591106 - Flags: review?(mconley)
Comment on attachment 591106 [details] [diff] [review]
patch v4

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

This looks right to me - though what are our plans for OSX?
Attachment #591106 - Flags: review?(mconley) → review+
(In reply to Mike Conley (:mconley) from comment #32)
> Ping

As mentioned on IRC, I've opened a separate bug about the theme issue under OSX so we can land this while I'll figure out how do deal with that styling, as OSX sports white headers so needs another approach. Bug 721405 is for OS X.
Attachment #591106 - Flags: approval-comm-aurora?
Landed on comm-central as http://hg.mozilla.org/comm-central/rev/81f9de6c78e6
Status: NEW → RESOLVED
Closed: 8 years ago
Resolution: --- → FIXED
Attachment #591106 - Flags: approval-comm-aurora? → approval-comm-aurora+
Target Milestone: --- → Thunderbird 12.0
You need to log in before you can comment on or make changes to this bug.