1330300 - Network panel: Unify colors for side panels

Status: RESOLVED WORKSFORME

(DevTools :: Netmonitor, defect, P2)

Description

[Jan Honza Odvarko [:Honza] (always need-info? me)]

The Network monitor side panels display various name-value pairs and we should make sure that used colors are unified across these panels as well as across our themes (light, dark, Firebug).

Honza

Comment 1

[Jan Honza Odvarko [:Honza] (always need-info? me)]

We might also unify colors for borders used in these side panels as part of this report.

Comment 2

[Marco Mucci [:MarcoM]]

Hi Honza, should this bug be added to the MVP or Reserve backlog?

Comment 3

[Jan Honza Odvarko [:Honza] (always need-info? me)]

Reserve backlog

Honza

Comment 4

[Ricky Chien [:rickychien] (inactive)]

Honza, how can we verify for these side panels are unified?

Comment 5

[Jan Honza Odvarko [:Honza] (always need-info? me)]

Attachment: headers.png

Here is what I think should be done in this report:

1) We should use less-colorful colors for text in side panels. I think that using black color + font weight should be just fine. Take a look at the screenshot I am attaching.

Labels: color: black; font-weight: bold
Values: color: black

Help: [Learn More] can stay the same

Ideally only PropertiesView is responsible for setting the colors.


2) The same color+style should be used for all side panels:
* Headers
* Cookies
* Params
* Response (JSON preview)
* Security

All these panels are displaying name-value pairs and should use the same design.

3) Testing/verification needs to be done for all themes
* Light
* Dark
* Firebug
 
Honza

Comment 6

[[e-mail]]

Hi Victoria,

I believe most of `unify color` work for netmonitor is done during photon devtools UI refresh.
I want to use this bug to make sure we've covered color related issue with different themes

* Light
* Dark
* Firebug


We can use BBC http://www.bbc.com/news as target web page, which is complicated and have lots of requests.
Do you need any help to find the color issue?

Comment 7

[Victoria Wang [:victoria]]

Hi Fred! I just checked, and yes -- as far as I can tell, all the colors for the Light/Dark Netmonitor side panels have been changed to be in the same blue-magenta pattern that's used in Console and Inspector. For now, we're not worrying about consistency with Firebug.

Comment 8

[[e-mail]]

Thanks! will mark this issue as resolved