diff --git a/src/components/MenuBubble.vue b/src/components/MenuBubble.vue
index 8f8505f1cbb..e91b992cef0 100644
--- a/src/components/MenuBubble.vue
+++ b/src/components/MenuBubble.vue
@@ -41,8 +41,8 @@
class="menububble__button"
:class="{ 'is-active': isActive.link() }"
@click="showLinkMenu(getMarkAttrs('link'))">
-
-
+
+
@@ -107,11 +107,15 @@ export default {
box-shadow: 0 1px 5px var(--color-box-shadow);
border-radius: var(--border-radius);
padding: 0;
- margin-bottom: 0.4rem;
+ margin-bottom: 0;
+ margin-left: 10px;
visibility: hidden;
opacity: 0;
transform: translateX(-50%);
transition: opacity 0.2s, visibility 0.2s;
+ // We need a fixed width here since tiptap doesn't recalculate the left position on resize
+ width: 180px;
+ height: 40px;
&.is-active {
opacity: 1;
@@ -120,8 +124,9 @@ export default {
&__button {
display: block;
+ flex-grow: 1;
border: 0;
- padding: 0.3rem 0.7rem;
+ padding: 0.9rem 0.7rem;
margin: 0;
margin-right: 0.2rem;
border-radius: var(--border-radius);
diff --git a/src/views/RichWorkspace.vue b/src/views/RichWorkspace.vue
index cb142332e17..f2cb66c68f1 100644
--- a/src/views/RichWorkspace.vue
+++ b/src/views/RichWorkspace.vue
@@ -166,7 +166,7 @@ export default {