Closed Bug 1413832 Opened 2 years ago Closed 2 years ago

Keep the green/active toolbar icon styling when the tool is selected

Categories

(DevTools :: General, enhancement, P3)

enhancement

Tracking

(firefox58 fixed)

RESOLVED FIXED
Firefox 58
Tracking Status
firefox58 --- fixed

People

(Reporter: jdescottes, Assigned: abhinav.koppula)

Details

Attachments

(2 files)

Some tools (debugger, memory, performance) can have an active state. In this case a special CSS class is applied on their toolbar icon. 

When the tool is not selected, it makes the icon turn green so that the user knows the tool is active.
When the tool is selected, the selected style takes over.

Maybe it could make sense to give the "active" state more priority and always turn the icon green. We already have the top blue bar to indicate the selected tab, so that might be enough?
This came up for me while debugging webextensions. When you're doing that, you have *two* debuggers open, one for the background page and one for the content page. In that case the more obvious it is that the debugger should be selected, the better. 

I'll also say that in Chrome they do the overlay on the website itself when the debugger is active. In my opinion it would be hard to make this too obvious. There's pretty much only one thing the user can do when the debugger is paused, and the faster we direct people to the debugger, the better.
Hi Julian,
I have created a review-request for the above issue. Is this what you had in mind?
(In reply to Abhinav Koppula from comment #3)
> Hi Julian,
> I have created a review-request for the above issue. Is this what you had in
> mind?

Thanks Abhinav! Before reviewing let's check if this is fine from a UX point of view.
Victoria: What do you think about our active/green toolbar icons. Should they remain green when the tool is selected as well?
Flags: needinfo?(victoria)
Thanks for the nice GIF illustrating the issue :). For now, it sounds like a good idea to keep the icon green when the tab is selected.

Re: mlissner's comment, I know a Chrome-style overlay is also in the works. I think I should revisit this UI after the overlay is done -- this use of green for a paused state feels kind of incorrect since green usually means Go, New, etc.
Flags: needinfo?(victoria)
Comment on attachment 8925115 [details]
Bug 1413832 - Keep the green/active toolbar icon styling when the tool is selected.

https://reviewboard.mozilla.org/r/196354/#review202232

Looks good, thanks Abhinav!
Attachment #8925115 - Flags: review?(jdescottes) → review+
Pushed by jdescottes@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/e412b3da631e
Keep the green/active toolbar icon styling when the tool is selected. r=jdescottes
Assignee: nobody → abhinav.koppula
Status: NEW → ASSIGNED
https://hg.mozilla.org/mozilla-central/rev/e412b3da631e
Status: ASSIGNED → RESOLVED
Closed: 2 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 58
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.