diff options
| author | Azul <azul@riseup.net> | 2021-10-27 17:44:39 +0300 |
|---|---|---|
| committer | Julius Härtl <jus@bitgrid.net> | 2021-11-05 18:42:33 +0300 |
| commit | 82afd6a77461c86839febf3acb28623ab6ebf288 (patch) | |
| tree | 0c6a7f2c26cca91c6a507184fbc7a41db918f90a /src | |
| parent | a07fe2d32be617446d26132d87293e735452fadc (diff) | |
Display menububble below the first line of text
For the rest of the text we keep the position above.
Signed-off-by: Azul <azul@riseup.net>
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/MenuBubble.vue | 14 |
1 files changed, 13 insertions, 1 deletions
diff --git a/src/components/MenuBubble.vue b/src/components/MenuBubble.vue index c3956fc79..059ee4db7 100644 --- a/src/components/MenuBubble.vue +++ b/src/components/MenuBubble.vue @@ -25,7 +25,9 @@ class="menububble" :editor="editor" @hide="hideLinkMenu"> - <div class="menububble" :class="{ 'is-active': menu.isActive }" :style="`left: ${menu.left}px; bottom: ${menu.bottom}px;`"> + <div class="menububble" + :class="{ 'is-active': menu.isActive }" + :style="bubblePosition(menu)"> <form v-if="linkMenuIsActive" class="menububble__form" @submit.prevent="setLinkUrl(commands.link, linkUrl)"> <input ref="linkInput" v-model="linkUrl" @@ -140,6 +142,16 @@ export default { command({ href: url }) this.hideLinkMenu() }, + bubblePosition(menu) { + // below the first line, above all others + const vertical = menu.top < 45 + ? { top: `${menu.top}px` } + : { bottom: `${menu.bottom}px` } + return { + ...vertical, + left: `${menu.left}px`, + } + } }, } </script> |