Closed
Bug 871670
Opened 11 years ago
Closed 11 years ago
Make background bars compatible with themes (for both dark and light backgrounds)
Categories
(DevTools :: Netmonitor, defect, P3)
DevTools
Netmonitor
Tracking
(Not tracked)
RESOLVED
FIXED
Firefox 24
People
(Reporter: alfredkayser, Assigned: vporof)
References
Details
(Whiteboard: [fixed-in-fx-team])
Attachments
(1 file)
4.23 KB,
patch
|
dcamp
:
review+
|
Details | Diff | Splinter Review |
Generating a background with hardcoded semi-transparent white bars is very theme unfriendly. With non-black background (i.e. normal white or -moz-field) the bars are invisible. Either use a color derived from some css rule or use a dotted line so that it works on both dark and light backgrounds.
Reporter | ||
Comment 1•11 years ago
|
||
Hardcode color coding: + for (let x = 0; x < canvasWidth; x += increment) { + data32[x | 0] = (alphaComponent << 24) | (255 << 16) | (255 << 8) | 255; + }
Assignee | ||
Comment 2•11 years ago
|
||
Just as I said here https://bugzilla.mozilla.org/show_bug.cgi?id=859041#c14: > Generating a background with hardcoded semi-transparent white bars is very > theme unfriendly. With non-black background (i.e. normal white or > -moz-field) the bars are invisible. True, however the netmonitor doesn't have a white theme at this point. I suppose moving the pixels color into a const is acceptable, but deriving color from a css rule back into js is overkill IMHO, and using a dotted like would have a noticeable perf impact. Maybe I'm missing something.
Reporter | ||
Comment 3•11 years ago
|
||
Re: "however the netmonitor doesn't have a white theme at this point": The point of themes (such as Walnut, Nautipolis, etc) is to allow different color an style schemes. There are several options to make the interval pattern more theme aware: 1. Instead of generating a background image with bars, one could also use a linear-gradient as follows: background-size: <timing-interval> background-image:linear-gradient(to right <barcolor> 1px, transparent) 2. Or just use rgba(128,128,128,<alpha>) so it works both on dark and light backgrounds. 3. Dotted (2px high, with the first row set with rgba(255,255,255,alpha) and second with rgba(0,0,0,alpha). When a background image is used, the size doesn't matter that much (either repeat height times 1px row or repeat height/2 a 2px row). 4. Get the background color of the panel and set a contrasting color.
Assignee | ||
Comment 4•11 years ago
|
||
Let's talk in a single bug :) https://bugzilla.mozilla.org/show_bug.cgi?id=859041#c16
Assignee | ||
Comment 5•11 years ago
|
||
Attachment #749148 -
Flags: review?(dcamp)
Reporter | ||
Comment 6•11 years ago
|
||
Thanks! This looks nice to me. (re 4, my fault: I inserted the comment on the wrong bug first)
Assignee | ||
Comment 7•11 years ago
|
||
(In reply to Alfred Kayser from comment #6) > Thanks! This looks nice to me. \o/
Updated•11 years ago
|
Attachment #749148 -
Flags: review?(dcamp) → review+
Assignee | ||
Updated•11 years ago
|
Whiteboard: [land-in-fx-team]
Assignee | ||
Comment 8•11 years ago
|
||
https://hg.mozilla.org/integration/fx-team/rev/016f5fb80f3c
Assignee: nobody → vporof
Status: NEW → ASSIGNED
Whiteboard: [land-in-fx-team] → [fixed-in-fx-team]
Assignee | ||
Updated•11 years ago
|
Priority: -- → P3
Assignee | ||
Comment 9•11 years ago
|
||
https://hg.mozilla.org/mozilla-central/rev/016f5fb80f3c
Status: ASSIGNED → RESOLVED
Closed: 11 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 24
Updated•6 years ago
|
Product: Firefox → DevTools
You need to log in
before you can comment on or make changes to this bug.
Description
•