From 4e2b681bed01f6fb675a0da2f8a5eacb7aff8083 Mon Sep 17 00:00:00 2001
From: Rainer Simon <aboutgeo@gmail.com>
Date: Tue, 19 Oct 2021 09:05:29 +0200
Subject: [PATCH] Cosmetic fixes to auto-position + dragging behavior

---
 src/editor/Editor.jsx              | 1 +
 src/editor/setPosition.js          | 6 ++++--
 themes/default/editor/_editor.scss | 6 ------
 3 files changed, 5 insertions(+), 8 deletions(-)

diff --git a/src/editor/Editor.jsx b/src/editor/Editor.jsx
index 8dd19cc..ef51f3d 100644
--- a/src/editor/Editor.jsx
+++ b/src/editor/Editor.jsx
@@ -316,6 +316,7 @@ export default class Editor extends Component {
       <Draggable 
         disabled={!this.props.detachable}
         handle=".r6o-draggable" 
+        cancel=".r6o-btn, .r6o-btn *"
         onDrag={() => this.setState({ dragged: true })}>
 
         <div ref={this.element} className={this.state.dragged ? 'r6o-editor dragged' : 'r6o-editor'}>
diff --git a/src/editor/setPosition.js b/src/editor/setPosition.js
index a0d4a55..491c370 100644
--- a/src/editor/setPosition.js
+++ b/src/editor/setPosition.js
@@ -1,3 +1,5 @@
+const MARGIN_VERTICAL = 14;
+
 /** Sets the editor position and determines a proper orientation **/
 const setPosition = (wrapperEl, editorEl, selectedEl, autoPosition) => {
   // Container element bounds
@@ -8,7 +10,7 @@ const setPosition = (wrapperEl, editorEl, selectedEl, autoPosition) => {
 
   // Default orientation (upwards arrow, at bottom-left of shape)
   const { left, top, right, bottom } = selectedEl.getBoundingClientRect();
-  editorEl.style.top = `${bottom - containerBounds.top}px`;
+  editorEl.style.top = `${bottom - containerBounds.top + MARGIN_VERTICAL}px`;
   editorEl.style.left = `${left - containerBounds.left}px`;
 
   if (autoPosition) {
@@ -29,7 +31,7 @@ const setPosition = (wrapperEl, editorEl, selectedEl, autoPosition) => {
       editorEl.classList.add('r6o-arrow-bottom');
       
       const editorHeight = editorEl.children[1].getBoundingClientRect().height;
-      editorEl.style.top = `${top - containerBounds.top - editorHeight}px`;
+      editorEl.style.top = `${top - containerBounds.top - editorHeight - MARGIN_VERTICAL}px`;
     }
 
     // Get bounding box in current orientation for next tests
diff --git a/themes/default/editor/_editor.scss b/themes/default/editor/_editor.scss
index e661155..cf7b569 100644
--- a/themes/default/editor/_editor.scss
+++ b/themes/default/editor/_editor.scss
@@ -6,7 +6,6 @@
 .r6o-editor {
   position:absolute;
   z-index:99999;
-  margin-top:18px;
   margin-left:-14px;
   width:400px;
   color:$standard-type;
@@ -107,7 +106,6 @@
 }
 
 .r6o-editor.r6o-arrow-bottom {
-  margin-top:-14px;
 
   .r6o-arrow {
     display:block;
@@ -127,10 +125,6 @@
   display:none;
 }
 
-.r6o-editor.r6o-arrow-bottom.pushed.down {
-  margin-top:4px;
-}
-
 .r6o-editor .r6o-draggable {
   cursor:move;
 }