improved spreadsheet design

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

frontend/src/Components/MarkdownDisplay.svelte

@@ -3,6 +3,7 @@
 	let { classes='markdown', markdown=$bindable({source:'',rendered:''}), onclick = null, oncontextmenu = null, title='', wrapper = 'div' } = $props();
 	let jspreadsheet = null;
 	const regex = /@startsheet[\s\S]*?@endsheet/g;
+	const number = /^[0-9.-]+$/
 
 	function update(sheet, index){
 		const data        = sheet.getData(false,false,'|',false);
@@ -19,6 +20,11 @@
 		return text.replace(regex, (match) => count++ === n ? `@startsheet\n${newContent}\n@endsheet` : match);
 	}
 
+	function formatCell(cell, value, x, y, instance, options){
+		value = value.trim();
+		if (value.startsWith('=') || number.test(value)) cell.style.textAlign = 'right';
+	}
+
 	async function transform(){
 		if (!markdown.rendered) return;
 		let sheets = document.getElementsByClassName('spreadsheet');
@@ -40,12 +46,14 @@
             for (let row of parsed){
                 for (let col in row){
                     let data = ""+row[col];
+                    if (data.startsWith('=')) continue;
                     let len  = data.length;
                     columns[col] = Math.max(columns[col]??0,len);
                 }
             }
             columns = Object.values(columns).map((len) => {return {
                 align: 'left',
+                render: formatCell,
                 width:`${len}0px`
             }});
 			let config = {