wip #7634 @0:30

diff --git a/resources/markdowneditor/js/markdowneditor.js b/resources/markdowneditor/js/markdowneditor.js
index 2d03009757260aa633221e85d4beae649fc61c01..020be67765e83b90ca6c582848ea8a73e807a7ce 100644 (file)
--- a/resources/markdowneditor/js/markdowneditor.js
+++ b/resources/markdowneditor/js/markdowneditor.js
@@ -36,13 +36,20 @@ MarkdownEditor.prototype = {
         $(window).on('mousemove', function (e) {
             let x = e.pageX;
             let w = $(this).innerWidth()
-            let ratio= Math.min(33.33, x / w * 100)
+            let ratio= x / w * 100
 
             if($(".handle").hasClass("dragging")) {
                 $("body").addClass("user-select-none")
                 requestAnimationFrame(function() {
                     $("#markdown-preview").width(ratio+'%')
                 })
+
+                if($("#markdown-page img")[0].getBoundingClientRect().top < $("body")[0].getBoundingClientRect().top
+                || $("#markdown-page img")[0].getBoundingClientRect().bottom > $("body")[0].getBoundingClientRect().bottom){
+                    $("#markdown-preview").addClass("overtake")
+                }else {
+                    $("#markdown-preview").removeClass("overtake")
+                }
             }
         })
 
@@ -124,7 +131,7 @@ MarkdownEditor.prototype = {
     markdown: function() {
         this.editor = new Editor({
             el: document.querySelector('#editor'),
-            initialEditType: 'markdown',
+            initialEditType: 'wysiwyg',
             previewStyle: 'vertical'
         });
 

diff --git a/resources/markdowneditor/style/style.sass b/resources/markdowneditor/style/style.sass
index 976ed57d0b1dd583027f307cd172769d7ead7b0f..15823545a877ce3381af1bf64c57e5d339115f60 100644 (file)
--- a/resources/markdowneditor/style/style.sass
+++ b/resources/markdowneditor/style/style.sass
@@ -36,6 +36,14 @@ body
         flex-shrink: 0
         align-items: center
         justify-content: center
+
+        &.overtake
+            overflow: auto
+            img
+                top: 0
+                left: 0
+                transform: none
+
         img
             width: 100%
             position: absolute