Closed Bug 609559 Opened 14 years ago Closed 14 years ago

Addon Bar styling and polishing

Categories

(Firefox :: Theme, defect)

defect
Not set
normal

Tracking

()

RESOLVED DUPLICATE of bug 616018

People

(Reporter: tech4pwd, Unassigned)

References

Details

(Whiteboard: [addon bar][needs feedback boriss])

Attachments

(1 file)

User-Agent: Mozilla/5.0 (Windows NT 6.1; rv:2.0b8pre) Gecko/20101103 Firefox/4.0b8pre Build Identifier: Mozilla/5.0 (Windows NT 6.1; rv:2.0b8pre) Gecko/20101103 Firefox/4.0b8pre The proposal can be broken down into three parts 1. Lock the toolbar height at 23px. 2. Tweak the button styles 3. Implement glass for those OS's that support it. 1. Having played with the Addon Toolbar height a bit. I've learned that 18px isn't a reasonable height. By locking at 18px you restrict what can be placed there and make it look squashed. However the current height is certainly too large. At 23px you have a bit of wiggle-room for button styling and placing extraordinary objects like the Awesome Bar in there. It also conforms with the UX teams goals to have it as small as possible while keeping it usable. The userchrome style I'm using for this is as follows: @-moz-document url(chrome://browser/content/browser.xul) { #addon-bar { padding: 0px !important; height: 23px !important; margin: 1px 0 0 -2px !important; } #main-window[sizemode="maximized"] #addon-bar { margin: 0 1px 0 -1px !important; } } 2. Currently the button styles are too clunky for a smaller space. The exude presence based on size. However, if you lock the toolbar height, they quickly become obtrusive. The goal is to keep the button styling as that allows for greater customisation, usability and innovation. The alternative is to remove the button styling and in doing that you lose the greatest gains of moving to a toolbar from a status bar. The userchrome style I'm using for this is as follows: @-moz-document url(chrome://browser/content/browser.xul){ #addon-bar toolbarbutton { margin: 0 0 0 1px !important; border-radius: 3px !important; padding: 0 1px !important; box-shadow: none !important; min-height: 18px !important; } #addon-bar dropmarker, #addon-bar #zoom-controls { margin: 0 0 0 0 !important; border-radius: 3px !important; padding: 0 1px !important; box-shadow: none !important; min-height: 18px !important; } } 3. Lastly is the glass. That is wholeheartedly just an aesthetics thing. It looks good, feels good and makes Firefox feel modern as well as integrated. It also gives the buttons a greater stand-out effect The userchrome style I'm using for this is as follows: @-moz-document url(chrome://browser/content/browser.xul){ #browser-bottombox, #status-bar { -moz-appearance: none !important; background: transparent !important; -moz-border-radius: 0px !important; color: #fff !important; } } I'm pretty sure there are better ways to do all of what I achieve above. But they help to illustrate the point and provide a real demonstration of what I'm proposing. Reproducible: Always
Blocks: 574688
Version: unspecified → Trunk
Attached image Mockup of proposal (deleted) —
Added Boriss as she is the UX lead for the Addon Bar I believe?
Whiteboard: [addon bar][needs feedback boriss]
For what it's worth, the inactive state on attachment 479351 [details] looks better to me. Anyway, by locking the toolbar height at 23px, will its full height be 23px (like the old status bar)? The current full height (last nightly build) is bigger (around 25px).
(In reply to comment #3) > For what it's worth, the inactive state on attachment 479351 [details] looks better to > me. > > Anyway, by locking the toolbar height at 23px, will its full height be 23px > (like the old status bar)? > The current full height (last nightly build) is bigger (around 25px). Based on attachment 488154 [details] it would be 23px. But based on attachment 479351 [details] I think you could get it down even smaller (18px) as there's no button styling. Dao seems to be pushing for something akin to that attachment 479351 [details].
This seems to have fallen completely under the UX Team radar, thus gonna dupe it to it's nearest fit.
Status: UNCONFIRMED → RESOLVED
Closed: 14 years ago
Resolution: --- → DUPLICATE
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: