625814 - commonDialog icon and text are now differently misaligned (at least on Linux)

Status: RESOLVED FIXED

(Toolkit :: Themes, defect)

Description

[Daniel Holbert [:dholbert]]

Looks like bug 608604 tweaked text positioning in common dialogs to make it more closely match Firefox 3.6.

However, it seems to have pushed the text beyond where it is in Firefox 3.6, making the change (at least for me) a bit visually jarring.

Series of screenshots coming up.
Summary of screenshots:
 * Firefox 3.6: text aligned with icon-top, such that the text's highest-painted-pixel was no higher than the icon's highest-painted-pixel.
 * Nightlies pre-608604: text aligned with icon-center, roughly
 * Nightlies post-608604: text aligned with icon-top, "straddling" the icon's highest-painted-pixel.  (So the top half of the text ends up *above* the icon)

(I've confirmed that this regressed on the day that bug 608604 landed, so I'm pretty certain that's what changed this behavior)

Comment 1

[Daniel Holbert [:dholbert]]

Attachment: trunk pre-625814

Here's a screenshot of what the "Quit Minefield" dialog has looked like until recently. (on Ubuntu 10.10)  This is from the 2011-01-12 nightly.

Comment 2

[Daniel Holbert [:dholbert]]

Attachment: trunk post-625814 (current, undesirable (?))

and here's a screenshot of what it looks like now (with a horizontal line drawn from the top of the icon, to show that some text is higher than that).  This is taken from the 2011-01-13 nightly.

Comment 3

[Daniel Holbert [:dholbert]]

Attachment: firefox 3.6

and here's what it looks like in Firefox 3.6 (also with a horizontal line drawn, showing that the text falls *below* the top of the icon)

Comment 4

[Daniel Holbert [:dholbert]]

Attachment: master password dialog, trunk post-625814 (current, undesirable (?))

Here's a screenshot of another dialog, the master password one, which has a textbox for password entry.

There's now a very oddly large amount of empty space in between the description and the textbox -- it was different enough from what I'm used to that it made me double-check to be absolutely sure I was looking at a legit Firefox dialog and not an evilhacker.com JS prompt.

Comment 5

[Justin Dolske [:Dolske]]

Hmm, so one of the reasons why it previously looked "correct" was that the spacer removed in bug 608604 happened to make it look vertically-centered with the icon (for that icon/font size). But it's not really centered, just pushed 1 line down. Nor, really, do I think we want this centered -- consider multiline text such as alert("foo\nbar\netc\netc\netc\n").

It looks like what's happening now is that the icon has a few pixels of top-margin (via .spaced class and bug 419298), which makes it look slightly too low compared to the text. If I set margin-top=0px on the icon with DOMi, the top of the text and icon are within 1px of each other.

I know the native icon stuff can be a bit finicky, no sure if it's better to remove the margin from the icon, or just add some to the text (on Linux).

Comment 6

[[e-mail]]

(In reply to comment #5)
> Nor, really, do I think we want this centered -- consider multiline
> text such as alert("foo\nbar\netc\netc\netc\n").
It depends on what you centre. Untested examples:
+----+
|icon| one line of text
+----+
With <row align="center">
       five
+----+ lines
|icon| of
+----+ aligned
       text
With <vbox pack="center">
+----+ five
|icon| lines
+----+ of
       packed
       text

Comment 7

[[e-mail]]

(In reply to comment #6)
> (In reply to comment #5)
> > Nor, really, do I think we want this centered -- consider multiline
> > text such as alert("foo\nbar\netc\netc\netc\n").
> It depends on what you centre.
I just tried a few Windows message boxes out. They align the text and icon at the top if the text is taller than the icon, but centre it otherwise.

Comment 8

[[e-mail]]

Attachment: Proposed patch

If the text is taller, then the pack has no effect, and the icon is still top-aligned with the text. If the icon is taller, then the pack takes effect, and the text is therefore aligned with the centre of the icon.

I assume that Linux works the same way as Windows.

Comment 9

[Justin Dolske [:Dolske]]

Pushed http://hg.mozilla.org/mozilla-central/rev/62ae87cc7f02