From 8600415fa93d2c78e6fa3170e712627039001601 Mon Sep 17 00:00:00 2001
From: Rainer Simon <rainer.simon@ait.ac.at>
Date: Sun, 12 Apr 2020 10:04:00 +0200
Subject: [PATCH] Added fade in effect to avoid jumping

---
 src/editor/setPosition.js          | 3 +++
 themes/default/editor/_editor.scss | 5 +++++
 2 files changed, 8 insertions(+)

diff --git a/src/editor/setPosition.js b/src/editor/setPosition.js
index 965fe1c..88707c6 100644
--- a/src/editor/setPosition.js
+++ b/src/editor/setPosition.js
@@ -7,6 +7,9 @@ const setPosition = (wrapperEl, editorEl, annotationBounds) => {
   // Re-set orientation class
   editorEl.className = 'r6o-editor';
 
+  // Set visible
+  editorEl.style.opacity = 1;
+
   // Default orientation
   const { x, y, height, top, right } = annotationBounds; 
   editorEl.style.top = `${y + height + scrollY - offsetTop}px`;
diff --git a/themes/default/editor/_editor.scss b/themes/default/editor/_editor.scss
index 6b3f738..b681a11 100644
--- a/themes/default/editor/_editor.scss
+++ b/themes/default/editor/_editor.scss
@@ -10,6 +10,11 @@
   margin-left:-14px;
   width:400px;
   color:$standard-type;
+  opacity:0;
+
+  -webkit-transition:opacity 0.1s ease-in-out;
+     -moz-transition:opacity 0.1s ease-in-out;
+          transition:opacity 0.1s ease-in-out;
 
   .arrow {
     position:absolute;