You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
This is basically the issue described in #12, just making a comeback. The dropdown triggered by the "Add Button" button gets cut off by some overflow: hidden styling on an element higher up in the html.
Environment:
Nova Version 5.2.4 (latest at the time of writing this)
Chrome (latest version or close to it)
The previous ticket was resolved just by Nova happening to get rid of the overflow: hidden around that time. There are a couple things this library could do in the Vue implementation to get rid of this issue:
Not use an absolute-positioned element for the dropdown. If it just appeared as a static-positioned element, whatever space was required for displaying all the options would be added by virtue of it being in the layout flow. You would lose the ability to pin the dropdown to the top of the button, and you trigger layout shift when showing it, but it would work at least.
Use some library like Popper.js or a vue wrapper of that to manage tethering to the button.
Do a DIY dropdown component that appends the dropdown element to document.body using the Vue built-in Teleport component, and calculating what the positioning should be. That's essentially what a library would do for you, but after accounting for the many edge cases, you can still make it leaner than a library.
In the meantime, I've just got this in the CSS for my Nova admin as a workaround. The 10rem was sufficient for the height of my layout options:
/* Avoid cutting off dropdown selector for Flexible component's "Add Layout" button */:has(>*> [dusk="toggle-layouts-dropdown-or-add-default"]) {
min-height:10rem;
}
The text was updated successfully, but these errors were encountered:
This is basically the issue described in #12, just making a comeback. The dropdown triggered by the "Add Button" button gets cut off by some
overflow: hidden
styling on an element higher up in the html.The previous ticket was resolved just by Nova happening to get rid of the
overflow: hidden
around that time. There are a couple things this library could do in the Vue implementation to get rid of this issue:In the meantime, I've just got this in the CSS for my Nova admin as a workaround. The
10rem
was sufficient for the height of my layout options:The text was updated successfully, but these errors were encountered: