Closed Bug 837188 Opened 8 years ago Closed 6 years ago

Use 2x images for Developer Tools UI for HiDPI

Categories

(DevTools :: General, defect)

defect
Not set
normal

Tracking

(firefox32 fixed, relnote-firefox 32+)

RESOLVED FIXED
Firefox 32
Tracking Status
firefox32 --- fixed
relnote-firefox --- 32+

People

(Reporter: shorlander, Assigned: bgrins)

References

(Blocks 2 open bugs)

Details

(Keywords: feature)

Attachments

(1 file)

The DevTools UI needs images and CSS rules for HiDPI screens.
(In reply to Stephen Horlander from comment #0)
> The DevTools UI needs images and CSS rules for HiDPI screens.

I don't anything about HiDPI. How does it work? Do we have special mediaqueries/classes to know when to use the right images?
(In reply to Paul Rouget [:paul] from comment #1)
> I don't anything about HiDPI. How does it work? Do we have special
> mediaqueries/classes to know when to use the right images?


@media (min-resolution: 2dppx) {
  .something {
    background-image: url("image@2x.png");
    background-size: |double|px;
  }
}
Also see bug 781327 for how it was done for the main browser UI.
Blocks: osx-hidpi
Summary: Use 2x Image for Developer Tools UI for HiDPI → Use 2x images for Developer Tools UI for HiDPI
Assignee: nobody → paul
Stephen, can you provide the icons for this? At least the tools' icons (in the tabs).
Flags: needinfo?(shorlander)
These are all the icons from the osx and shared themes directories except the breadcrumbs.

I took the opportunity to clean up all the @1x icons as well so if you could please just do an image swap on those when adding the @2x versions.

Will follow-up with the breadcrumbs images.
Flags: needinfo?(shorlander)
Blocks: 916766
Brian, can you take a look at this?
Assignee: paul → nobody
Assignee: nobody → bgrinstead
Depends on: 941673
Depends on: 947309
Bug 947309 uses 2x icons for the top toolbar.  The remaining icons that need to be converted to 2x (and moved into the shared folder) are: responsive mode, webconsole output, webconsole input prompt, inspector twisties and checkboxes, debugger breakpoint, debugger widget arrow, debugger icons (controls and blackboxing & breakpoints buttons), style editor sidebar arrow & eye, profiler icon.

I will take a look at these and see how many changes will be needed for each, and if they can be done all together here.
Depends on: 957160
Depends on: 1000928
Depends on: 1005431
Depends on: 1006906
No longer depends on: 1006906
Depends on: 1006906
Can I fix the remaining images ? If so, should I file a new bug (since this might be for tracking) ?
Flags: needinfo?(bgrinstead)
Ok, so I'm gonna split this up in multiple small bugs, otherwise it's gonna be a mess.
Flags: needinfo?(bgrinstead)
(In reply to Tim Nguyen [:ntim] from comment #9)
> Can I fix the remaining images ? If so, should I file a new bug (since this
> might be for tracking) ?

Please do!

(In reply to Tim Nguyen [:ntim] from comment #10)
> Ok, so I'm gonna split this up in multiple small bugs, otherwise it's gonna
> be a mess.

Yes, let's file a separate bug (blocking this one) for each image / each logical group of images.
Depends on: 1009002
Depends on: 1009145
Depends on: 1011249
Depends on: 1012139
Depends on: 1012166
Depends on: 1012829
Depends on: 1017890
Duplicate of this bug: 1018715
Depends on: 1018809
Depends on: 1019124
Depends on: 1019186
Depends on: 1019217
Finally finished ! \o/
Status: NEW → RESOLVED
Closed: 6 years ago
relnote-firefox: --- → ?
Keywords: feature
Resolution: --- → FIXED
Target Milestone: --- → Firefox 32
(In reply to Tim Nguyen [:ntim] from comment #13)
> Finally finished ! \o/

Yay! Thanks for all the patches ntim, looking sharp at 2x.
Blocks: 1016548
Depends on: 1022290
Blocks: 1023546
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.