Fix high contrast issues for palette editor and extensions page#9434
Conversation
kimprice
requested review from
eanders-ms,
jwunderl,
riknoll,
srietkerk and
thsparks
| } | ||
| </div> | ||
| </FocusTrap>, parentElement || document.body) | ||
| </FocusTrap>, parentElement || document.getElementById("root") || document.body) |
There was a problem hiding this comment.
to clarify a bit in case anyone's confused what this actually changes; parentElement is an optional prop that determines where this this modal should be rooted (as modals are things that should 'show up' above other things and so they need to get positioned at a different place in the dom). When we were looking at it yesterday we noticed that not all modals were passing a value for this and were instead falling back to being placed under the body instead of root where .hc gets applied (#root is the ProjectView's id in app.tsx).
If we're in the webapp almost everything is intended to be under root anyway which is why I suggested this vs going back and making parentElement required~
There was a problem hiding this comment.
Thanks for including the reasoning, Joey! I should have added those details.
3 participants
Fixes microsoft/pxt-arcade#5701
Fixes microsoft/pxt-microbit#4997
At first glance, high contrast seemed to be working, but that was only the case if you had just turned high contrast on. If instead, you already had high contrast on from a previous session or reloaded the page, the palette editor and extensions page would not be in high contrast mode.