From c4e0010656ca2a2e0238c8de7a86e2a6185caf76 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Fri, 16 Apr 2021 14:43:26 +0200
Subject: [PATCH] docs: remove position: relative from menu demos

---
 docs/src/demos/Examples/Menus/React/index.jsx    |  4 ++--
 docs/src/demos/Examples/Menus/Vue/index.vue      | 16 +++++++++++++---
 .../demos/Extensions/BubbleMenu/React/index.jsx  |  4 ++--
 .../demos/Extensions/BubbleMenu/Vue/index.vue    |  2 +-
 .../Extensions/FloatingMenu/React/index.jsx      |  4 ++--
 .../demos/Extensions/FloatingMenu/Vue/index.vue  |  2 +-
 6 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/docs/src/demos/Examples/Menus/React/index.jsx b/docs/src/demos/Examples/Menus/React/index.jsx
index 072159d3..1348c5cb 100644
--- a/docs/src/demos/Examples/Menus/React/index.jsx
+++ b/docs/src/demos/Examples/Menus/React/index.jsx
@@ -24,7 +24,7 @@ export default () => {
   })
 
   return (
-    <div style={{ position: 'relative' }}>
+    <>
       {editor && <BubbleMenu className="bubble-menu" tippyOptions={{ duration: 100 }} editor={editor}>
         <button
           onClick={() => editor.chain().focus().toggleBold().run()}
@@ -68,6 +68,6 @@ export default () => {
       </FloatingMenu>}
 
       <EditorContent editor={editor} />
-    </div>
+    </>
   )
 }
diff --git a/docs/src/demos/Examples/Menus/Vue/index.vue b/docs/src/demos/Examples/Menus/Vue/index.vue
index 93094b53..0644fd98 100644
--- a/docs/src/demos/Examples/Menus/Vue/index.vue
+++ b/docs/src/demos/Examples/Menus/Vue/index.vue
@@ -1,6 +1,11 @@
 <template>
-  <div style="position: relative">
-    <bubble-menu class="bubble-menu" :tippy-options="{ duration: 100 }" :editor="editor" v-if="editor">
+  <div>
+    <bubble-menu
+      class="bubble-menu"
+      :tippy-options="{ duration: 100 }"
+      :editor="editor"
+      v-if="editor"
+    >
       <button @click="editor.chain().focus().toggleBold().run()" :class="{ 'is-active': editor.isActive('bold') }">
         Bold
       </button>
@@ -12,7 +17,12 @@
       </button>
     </bubble-menu>
 
-    <floating-menu class="floating-menu" :tippy-options="{ duration: 100 }" :editor="editor" v-if="editor">
+    <floating-menu
+      class="floating-menu"
+      :tippy-options="{ duration: 100 }"
+      :editor="editor"
+      v-if="editor"
+    >
       <button @click="editor.chain().focus().toggleHeading({ level: 1 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">
         H1
       </button>
diff --git a/docs/src/demos/Extensions/BubbleMenu/React/index.jsx b/docs/src/demos/Extensions/BubbleMenu/React/index.jsx
index 8271a415..30b767c1 100644
--- a/docs/src/demos/Extensions/BubbleMenu/React/index.jsx
+++ b/docs/src/demos/Extensions/BubbleMenu/React/index.jsx
@@ -16,7 +16,7 @@ export default () => {
   })
 
   return (
-    <div style={{ position: 'relative' }}>
+    <>
       {editor && <BubbleMenu editor={editor}>
         <button
           onClick={() => editor.chain().focus().toggleBold().run()}
@@ -38,6 +38,6 @@ export default () => {
         </button>
       </BubbleMenu>}
       <EditorContent editor={editor} />
-    </div>
+    </>
   )
 }
diff --git a/docs/src/demos/Extensions/BubbleMenu/Vue/index.vue b/docs/src/demos/Extensions/BubbleMenu/Vue/index.vue
index 8ced328a..54fe7c4e 100644
--- a/docs/src/demos/Extensions/BubbleMenu/Vue/index.vue
+++ b/docs/src/demos/Extensions/BubbleMenu/Vue/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div style="position: relative">
+  <div>
     <bubble-menu :editor="editor" v-if="editor">
       <button @click="editor.chain().focus().toggleBold().run()" :class="{ 'is-active': editor.isActive('bold') }">
         bold
diff --git a/docs/src/demos/Extensions/FloatingMenu/React/index.jsx b/docs/src/demos/Extensions/FloatingMenu/React/index.jsx
index a4bcdf3c..2b77fcd7 100644
--- a/docs/src/demos/Extensions/FloatingMenu/React/index.jsx
+++ b/docs/src/demos/Extensions/FloatingMenu/React/index.jsx
@@ -17,7 +17,7 @@ export default () => {
   })
 
   return (
-    <div style={{ position: 'relative' }}>
+    <>
       {editor && <FloatingMenu editor={editor}>
         <button
           onClick={() => editor.chain().focus().toggleHeading({ level: 1 }).run()}
@@ -39,6 +39,6 @@ export default () => {
         </button>
       </FloatingMenu>}
       <EditorContent editor={editor} />
-    </div>
+    </>
   )
 }
diff --git a/docs/src/demos/Extensions/FloatingMenu/Vue/index.vue b/docs/src/demos/Extensions/FloatingMenu/Vue/index.vue
index c8d781c8..42feb953 100644
--- a/docs/src/demos/Extensions/FloatingMenu/Vue/index.vue
+++ b/docs/src/demos/Extensions/FloatingMenu/Vue/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div style="position: relative">
+  <div>
     <floating-menu :editor="editor" v-if="editor">
       <button @click="editor.chain().focus().toggleHeading({ level: 1 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">
         h1