The default bug view has changed. See this FAQ.

The find bar should be visually styled to match the add-ons bar

RESOLVED FIXED in Firefox 10

Status

()

Firefox
Theme
RESOLVED FIXED
6 years ago
6 years ago

People

(Reporter: faaborg, Assigned: dao)

Tracking

unspecified
Firefox 10
All
Windows 7
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(2 attachments, 4 obsolete attachments)

We currently have two bottom bars that have different visual styles.  Particularly on Windows this looks unintentional, with one being a light grey, and the other blue.

Updated

6 years ago
Duplicate of this bug: 631884
(Assignee)

Updated

6 years ago
Component: General → Theme
QA Contact: general → theme
(Assignee)

Updated

6 years ago
Depends on: 631884
(Assignee)

Updated

6 years ago
No longer depends on: 631884
(Assignee)

Updated

6 years ago
Depends on: 599215
(Assignee)

Comment 2

6 years ago
Created attachment 510566 [details] [diff] [review]
patch

This takes care of Aero Glass only, as this is the most obvious case. Alex, can you please file individual bugs with more concrete suggestions per platform?
Assignee: nobody → dao
Status: NEW → ASSIGNED
Attachment #510566 - Flags: review?(felipc)
(Assignee)

Updated

6 years ago
OS: All → Windows 7
When I talked to Shorlander I was under the impression that the find bar should be visually distinct from the add-on bar on purpose, as the addon-bar is part of the browser UI and the find bar is attached to the content.
Comment on attachment 510566 [details] [diff] [review]
patch

The gradient tones on the addonbar changes when the find bar is open because it stretches more (being part of the browser-bottombox background). Is it possible to avoid that?
(Assignee)

Comment 5

6 years ago
The 20px is supposed to ensure it doesn't stretch:
    background-image: -moz-linear-gradient(@toolbarHighlight@, rgba(255,255,255,0) 20px);

But maybe it actually should stretch?
(Assignee)

Comment 6

6 years ago
Another option might be:

background-image: -moz-linear-gradient(bottom, rgba(255,255,255,0), @toolbarHighlight@ 20px);
Comment on attachment 510566 [details] [diff] [review]
patch

Yeah starting from the bottom works much better. r+ with that.

I believe it really shouldn't stretch, because it goes against the calm UI, and it would get worse if we style the Sync notifications in the same way (I'll file a bug similar to this one for the Sync UI because I think we really need it).

Alex, can you take a look on comment 3?
Attachment #510566 - Flags: review?(felipc) → review+
(Reporter)

Comment 8

6 years ago
>When I talked to Shorlander I was under the impression that the find bar should
>be visually distinct from the add-on bar on purpose, as the addon-bar is part
>of the browser UI and the find bar is attached to the content.

If we were going for an obvious browser level/tab level distinction (like having the add-ons bar consisting of frosted glass), then making them distinct would make sense.  But if both are just styled like toolbars, I think having two different visual styles ends up looking like a mistake.  cc'ing shorlander for his opinion.

Comment 9

6 years ago
(In reply to comment #3)
> When I talked to Shorlander I was under the impression that the find bar should
> be visually distinct from the add-on bar on purpose, as the addon-bar is part
> of the browser UI and the find bar is attached to the content.

I don't think the find bar is more attachted to the content than the addon-bar. Many add-ons like Adblock Plus, Stylish, NoScript, Greasemonkey etc. are clearly attached to the current tab, exactly as the find bar is.

Additionally, everybody knows the find bar is part of the browser UI and not part of the page content, so it should look like a browser toolbar, too.
(Assignee)

Comment 10

6 years ago
Created attachment 511349 [details] [diff] [review]
patch

with the change from comment 6
Attachment #510566 - Attachment is obsolete: true
Attachment #511349 - Flags: approval2.0?
My proposed alternative style for Windows is now up here:

http://areweprettyyet.com/4/mainWindow/#bottombars

still debating the design with shorlander and beltzner though.  When users visually focus directly on the close buttons, it should be reasonably clear that there are two different rows, both due to the small horizontal line, and due to the gestalt principle of proximity (although we might need to increase the white space between the two rows a bit more before that effect is strong enough).
Comment on attachment 511349 [details] [diff] [review]
patch

I know Stephen and Alex have been thinking of how to solve this, so want them to give it UI blessing before approving.
Attachment #511349 - Flags: approval2.0? → ui-review?(shorlander)
Stephen has some newer mockups now than the one in comment #11
Comment on attachment 511349 [details] [diff] [review]
patch

This is pretty close to what I had in mind. Can the separator be more subtle? Also we should do the same flat and consistent toolbar treatment for XP. I will attach a mockup.
Attachment #511349 - Flags: ui-review?(shorlander) → ui-review-
Created attachment 512872 [details]
Bottom Bars

- Flat toolbar color
- Subtle toolbar separator
(Assignee)

Comment 16

6 years ago
Created attachment 513435 [details] [diff] [review]
work in progress

This is entirely untested, it may not work at all.
Attachment #511349 - Attachment is obsolete: true
(Assignee)

Comment 17

6 years ago
Created attachment 513436 [details] [diff] [review]
work in progress

(still not tested)
Attachment #513435 - Attachment is obsolete: true

Updated

6 years ago
Whiteboard: not-ready

Comment 18

6 years ago
This will update the style for the Sync error bar as well, right?
Please fix this sooner.
(Assignee)

Comment 20

6 years ago
Created attachment 563141 [details] [diff] [review]
patch
Attachment #513436 - Attachment is obsolete: true
Attachment #563141 - Flags: review?(shorlander)
Attachment #563141 - Flags: review?(shorlander) → review+
(Assignee)

Updated

6 years ago
Whiteboard: not-ready
Target Milestone: --- → Firefox 10
https://hg.mozilla.org/mozilla-central/rev/ceb9e5cad736
Status: ASSIGNED → RESOLVED
Last Resolved: 6 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.