diff options
| author | silverwind <me@silverwind.io> | 2024-06-12 16:58:03 +0200 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-06-12 14:58:03 +0000 |
| commit | 21ba5ca03be47a9a7051d13fcfa258bb03dd93df (patch) | |
| tree | 14ec0be5dbefe8ba98984ffb33278611261f0d17 /web_src/js | |
| parent | 45dbeb5600d1f552c0134721fe49e8fd1099b5a4 (diff) | |
| download | gitea-21ba5ca03be47a9a7051d13fcfa258bb03dd93df.tar.gz gitea-21ba5ca03be47a9a7051d13fcfa258bb03dd93df.zip | |
Fix navbar `+` menu flashing on page load (#31281)
Fixes
https://github.com/go-gitea/gitea/pull/31273#issuecomment-2153771331.
Same method as used in https://github.com/go-gitea/gitea/pull/30215. All
left-opening dropdowns need to use it method.
---------
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: Giteabot <teabot@gitea.io>
Diffstat (limited to 'web_src/js')
| -rw-r--r-- | web_src/js/components/DiffCommitSelector.vue | 2 | ||||
| -rw-r--r-- | web_src/js/modules/fomantic/dropdown.js | 16 |
2 files changed, 17 insertions, 1 deletions
diff --git a/web_src/js/components/DiffCommitSelector.vue b/web_src/js/components/DiffCommitSelector.vue index c28be67e38..6a4a84f615 100644 --- a/web_src/js/components/DiffCommitSelector.vue +++ b/web_src/js/components/DiffCommitSelector.vue @@ -202,7 +202,7 @@ export default { > <svg-icon name="octicon-git-commit"/> </button> - <div class="menu left transition" id="diff-commit-selector-menu" :class="{visible: menuVisible}" v-show="menuVisible" v-cloak :aria-expanded="menuVisible ? 'true': 'false'"> + <div class="left menu" id="diff-commit-selector-menu" :class="{visible: menuVisible}" v-show="menuVisible" v-cloak :aria-expanded="menuVisible ? 'true': 'false'"> <div class="loading-indicator is-loading" v-if="isLoading"/> <div v-if="!isLoading" class="vertical item" id="diff-commit-list-show-all" role="menuitem" @keydown.enter="showAllChanges()" @click="showAllChanges()"> <div class="gt-ellipsis"> diff --git a/web_src/js/modules/fomantic/dropdown.js b/web_src/js/modules/fomantic/dropdown.js index 82e710860d..bbffb59152 100644 --- a/web_src/js/modules/fomantic/dropdown.js +++ b/web_src/js/modules/fomantic/dropdown.js @@ -94,6 +94,22 @@ function delegateOne($dropdown) { updateSelectionLabel($label[0]); return $label; }); + + const oldSet = dropdownCall('internal', 'set'); + const oldSetDirection = oldSet.direction; + oldSet.direction = function($menu) { + oldSetDirection.call(this, $menu); + const classNames = dropdownCall('setting', 'className'); + $menu = $menu || $dropdown.find('> .menu'); + const elMenu = $menu[0]; + // detect whether the menu is outside the viewport, and adjust the position + // there is a bug in fomantic's builtin `direction` function, in some cases (when the menu width is only a little larger) it wrongly opens the menu at right and triggers the scrollbar. + elMenu.classList.add(classNames.loading); + if (elMenu.getBoundingClientRect().right > document.documentElement.clientWidth) { + elMenu.classList.add(classNames.leftward); + } + elMenu.classList.remove(classNames.loading); + }; } // for static dropdown elements (generated by server-side template), prepare them with necessary aria attributes |