trying to improve editing on long-tap

Signed-off-by: Stephan Richter <s.richter@srsoftware.de>

frontend/src/Components/LineEditor.svelte

@@ -44,6 +44,12 @@
         }
     }
 
+    function oncontextmenu(evt){
+         evt.preventDefault();
+         evt.stopPropagation();
+         return false;
+    }
+
     function onmousedown(evt){
         evt.preventDefault();
         start = evt.timeStamp;
@@ -85,5 +91,5 @@
 {#if editable && editing}
 <input bind:value={editValue} onkeyup={typed} autofocus />
 {:else}
-<svelte:element this={type} href="#" {onclick} {onmousedown} {onmouseup} {ontouchstart} {ontouchend} class={{editable}} title={t('long_click_to_edit')} >{value}</svelte:element>
+<svelte:element this={type} href="#" {onclick} {onmousedown} {onmouseup} {ontouchstart} {ontouchend} {oncontextmenu} class={{editable}} title={t('long_click_to_edit')} >{value}</svelte:element>
 {/if}

frontend/src/Components/MarkdownEditor.svelte

@@ -70,6 +70,13 @@
         }
     }
 
+
+    function oncontextmenu(evt){
+         evt.preventDefault();
+         evt.stopPropagation();
+         return false;
+    }
+
     function onmousedown(evt){
         evt.preventDefault();
         start = evt.timeStamp;
@@ -108,7 +115,9 @@
     }
 </style>
 
+<div class="markdown {editing?'editing':''}">
 {#if editing}
 <textarea bind:value={editValue.source} onkeyup={typed} autofocus={!simple}></textarea>
 {/if}
-<svelte:element this={type} {onmousedown} {onmouseup} {ontouchstart} {ontouchend} class={{editable}} title={t('long_click_to_edit')} >{@html editValue.rendered}</svelte:element>
+<svelte:element this={type} {onmousedown} {onmouseup} {ontouchstart} {ontouchend} {oncontextmenu} class={{editable}} title={t('long_click_to_edit')} >{@html editValue.rendered}</svelte:element>
+</div>

web/src/main/resources/web/css/default.css

@@ -328,3 +328,20 @@ li > a > p:nth-child(1){
 .time.record button.delete{
     float: right;
 }
+
+.markdown.editing{
+    position: relative;
+}
+
+.markdown.editing > *{
+    width: 49%;
+}
+
+.markdown.editing > *:nth-child(2){
+    position: absolute;
+    right: 0;
+    top: 0;
+}
+table{
+    width: 100vw;
+}