<AnchoredOverlay> needs to be upgraded to popover

[keithamus]

Description

<AnchoredOverlay> needs to be upgraded to popover

Steps to reproduce

.

Version

v36

Browser

No response

[joshblack]

Moved this back into the inbox to consider for prioritization since this is currently blocking an a11y audit issue 👀

[dipree]

Can we please add a problem statement here so it's easier to understand what upgrading to popover would be solving? Given the linked audit issue, I assume it has to do with the z-index?

[sampart]

For context, here's the problem we have: https://github.com/github/accessibility-audits/issues/7736#issuecomment-2192607566

And from Slack:

sampart at 2024-07-03 11:30 BST

:wave-darkgreen: We have a couple of z-index-related issues with our use of AnchoredOverlay (see screenshots). The containing div already has z-index: 1 (we didn’t explicitly set this, so I guess the component does it by default), and setting a z-index on the contained div.Overlay__StyledOverlay-* class doesn’t help. I’ve also tried setting a z-index: -1 on the TimelineBreak element, but that causes other visual issues. Any suggestions for how we can avoid this problem? :thank-you2:

keithamus at 2024-07-03 12:02 BST

Setting a very high z-index would be better but really we should make anchoredoverlay a popover

Here's why we couldn't change the z-index: https://github.com/github/accessibility-audits/issues/7736#issuecomment-2275237726

I'll leave @keithamus to create a problem statement in the issue description, since he understands this domain way better than me.

[github-actions]

Hi! This issue has been marked as stale because it has been open with no activity for 180 days. You can comment on the issue or remove the stale label to keep it open. If you do nothing, this issue will be closed in 7 days.