Responsive design mode icon is similar with dock to bottom icon

RESOLVED FIXED in Firefox 52

Status

defect
RESOLVED FIXED
3 years ago
Last year

People

(Reporter: magicp.jp, Assigned: hholmes)

Tracking

unspecified
Firefox 53
Dependency tree / graph

Firefox Tracking Flags

(firefox48 wontfix, firefox49 wontfix, firefox50 wontfix, firefox51 wontfix, firefox52 verified, firefox53 verified)

Details

Attachments

(3 attachments)

User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:48.0) Gecko/20100101 Firefox/48.0
Build ID: 20160726073904

Steps to reproduce:

1. Start Nightly
2. Open DevTools
3. Move dock to side


Actual results:

Responsive design mode icon is similar with dock to bottom icon.


Expected results:

Responsive design mode icon should be changed to more identifiable like firebug icon.
Has STR: --- → yes
Component: Untriaged → Developer Tools
OS: Unspecified → All
Hardware: Unspecified → All
They are indeed very similar!  Helen, any thoughts about this?
Flags: needinfo?(hholmes)
(In reply to J. Ryan Stinnett [:jryans] (use ni?) from comment #1)
> They are indeed very similar!  Helen, any thoughts about this?

In this bug's current form I would consider this a WONTFIX—they're separated out into two separate sections.

However, I can see how in this mode, the visual separator disappears, which is problematic: https://cl.ly/2F1s1u0v0t2Y

gasolin is currently working on a series of toolbar visual changes that should resolve this bug by removing background colors on the panel backgrounds and using color on the text instead, which will preserve that visual separator and making these two buttons more obvious with the Settings panel selected.
Status: NEW → RESOLVED
Closed: 3 years ago
Flags: needinfo?(hholmes)
Resolution: --- → WONTFIX
Status: RESOLVED → REOPENED
Resolution: WONTFIX → ---
Attachment #8811405 - Flags: review?(jryans)
With the patch applied.
Comment on attachment 8811405 [details] [diff] [review]
rdm-icon.patch

Review of attachment 8811405 [details] [diff] [review]:
-----------------------------------------------------------------

Thanks for working on this!

Please add r=jryans to commit message.

::: devtools/client/themes/images/command-responsivemode.svg
@@ +1,4 @@
>  <!-- This Source Code Form is subject to the terms of the Mozilla Public
>     - License, v. 2.0. If a copy of the MPL was not distributed with this
>     - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
> +<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" viewBox="0 0 16 16" stroke="#0b0b0b" stroke-miterlimit="10" stroke-wdith="2" stroke-linecap="round" stroke-linejoin="round" fill="transparent">

Looks like the following attributes are not needed:

* xmlns:xlink
* stroke-wdith (which is misspelled and distorts the image if corrected)

These I am less sure about, but I could not notice an obvious change when removing them:

* stroke-linecap
* stroke-linejoin
Attachment #8811405 - Flags: review?(jryans) → review+
Assignee: nobody → hholmes
Status: REOPENED → ASSIGNED
Pushed by jryans@gmail.com:
https://hg.mozilla.org/integration/mozilla-inbound/rev/42de50438fc9
Adds new responsive design mode icon. r=jryans
https://hg.mozilla.org/mozilla-central/rev/42de50438fc9
Status: ASSIGNED → RESOLVED
Closed: 3 years ago3 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 53
This bug was verified fixed in latest Aurora and Nightly build. Thanks!
Depends on: 1338363
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.