Skip to content

Commit 58b1ee5

Browse files
GiteaBotbrechtvl
andauthored
Fix overflow menu flickering on mobile (#31484) (#31488)
Backport #31484 by brechtvl Co-authored-by: Brecht Van Lommel <[email protected]>
1 parent 1825c31 commit 58b1ee5

File tree

1 file changed

+4
-0
lines changed

1 file changed

+4
-0
lines changed

web_src/js/webcomponents/overflow-menu.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
6161
}
6262

6363
const itemFlexSpace = this.menuItemsEl.querySelector('.item-flex-space');
64+
const itemOverFlowMenuButton = this.querySelector('.overflow-menu-button');
6465

6566
// move items in tippy back into the menu items for subsequent measurement
6667
for (const item of this.tippyItems || []) {
@@ -72,7 +73,9 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
7273
}
7374

7475
// measure which items are partially outside the element and move them into the button menu
76+
// flex space and overflow menu are excluded from measurement
7577
itemFlexSpace?.style.setProperty('display', 'none', 'important');
78+
itemOverFlowMenuButton?.style.setProperty('display', 'none', 'important');
7679
this.tippyItems = [];
7780
const menuRight = this.offsetLeft + this.offsetWidth;
7881
const menuItems = this.menuItemsEl.querySelectorAll('.item, .item-flex-space');
@@ -89,6 +92,7 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
8992
}
9093
}
9194
itemFlexSpace?.style.removeProperty('display');
95+
itemOverFlowMenuButton?.style.removeProperty('display');
9296

9397
// if there are no overflown items, remove any previously created button
9498
if (!this.tippyItems?.length) {

0 commit comments

Comments
 (0)