diff options
| author | Christopher Ng <chrng8@gmail.com> | 2024-03-12 12:10:16 -0700 |
|---|---|---|
| committer | Christopher Ng <chrng8@gmail.com> | 2024-03-13 09:18:21 -0700 |
| commit | 2f31ebbb35fc09c0ce5772bcb0c5c3721a3078f4 (patch) | |
| tree | e26d8d8b2f88f59cba6614a4b5b88c6f5a2707be /apps | |
| parent | 152e559a172880c63e6d37d2b6f8a213d4aac10e (diff) | |
| download | nextcloud-server-2f31ebbb35fc09c0ce5772bcb0c5c3721a3078f4.tar.gz nextcloud-server-2f31ebbb35fc09c0ce5772bcb0c5c3721a3078f4.zip | |
fix(files): Right click menu positioning
Signed-off-by: Christopher Ng <chrng8@gmail.com>
(cherry picked from commit 742e5b6329fac3bdbe1d6f246d7a9c09765fed1d)
Diffstat (limited to 'apps')
| -rw-r--r-- | apps/files/src/components/FileEntry/FileEntryActions.vue | 5 | ||||
| -rw-r--r-- | apps/files/src/components/FileEntryMixin.ts | 9 |
2 files changed, 8 insertions, 6 deletions
diff --git a/apps/files/src/components/FileEntry/FileEntryActions.vue b/apps/files/src/components/FileEntry/FileEntryActions.vue index 86689cfe62b..5d35eae5a79 100644 --- a/apps/files/src/components/FileEntry/FileEntryActions.vue +++ b/apps/files/src/components/FileEntry/FileEntryActions.vue @@ -350,12 +350,13 @@ export default Vue.extend({ <style lang="scss"> // Allow right click to define the position of the menu // only if defined -.content[style*="mouse-pos-x"] .v-popper__popper { +main.app-content[style*="mouse-pos-x"] .v-popper__popper { transform: translate3d(var(--mouse-pos-x), var(--mouse-pos-y), 0px) !important; // If the menu is too close to the bottom, we move it up &[data-popper-placement="top"] { - transform: translate3d(var(--mouse-pos-x), calc(var(--mouse-pos-y) - 50vh), 0px) !important; + // 34px added to align with the top of the cursor + transform: translate3d(var(--mouse-pos-x), calc(var(--mouse-pos-y) - 50vh + 34px), 0px) !important; } // Hide arrow if floating .v-popper__arrow-container { diff --git a/apps/files/src/components/FileEntryMixin.ts b/apps/files/src/components/FileEntryMixin.ts index 69638d33212..a1e90121c92 100644 --- a/apps/files/src/components/FileEntryMixin.ts +++ b/apps/files/src/components/FileEntryMixin.ts @@ -162,7 +162,7 @@ export default defineComponent({ if (opened) { // Reset any right click position override on close // Wait for css animation to be done - const root = this.$root.$el as HTMLElement + const root = this.$el?.closest('main.app-content') as HTMLElement root.style.removeProperty('--mouse-pos-x') root.style.removeProperty('--mouse-pos-y') } @@ -207,12 +207,13 @@ export default defineComponent({ // The grid mode is compact enough to not care about // the actions menu mouse position if (!this.gridMode) { - const root = this.$root.$el as HTMLElement + // Actions menu is contained within the app content + const root = this.$el?.closest('main.app-content') as HTMLElement const contentRect = root.getBoundingClientRect() // Using Math.min/max to prevent the menu from going out of the AppContent // 200 = max width of the menu - root.style.setProperty('--mouse-pos-x', Math.max(contentRect.left, Math.min(event.clientX, event.clientX - 200)) + 'px') - root.style.setProperty('--mouse-pos-y', Math.max(contentRect.top, event.clientY - contentRect.top) + 'px') + root.style.setProperty('--mouse-pos-x', Math.max(0, event.clientX - contentRect.left - 200) + 'px') + root.style.setProperty('--mouse-pos-y', Math.max(0, event.clientY - contentRect.top) + 'px') } // If the clicked row is in the selection, open global menu |