improving mobile accesability

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

frontend/src/Components/MarkdownEditor.svelte

@@ -26,6 +26,12 @@
         } else resetEdit();
     }
 
+    function doSave(){
+        if (simple){
+            onSet(editValue.source);
+        } else applyEdit();
+    }
+
     function resetEdit(){
         editing   = false;
         editValue = {source:value.source,rendered:value.rendered};
@@ -51,11 +57,7 @@
             value.source   = editValue.source;
             value.rendered = editValue.rendered;
         }
-        if (ev.keyCode == 13 && ev.ctrlKey){
-            if (simple){
-                onSet(editValue.source);
-            } else applyEdit();
-        }
+        if (ev.keyCode == 13 && ev.ctrlKey) doSave();
         if (ev.keyCode == 27) resetEdit();
 
         if (timer) clearTimeout(timer);
@@ -117,7 +119,10 @@
 
 <div class="markdown {editing?'editing':''}">
 {#if editing}
-<textarea bind:value={editValue.source} onkeyup={typed} autofocus={!simple}></textarea>
+    <div class="boundary">
+        <textarea bind:value={editValue.source} onkeyup={typed} autofocus={!simple}></textarea>
+        <button class="save" onclick={doSave}>{t('save')}</button>
+    </div>
 {/if}
 <svelte:element this={type} {onmousedown} {onmouseup} {ontouchstart} {ontouchend} {oncontextmenu} class={{editable}} title={t('long_click_to_edit')} >{@html target(editValue.rendered)}</svelte:element>
 </div>

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

@@ -359,4 +359,14 @@ table{
     border: 0 none;
     background: none;
     color: orange;
+}
+
+.boundary{
+    position: relative;
+}
+
+.boundary button.save{
+    position: absolute;
+    right: 0;
+    bottom: 0;
 }