Closed Bug 485890 Opened 11 years ago Closed 10 years ago

Splitter styles vary. Splitter between mini-month and calendar view is too narrow.

Categories

(Calendar :: Calendar Views, defect)

defect
Not set

Tracking

(Not tracked)

RESOLVED FIXED

People

(Reporter: dave.r.wilson, Assigned: bv1578)

Details

(Keywords: polish)

Attachments

(7 files, 2 obsolete files)

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 6.0; en-GB; rv:1.9.0.8) Gecko/2009032609 Firefox/3.0.8
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9.1b3pre) Gecko/20090223 Lightning/1.0pre Thunderbird/3.0b2

The splitter between the mini-month and calendar view is too narrow, in comparison to splitter between folder pane and thread/message panes in Thunderbird, and in comparison to the Thunderbird/Lightning Today Pane splitter.  Also, the borders of all the splitters in Thunderbird/Sunbird/Lightning varies.  This does not give the look and feel of an integrated application when using Lightning with Thunderbird.  

Reproducible: Always




The following chrome changes would fix this problem:

  #calsidebar_splitter[samesplit]
  {
    width: 4px;
    border-right: 0px;
  }

  #today-splitter[samesplit]
  {
    border-right: 0px;
  }

  #calendar-nav-control[samesplit],
  #view-deck[samesplit]
  {
    border-right: 0px;
  }
Correction -- these are the chrome changes which would fix this problem:

  #calsidebar_splitter
  {
    width: 4px;
    border-right: 0px;
  }

  #today-splitter
  {
    border-right: 0px;
  }

  #calendar-nav-control,
  #view-deck
  {
    border-right: 0px;
  }
Could you add a screenshot that shows the issue and a screenshot that shows how it looks with the patch applied?
Note, the splitter between the Email Tab and the Today Pane has a thicker right-hand border than the splitter between the Folder Tree pane and the Thread/Message panes.
Note, the splitter between the Mini-Month pane and the Calendar View pane is narrower than the splitter between the Thunderbird e-mail Folder Tree pane and Thread/Message panes (compare with first image).  Also, there is a heavier border around the Calendar View pane than around the Thunderbird e-mail Thread/Message panes, which makes the e-mail/calendar splitters look different (compare with first image).
Note, the splitters between the Calendar Tab and the Today Pane, and between the Mini-Month pane and the Calendar View pane, now have the same width and border style.  Both these splitters now have the same width and style as the splitter between the Thunderbird e-mail Folder Tree pane and Thread/Message panes.
Much better for splitter on the left side of the calendar-view. I'm not sure about the right side though. There's a grippy there which is more obvious with a thicker border.
Status: UNCONFIRMED → NEW
Ever confirmed: true
OS: Windows Vista → All
Hardware: x86 → All
Attached patch patch (obsolete) — Splinter Review
This patch changes Lightning' splitters in the way suggested by dave.r.wilson in comment #1 to make them match with Thunderbird' splitters.

To get the same Thunderbid's horizontal splitter ('threadpane-splitter') I had to use two different rules for task-view and calendar-view splitter, it's not completely clear to me why (maybe I miss something), but with the same css rules splitters top borders are different.
I think that these changes don't concern Sunbird so I put the code about the vertical calendar splitter ('calsidebar_splitter'), the same for Sunbird and Lightning, inside lightning.css file.

About today splitter (on the right side), I've changed the look to make it identical to the others, but if observation in comment #6 is right, it must be changed. Anyway, for what it's worth, I like the new one because normally it seems to me a bit cumbersome.

Like those ones attached previously, the following screenshot shows the results on WinXP but with a darker default color.

I can't verify the look on Linux and Mac.
Attachment #387428 - Flags: ui-review?(clarkbw)
Attachment #387428 - Flags: review?(mschroeder)
Attached image screenshot
Splitters with and without patch.
Assignee: nobody → bv1578
Status: NEW → ASSIGNED
I wonder why we need to style the splitter ourself at all? In my opinion the splitter style from the underlying application/toolkit theme should be used automatically.
Decathlon, I have two questions before I proceed with review:

(1) What does it look like if you leave out any custom splitter styling (as suggested by ssitter)? Maybe you can provide a screenshot.

(2) You screenshot is not a default theme on Windows XP. Can you please provide screenshots for the default Classic and Luna theme?

I don't see Thunderbird using "-moz-border-top-colors" for styling the splitter? Why should Calendar use them? Or did I miss some Thunderbird CSS definitions?
Attached patch patch_v2 (obsolete) — Splinter Review
(In reply to comment #10)

> (1) What does it look like if you leave out any custom splitter styling (as
> suggested by ssitter)? Maybe you can provide a screenshot.

Only the splitter 'calendar-view-splitter' (between calendar views and unifinder) has a css rule in Calendar's code:
http://mxr.mozilla.org/comm-central/source/calendar/base/themes/winstripe/calendar-unifinder.css#65
and it's styled to look like Thunderbird's splitters as written in line 65, in fact it's the only that has the right look. If I delete that css rule, every splitter has the same look different from Thunderbird's one. In particular they all have the border on right or bottom side. See following screenshot.

If I don't miss something, it seems to me that Thunderbird/Lightning' splitters take the apparence from 
chrome://global/skin/splitter.css
http://mxr.mozilla.org/comm-central/source/mozilla/toolkit/themes/winstripe/global/splitter.css#44
but they are styled by Thunderbird's code to delete a border and to change width. For Windows theme:
http://mxr.mozilla.org/comm-central/source/mail/themes/qute/mail/mailWindow1.css#316
http://mxr.mozilla.org/comm-central/source/mail/themes/qute/mail/mailWindow1.css#320

deleting these two css rule from mailWindow1.css file, the splitters become identical to Lightning's ones (with a border on right or bottom side).
*I'm not an expert*, I wouldn't know how to apply the Thunderbird style, without modifying toolkit's file or Thunderbird's file, in a different manner than changing style to every Lightning' splitter.
If there were two css classes for Thunderbird' splitter, it would be different because it would be possible to apply those classes to Calendar' splitter (including a css file somewhere), instead, css rules in Thunderbird' splitter are defined with ID selectors.
Maybe defining a 'calendar-splitter' css class inside some css file and adding this class to every splitter xul-element?
Please, if it's possible to do in a different way, let me know how.

> (2) You screenshot is not a default theme on Windows XP. Can you please provide
> screenshots for the default Classic and Luna theme?
> 
> I don't see Thunderbird using "-moz-border-top-colors" for styling the
> splitter? Why should Calendar use them? Or did I miss some Thunderbird CSS
> definitions?

My intention was to add a top colored border in the horizontal splitter 'calendar-view-splitter' because it seemed to me that horizontal splitter in Thunderbird 'threadpane-splitter' has a such border, but I was wrong, now that I've tried with Luna theme, I've realized that border is the bottom border of the mail messages panel that doesn't exist in the unifinder panel, instead it exists in the task panel.

So I've attached a new patch where I merely apply to every splitter the styles of Thunderbird' splitter (see links above) like proposed by dave.r.wilson in comment #1:

horizontal splitter:
  border: none;
  min-height: 5px;

vertical splitter:
  border-right: none;

moreover I've added a bottom border to 'unifinder-search-results-tree' panel with the same style of 'calendar-task-tree' and 'threadTree' panels:
http://mxr.mozilla.org/comm-central/source/calendar/base/themes/winstripe/calendar-task-view.css#94
http://mxr.mozilla.org/comm-central/source/mail/themes/qute/mail/mailWindow1.css#55
In this way it seems working fine with Luna and Classic themes and with my Luna-modified theme as well like the second screenshot shows. In the screenshot I've positioned the splitter over text in mail, unifinder and task panel to show the bottom border mentioned above.


Another issue I've found out: text area of task description in task view is missing the border (you can see it from the last screenshot), should a new bug be opened or may I add one code line to fix this issue too?
The modify would be this:

 #calendar-task-details-description {
     -moz-appearance: none;
-    border: 0;
+    border: 1px solid;  
     margin: 0;
     font-family: serif;
     font-size: 16px;
 }
Attachment #387428 - Attachment is obsolete: true
Attachment #389104 - Flags: review?(mschroeder)
Attachment #387428 - Flags: ui-review?(clarkbw)
Attachment #387428 - Flags: review?(mschroeder)
Look with patch_v2 with highlighted a border over every horizontal splitter.
With Luna and Classic themes this border is white, but e.g. with my non default Luna theme, this border is a clearer version of the default system color.
(In reply to comment #11)
> Another issue I've found out: text area of task description in task view is
> missing the border (you can see it from the last screenshot), should a new bug
> be opened or may I add one code line to fix this issue too?

This is bug 429092! :)
(In reply to comment #14)
> > Another issue I've found out: text area of task description in task view is
> > missing the border (you can see it from the last screenshot), should a new bug
> > be opened or may I add one code line to fix this issue too?
> 
> This is bug 429092! :)

I disagree :-)) (please note my double smile here).
I had read that bug but neither summary, description and comments nor patches, screenshots and, above all, your last comment 13 about open issues, talk about task description area in task view.
Moreover that bug was opened to fix borders problems (mainly task list in task view and today pane) for the 0.9 version where the border of the task description area always worked.
New css rule for task description area with the wrong border was introduced with bug 456379 and checked-in on 2008-12-17  http://tinyurl.com/lpw95d, instead, bug 429092 was opened many months before (and the same for the last comment).
Said this, I agree that this issue should be included in bug 429092 ;-)
also for a discussion about the look of this area that, IMHO, should be similar to that one of mail messages in Thunderbird i.e. without margins and  with a top dark border.
Comment on attachment 389104 [details] [diff] [review]
patch_v2

I can give a r+ on the winstripe part of the patch and the pinstripe changes not releated to splitter style. Splitters in Thunderbird on MacOS X are different form the winstripe ones. Maybe we should split the patch, and commit a first batch. I can take over to fix the pinstripe theme since I have a MacBook Pro available now.
Comment on attachment 389104 [details] [diff] [review]
patch_v2

r=mschroeder for winstripe part (see comment#16).
Attachment #389104 - Flags: review?(mschroeder) → review+
(In reply to comment #16)
> (From update of attachment 389104 [details] [diff] [review])
> I can give a r+ on the winstripe part of the patch and the pinstripe changes
> not releated to splitter style.

I left only winstripe files and calendar-views.css plus calendar-unifinder.css files for the pinstripe theme where there aren't changes to splitters' style. I'm not sure if changes in calendar-unifinder.css file must depend on splitters' style (therefore it is different for pinstripe theme).

About the border of text area of task description (comment #11) what can I do?
Should a "mini-patch" be added to bug 429092?
Attachment #389104 - Attachment is obsolete: true
Attachment #395521 - Attachment description: patch v3 - Winstripe and part of Pinstripe → [checked in] patch v3 - Winstripe and part of Pinstripe
Comment on attachment 395521 [details] [diff] [review]
[checked in] patch v3 - Winstripe and part of Pinstripe

Pushed to comm-central <http://hg.mozilla.org/comm-central/rev/0bdcdd3c85a4>
(In reply to comment #18)
> I left only winstripe files and calendar-views.css plus calendar-unifinder.css
> files for the pinstripe theme where there aren't changes to splitters' style.
> I'm not sure if changes in calendar-unifinder.css file must depend on
> splitters' style (therefore it is different for pinstripe theme).

Follow-up bug 512779.

> About the border of text area of task description (comment #11) what can I do?
> Should a "mini-patch" be added to bug 429092?

Yes, please attach the patch there, and ask me for review.
Status: ASSIGNED → RESOLVED
Closed: 10 years ago
Resolution: --- → FIXED
Target Milestone: --- → 1.0
Target Milestone: 1.0 → 1.0b1
You need to log in before you can comment on or make changes to this bug.