fix(dropdown): flip-up menu must override top-[105%] class
The flip-up branch cleared inline `top` to "", which let the menu's `top-[105%]` utility class reassert top:105% on the now-fixed element — collapsing the menu to a 2px sliver below the viewport, so toggles near the viewport bottom appeared not to open. Set the unused anchor to "auto" so the inline value wins over the class. Add an e2e regression for the flip-up path. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -33,11 +33,14 @@ export function initDropdown(host: HTMLElement, config: DropdownConfig): void {
|
||||
menu.style.width = `${rect.width}px`;
|
||||
menu.style.maxHeight = `${Math.max(0, openUp ? spaceAbove : spaceBelow)}px`;
|
||||
menu.style.overflowY = "auto";
|
||||
// Set the unused anchor to "auto" (not "") so this inline value overrides
|
||||
// the menu's `top-[105%]` utility class; clearing it to "" would let the
|
||||
// class reassert top:105% and collapse the fixed menu off-screen.
|
||||
if (openUp) {
|
||||
menu.style.top = "";
|
||||
menu.style.top = "auto";
|
||||
menu.style.bottom = `${window.innerHeight - rect.top}px`;
|
||||
} else {
|
||||
menu.style.bottom = "";
|
||||
menu.style.bottom = "auto";
|
||||
menu.style.top = `${rect.bottom}px`;
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user