fix(devtools): update menu list css

[jyash97]

Summary

In devtools when we select a deeply nested component, and try to select parent component using the dropdown. Text overlaps with the background text since the menu list is rendered outside the dom so CSS var is not applied properly.

Check below recording for the issue:

How did you test this change?

Tested using inline devtools testing example. Below is the screen recording for testing the CSS:

[jyash97]

Hey @bvaughn 👋

Can you take a look at this changes, whenever you get time ?

[bvaughn]

CI is failing with a lint error. Please run yarn prettier to fix.

[jyash97]

Many CI check seems to be failing now. Any idea?

Looks unrelated to the changes I did in latest commit

[bvaughn]

Can you try rebasing on main ?

git rebase main

[bvaughn]

This is looking a lot better!

Now the only thing that's broken is the hover, I think. Probably need to do the same thing for the MenuItem CSS class as we did for the MenuList class.

It's really unfortunate how our CSS colors get forked between constants.js and root.css because of these global styles ☹️ I wonder if there's better solution here.

---

Edit I filed #22678 to follow up on my above comment

[jyash97]

Now the only thing that's broken is the hover, I think

Yes its left, should we add another variable in root.css for hover background ?

It's really unfortunate how our CSS colors get forked between constants.js and root.css because of these global styles ☹️ I wonder if there's better solution here.

Yes I was unsure whether the solution I proposed was good since it adds the same values from constants.js to root.css. I have shared my thoughts here on the same: #22678 (comment)

[bvaughn]

Love the suggestion on #22678.

[jyash97]

Glad it helped 😄

Do I need to close this PR ? If not, can you help me with this:

Should we add another variable in root.css for hover background ?

[bvaughn]

Should we add another variable in root.css for hover background ?

For the "fix" to work fully with this PR, yes. We would need to do this as well. Or we could land the other fix first and then this would not be necessary.

[jyash97]

Closing as it will be fixed in #22716

[bvaughn]

Love it