From: soufiane <soufiane@cubedesigners.com>
Date: Thu, 10 Jul 2025 15:34:43 +0000 (+0200)
Subject: wip #7634 @0:30
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=7e1156ba516ffdd82056f50c504c63e6e938dbf7;p=fluidbook-toolbox.git

wip #7634 @0:30
---

diff --git a/resources/markdowneditor/js/markdowneditor.js b/resources/markdowneditor/js/markdowneditor.js
index 2d0300975..020be6776 100644
--- 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 976ed57d0..15823545a 100644
--- 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