854555 - icons in the Downloads view are slightly "squashed" on OS X

Status: RESOLVED FIXED

(Firefox :: Bookmarks & History, defect)

Description

[Jonathan Kew [:jfkthame]]

Attachment: squashed icons in the Downloads view

In the Downloads view of the Library window (e.g. accessed by clicking Show All Downloads), the downloaded item icons are slightly squashed vertically (or fattened sideways, if you prefer to think of it that way).

This is most obvious for icons that include circular elements, such as the Nightly globe or the QuickTime logo in the attached screenshot.

Comment 1

[Jonathan Kew [:jfkthame]]

This appears to be a result of reducing the height of richlistitem.download in bug 823095; the new height of 6em is not quite large enough for the 64px icons we're getting, so they get scaled down in the y-direction to make them fit.

Accordingly, the simplest fix is to increase the height of those items.

Comment 2

[Jonathan Kew [:jfkthame]]

Attachment: don't squash file icons in the Downloads view

Comment 3

[Jonathan Kew [:jfkthame]]

Attachment: use smaller icons in the Downloads view

Personally, however, I think the icons in that view look way too big, and it'd be better to constrain them to 32px and reduce the item height accordingly; something like this. But that's a much more drastic change; maybe UX people really want the big icons there?

Comment 4

[:Gavin Sharp [email: [e-mail]]]

(In reply to Jonathan Kew (:jfkthame) from comment #1)
> This appears to be a result of reducing the height of richlistitem.download
> in bug 823095; the new height of 6em is not quite large enough for the 64px
> icons we're getting, so they get scaled down in the y-direction to make them
> fit.
> 
> Accordingly, the simplest fix is to increase the height of those items.

Can we define the height using -moz-max(Xpx,7em), or some such, to make things more robust to changes in default font sizes (which IIRC affects em sizing but not px sizing)?

Comment 5

[Marco Bonardo [:mak]]

(In reply to :Gavin Sharp (use [e-mail] for email) from comment #4)
> Can we define the height using -moz-max(Xpx,7em), or some such, to make
> things more robust to changes in default font sizes (which IIRC affects em
> sizing but not px sizing)?

Also the panel may have similar problems (http://mxr.mozilla.org/mozilla-central/source/browser/themes/windows/downloads/downloads.css#54)
Fwiw, we reduced the height in the Library to increase number of entries visible at once, I'd probably vote for the smallest em increase we may take.

Btw, it's possible UX wants to evaluate changes to the icons size, we may try asking.

Comment 6

[Jonathan Kew [:jfkthame]]

Attachment: don't squash file icons in the Downloads view

Using -moz-max() as suggested in comment 4 should make this a bit more robust.

Comment 7

[Mike Conley (:mconley) (:⚙️)]

(In reply to Marco Bonardo [:mak] (Away Mar 27 - Apr 2) from comment #5)
> Btw, it's possible UX wants to evaluate changes to the icons size, we may
> try asking.

I agree. Needinfo'ing shorlander.

Comment 8

[Jonathan Kew [:jfkthame]]

Attachment: screenshot with 32x32 download icons

For comparison, here's a screenshot of the Downloads view using the "smaller icons" patch, where the download item icons are 32x32 px (and the item height is reduced to 4em). To my eye, this seems more in proportion to the rest of the interface (as well as allowing more items to be visible in the list).

Comment 9

[Mike Conley (:mconley) (:⚙️)]

Comment on attachment 729549 [details]
screenshot with 32x32 download icons

What do you think of this shorlander?

Comment 10

[Marco Bonardo [:mak]]

(In reply to Mike Conley (:mconley) from comment #9)
> Comment on attachment 729549 [details]
> screenshot with 32x32 download icons
> 
> What do you think of this shorlander?

the screenshot should also show an in-progress download to be able to evaluate properly... that would add a third row with the progress bar.

Comment 11

[Jonathan Kew [:jfkthame]]

Attachment: screenshot, current download manager (large, slightly squashed icons) with in-progress download

Comment 12

[Jonathan Kew [:jfkthame]]

Attachment: screenshot, download manager with 32px icons and in-progress download

In this case, the presence of the progress bar causes the in-progress item to expand vertically - note that it is slightly taller than the other items in the list. It will automatically shrink to the standard height when the download completes.

Personally, I don't think this would bother me; it seems quite reasonable for the "active" item(s) to be enlarged a bit while they have a progress indicator present. But I could understand if it's considered undesirable.

Comment 13

[Jonathan Kew [:jfkthame]]

Attachment: screenshot, download manager with 48px icons

Here's an intermediate option: use 48px icons, and a correspondingly larger item height (but still slightly smaller than the current height). This allows room for the progress indicator to be displayed without altering the item height in the list.

Comment 14

[Jonathan Kew [:jfkthame]]

Comment on attachment 735105 [details]
screenshot, download manager with 48px icons

Could we get some guidance on what to do with the icons here, please? The current "squashed" icons (attachment 729168 [details]) look really poor, but which fix is preferred: increase the item height to avoid squashing them, or use smaller (48px or 32px) icons?

Comment 15

[Marco Bonardo [:mak]]

Since users are already complaining about items taking too much space, I'd probably vote to avoid increasing the items height.

Comment 16

[Jonathan Kew [:jfkthame]]

FWIW, I agree - the 64px icons seem excessively big to me, and they're the factor forcing such a large item height.

I'll attach the "medium" version of the patch, which makes the icons 48px (as shown in attachment 735105 [details]). Maybe we can get that reviewed and landed...

Comment 17

[Jonathan Kew [:jfkthame]]

Attachment: use smaller (48px) icons in the Downloads view

Comment 18

[Stephen Horlander [:shorlander]]

This is only a problem in the Library view on Retina displays as far as I can tell. 

The icons in the panel and the Library view are (and are supposed to be) 32 x 32 at regular resolution. So 32 is the right size.

Comment 19

[Stephen Horlander [:shorlander]]

Comment on attachment 735105 [details]
screenshot, download manager with 48px icons

The icon should be 32px we just need to use the correct @2x icon on Retina displays. The panel doesn't appear to have this problem.

Comment 20

[Stephen Horlander [:shorlander]]

Comment on attachment 729549 [details]
screenshot with 32x32 download icons

Cancelling, see other review comment.

Comment 21

[Jonathan Kew [:jfkthame]]

Attachment: ensure download icons are 32px even on Retina Macs

OK, in that case I believe this is all we need to do here.

Comment 22

[Mike Conley (:mconley) (:⚙️)]

Can I assume based on these latest developments that my review is no longer required on attachment 729299 [details] [diff] [review] and attachment 740749 [details] [diff] [review]?

Comment 23

[Jonathan Kew [:jfkthame]]

Indeed; I've obsoleted those. (Though if you want to take the review on attachment 741370 [details] [diff] [review], based on shorlander's comment re the desired result, I expect that'd be fine.)

Comment 24

[Stephen Horlander [:shorlander]]

Comment on attachment 741370 [details] [diff] [review]
ensure download icons are 32px even on Retina Macs

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

Tested on regular and Retina, looks good!

Comment 25

[Jonathan Kew [:jfkthame]]

https://hg.mozilla.org/integration/mozilla-inbound/rev/a1ead1605ade

Comment 26

[Ryan VanderMeulen [:RyanVM]]

https://hg.mozilla.org/mozilla-central/rev/a1ead1605ade

Comment 27

[Bogdan Maris, Desktop Test Engineering]

Mozilla/5.0 (Macintosh; Intel Mac OS X 10.8; rv:23.0) Gecko/20130426 Firefox/23.0

Verified as fixed on latest Nightly (buildID: 20130426030834).