appuniversum / ember-appuniversum

Ember addon wrapping the appuniversum components.
https://appuniversum.github.io/ember-appuniversum
MIT License
14 stars 10 forks source link

AuDropdown in header hidden by data table #386

Closed claire-lovisa closed 3 months ago

claire-lovisa commented 1 year ago

Describe the bug

When the AuDropdown component in used in a header, it doesn't show in front of the rest of the content on all cases. As you can see in the screenshots below, on a regular page the dropdown shows as expected, but when there is a data table it then

To Reproduce

The code is currently not deployed but you can run this PR (minus the css trick) against the dev worship organizations application via ember serve --proxy https://dev.organisaties.lokaalbestuur.lblod.info, mock-log in as Gemeente Aalst and click on the Bestuurseenheden module to find the page with the table.

Expected behavior

The dropdown shows in front on the table and is not hidden by it.

Screenshots

Hidden dropdown: image

How I would expect it to show: image

Desktop (please complete the following information):

Windvis commented 3 months ago

I wonder if this is still an issue with the "floating-ui" based dropdowns we have now. We'll need to try and reproduce the issue.

Edit: just tested it in the Eredienstenorganisaties app and this specific issue is fixed, but the shadow of the main header isn't visible without an explicit z-index on the main header element. So it's still not 100% perfect.