1254002 - [DevTools][Web Audio] web-audio-graph needs more contrast between object and background on the light theme

Status: RESOLVED DUPLICATE of bug 1301624

(DevTools Graveyard :: Web Audio Editor, defect)

Description

[magicp]

Attachment: devtools-web-audio-graph.png

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

Steps to reproduce:

1. Start Nightly
2. Open DevTools > Web Audio with the light theme
3. Go to http://mdn.github.io/violent-theremin/



Actual results:

Hard to see between object and background by less contrast.


Expected results:

web-audio-graph needs more contrast between object and background on the light theme.

Comment 1

[johngraciliano]

This is due to a rule in chrome://devtools/skin/webaudioeditor.css stating:
.theme-light rect {
  fill: var(--theme-tab-toolbar-background);
}

In Firefox 47 and later, the filling for the nodes' rectangles is #fcfcfc giving a poor contrast over the #ffffff background.
Before changes in the color scheme for the light theme, the rectangles were #ebeced over #fcfcfc, which I thought was already poor contrast.  But now it is much worse.  I suggest to make the rectangles #e4e4e4, which still does not get close to the contrast seen with the dark theme.

Comment 2

[Soledad Penades [:sole] [:spenades]]

Attachment: Screen Shot 2018-08-02 at 14.01.51.png

This looks contrasting enough today, since there's been a lot of theme updates in the last year.