572472 - Adjust theme styles for touch-enabled css rules

Status: RESOLVED FIXED

(Firefox :: Theme, defect)

Description

[:Felipe Gomes (needinfo for replies!)]

Attachment: Tab-height and close-button changes

Alex, Shorlander,

last year we introduced some theme styles on windows that are only applied for computers with touchscreens (via the -moz-touch-enabled css selector), to increase the clickable area and visual affordance of some elements. We haven't revisited these styles yet for the new theme, and some things looks a bit out of proportion, so I'm posting here a proposed patch + some screenshots to adjust them.

The most significant part is the tab height, which looks too big at the moment(5px higher than default theme).  I've reduced it to what I think looks better, and also due to some shadow+border changes on the new theme, we have a bigger clickable area than 3.6 but with a smaller appearance! win.

Other change I did was to reduce a bit the close button, from 18x18 goes to 17x17. This loses 35px of clickable area, but looks much more compatible with the size, and those pixels hopefully won't be needed after bug 547997.

Things I looked but didn't change because they seem fine are the width of the new tab button and the tab dropdown button. Also, there's the distance between the URL bar dropdown button and the Go arrow.

Of course, these are all my personal opinions, and we can make further changes or drop these styles entirely, depending on your thoughts on it.

Comment 1

[:Felipe Gomes (needinfo for replies!)]

Attachment: Screenshots

Comment 2

[Boris Zbarsky [:bzbarsky]]

How is this related to bug 458100?

Comment 3

[:Felipe Gomes (needinfo for replies!)]

Sorry, meant to write bug 548100

Comment 4

[Alex Faaborg [:faaborg] (Firefox UX)]

Stephen is a better person to make the call on different proportions, but in general it kind of feels off if only some parts of the UI get larger.  For instance I kind of expect to see a larger location bar (and toolbar buttons that share the same height) if the tab strip gets taller, etc.

Comment 5

[:Felipe Gomes (needinfo for replies!)]

Comment on attachment 451644 [details] [diff] [review]
Tab-height and close-button changes

I talked with Stephen on IRC, and these changes look fine for beta1

Comment 6

[Marco Bonardo [:mak] (Away Apr 25 - May 5)]

http://hg.mozilla.org/mozilla-central/rev/86c5fe134b6c