1933651 - Unmatched rules have lower opacity which causes contrast issues (in both regular and High Contrast Mode)

Status: RESOLVED FIXED

(DevTools :: Inspector: Rules, defect, P2)

Description

[Nicolas Chevobbe [:nchevobbe]]

Attachment: One matched and one unmatched rule

See https://searchfox.org/mozilla-central/rev/dfaf02d68a7cb018b6cad7e189f450352e2cde04/devtools/client/themes/rules.css#355-358

.ruleview-rule.unmatched,
.ruleview-rule[unmatched=true] {
  opacity: 0.5;
}

We could probably use GrayText for everything and/or add a grayscale filter?

Comment 1

[Nicolas Chevobbe [:nchevobbe]]

Attachment: Bug 1933651 - [devtools] Dont tweak opacity of unmatched rules. r=#devtools.

Use GrayText color instead.

Comment 2

[Julian Descottes [:jdescottes]]

Could be interesting to cross out the selector to convey that it's not matching

Comment 3

[Nicolas Chevobbe [:nchevobbe]]

Actually, this isn't only an issue for High Contrast Mode.
In light theme, the selector has a 2.7:1 ratio (fails minimal contrast)
I'll expand my patch so it's a better solution for every situation

Comment 4

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/9a80c79cdfdd
[devtools] Dont tweak opacity of unmatched rules. r=devtools-reviewers,jdescottes.

Comment 5

[Norisz Fay [:noriszfay]]

https://hg.mozilla.org/mozilla-central/rev/9a80c79cdfdd