diff options
| author | Max <max@nextcloud.com> | 2022-04-19 19:01:30 +0300 |
|---|---|---|
| committer | nextcloud-command <nextcloud-command@users.noreply.github.com> | 2022-04-19 19:58:07 +0300 |
| commit | d9d016dc66bcc15245c2e1d59f0742d8567ceb29 (patch) | |
| tree | ec373017803cfeed441829400888c0b60609d85b /src | |
| parent | b48886fc9eaa41745ea2a20757e1d4917297bf7a (diff) | |
fix: leave some buffer so menubar does not wrap
When resizing the browser make sure the three dot menu stays on the same line.
Without a buffer it would sometimes wrap
even though theoretical there was enough space in the menu bar.
No idea what is going on there - but a 4px buffer seems to prevent just that.
Signed-off-by: Max <max@nextcloud.com>
Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/MenuBar.vue | 10 |
1 files changed, 8 insertions, 2 deletions
diff --git a/src/components/MenuBar.vue b/src/components/MenuBar.vue index ea23b1739..5e572b0df 100644 --- a/src/components/MenuBar.vue +++ b/src/components/MenuBar.vue @@ -255,8 +255,14 @@ export default { iconCount() { this.forceRecompute // eslint-disable-line this.windowWidth // eslint-disable-line - const menuBarWidth = this.$refs.menubar && this.$refs.menubar.clientWidth > 200 ? this.$refs.menubar.clientWidth : 200 - return Math.max((Math.floor(menuBarWidth / 44) - 1), 0) + const menuBarWidth = this.$refs.menubar && this.$refs.menubar.clientWidth > 200 + ? this.$refs.menubar.clientWidth + : 200 + // leave some buffer - this is necessary so the bar does not wrap during resizing + const spaceToFill = menuBarWidth - 4 + const slots = Math.floor(spaceToFill / 44) + // Leave one slot empty for the three dot menu + return slots - 1 }, imagePath() { return this.lastImagePath |