Last Comment Bug 679708 - Further Lion-ize Toolbar Icons
: Further Lion-ize Toolbar Icons
Status: RESOLVED FIXED
: addon-compat
Product: Firefox
Classification: Client Software
Component: Theme (show other bugs)
: Trunk
: x86 Mac OS X
: -- normal (vote)
: Firefox 9
Assigned To: Stephen Horlander [:shorlander]
:
Mentors:
Depends on: 679717
Blocks: 683414 667480
  Show dependency treegraph
 
Reported: 2011-08-17 07:54 PDT by Stephen Horlander [:shorlander]
Modified: 2011-11-15 07:31 PST (History)
7 users (show)
See Also:
Crash Signature:
(edit)
QA Whiteboard:
Iteration: ---
Points: ---
Has Regression Range: ---
Has STR: ---


Attachments
Update Lion Glyphs - 01 WIP (21.53 KB, patch)
2011-08-17 07:54 PDT, Stephen Horlander [:shorlander]
mstange: feedback+
Details | Diff | Review
Patch Screenshot (72.58 KB, image/png)
2011-08-17 07:56 PDT, Stephen Horlander [:shorlander]
no flags Details
Design Goal (423.52 KB, image/jpeg)
2011-08-17 08:11 PDT, Stephen Horlander [:shorlander]
no flags Details
Update Lion Glyphs - 02 (34.09 KB, patch)
2011-08-19 08:59 PDT, Stephen Horlander [:shorlander]
dao+bmo: review+
mstange: feedback+
Details | Diff | Review
Patch Screenshot - 02 (195.38 KB, image/png)
2011-08-19 09:01 PDT, Stephen Horlander [:shorlander]
no flags Details
Patch Screenshot - 03 (498.13 KB, image/png)
2011-08-23 12:06 PDT, Stephen Horlander [:shorlander]
no flags Details

Description Stephen Horlander [:shorlander] 2011-08-17 07:54:45 PDT
Created attachment 553769 [details] [diff] [review]
Update Lion Glyphs - 01 WIP

To further Lion-ize the toolbar icons:

* Update style: lighter gradient and stronger inner shadow
* Update Library icons and tabstrip icons
* Disabled icons should be 60% opacity

* Inactive window:
  - Icons should be 60% opacity
  - Disabled icons should be 30% opacity
  - Have a hover 100% opacity hover state

The attached WIP patch updates the images but I am not sure if there is a way to make Lion specific CSS rules for the inactive window state?
Comment 1 Stephen Horlander [:shorlander] 2011-08-17 07:56:39 PDT
Created attachment 553772 [details]
Patch Screenshot
Comment 2 Markus Stange [:mstange] [away until June 27] 2011-08-17 08:02:56 PDT
Comment on attachment 553769 [details] [diff] [review]
Update Lion Glyphs - 01 WIP

Looks great!

(In reply to Stephen Horlander from comment #0)
> The attached WIP patch updates the images but I am not sure if there is a
> way to make Lion specific CSS rules for the inactive window state?

Not yet. I'll write a patch that adds :-moz-system-metric(mac-lion-theme).
Comment 3 Markus Stange [:mstange] [away until June 27] 2011-08-17 08:10:43 PDT
Also, have you piped the images through an optimizer like ImageOptim?
Comment 4 Stephen Horlander [:shorlander] 2011-08-17 08:11:02 PDT
Created attachment 553776 [details]
Design Goal

Design for normal, disabled and inactive states
Comment 5 Stephen Horlander [:shorlander] 2011-08-17 08:13:05 PDT
(In reply to Markus Stange from comment #3)
> Also, have you piped the images through an optimizer like ImageOptim?

Yes, I used ImageOptim. 

> Not yet. I'll write a patch that adds :-moz-system-metric(mac-lion-theme).

Awesome, thank you!
Comment 6 Stephen Horlander [:shorlander] 2011-08-19 08:59:18 PDT
Created attachment 554437 [details] [diff] [review]
Update Lion Glyphs - 02

Updated patch using -moz-mac-lion-theme for disabled and inactive-window rules. Also removed bookmarks and history checked hover:active state since it isn't used anymore
Comment 7 Stephen Horlander [:shorlander] 2011-08-19 09:01:14 PDT
Created attachment 554438 [details]
Patch Screenshot - 02
Comment 8 Dão Gottwald [:dao] 2011-08-22 12:58:47 PDT
Comment on attachment 554438 [details]
Patch Screenshot - 02

The disabled state seems quite subtle (significantly more subtle than on Windows until recently, where people already complained). I guess I can only blame Apple for this?
Comment 9 Stephen Horlander [:shorlander] 2011-08-22 13:09:56 PDT
(In reply to Dão Gottwald [:dao] from comment #8)
> Comment on attachment 554438 [details]
> Patch Screenshot - 02
> 
> The disabled state seems quite subtle (significantly more subtle than on
> Windows until recently, where people already complained). I guess I can only
> blame Apple for this?

It is pretty subtle. The push towards less contrasty icons in Lion makes the available range for disabled more narrow.

We don't have to conform exactly however I don't think it will be confusing in the context of Lion. It is more obvious in use than in a screenshot.

Pushing the opacity down to .5 would make it more obvious and probably wouldn't look out of place.
Comment 10 Dão Gottwald [:dao] 2011-08-23 01:14:45 PDT
Comment on attachment 554437 [details] [diff] [review]
Update Lion Glyphs - 02

Ok, I think we should use 50% opacity for the disabled state, or really any other value that gets us closer to 40% without alienating die-hard OS X enthusiasts.
Comment 11 Stephen Horlander [:shorlander] 2011-08-23 12:06:30 PDT
Created attachment 555156 [details]
Patch Screenshot - 03

I changed the opacity to .5 here which is a small but noticeable improvement.
Comment 12 Matt Brubeck (:mbrubeck) 2011-08-24 17:29:08 PDT
http://hg.mozilla.org/mozilla-central/rev/2392fc3ad758
Comment 13 Nils Maier [:nmaier] 2011-11-13 12:47:49 PST
Manifest overrides may break third party themes
Comment 14 Dão Gottwald [:dao] 2011-11-14 03:40:30 PST
(In reply to Nils Maier [:nmaier] from comment #13)
> Manifest overrides may break third party themes

I wasn't aware of this. Please file a bug?
Comment 15 Jorge Villalobos [:jorgev] 2011-11-15 07:31:54 PST
See bug 702558.

Note You need to log in before you can comment on or make changes to this bug.