ted/recogito-client-core
ted
/
recogito-client-core
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added fade in effect to avoid jumping

This commit is contained in:
Rainer Simon 2020-04-12 10:04:00 +02:00
parent 8cf539c4d4
commit 8600415fa9
2 changed files with 8 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/editor/setPosition.js
View File

@ -7,6 +7,9 @@ const setPosition = (wrapperEl, editorEl, annotationBounds) => {
// Re-set orientation class // Re-set orientation class
editorEl.className = 'r6o-editor'; editorEl.className = 'r6o-editor';
// Set visible
editorEl.style.opacity = 1;
// Default orientation // Default orientation
const { x, y, height, top, right } = annotationBounds; const { x, y, height, top, right } = annotationBounds;
editorEl.style.top = `${y + height + scrollY - offsetTop}px`; editorEl.style.top = `${y + height + scrollY - offsetTop}px`;

5
themes/default/editor/_editor.scss
View File

@ -10,6 +10,11 @@
margin-left:-14px; margin-left:-14px;
width:400px; width:400px;
color:$standard-type; 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 { .arrow {
position:absolute; position:absolute;