Prettier TemplateEditor

frontend/src/lib/components/FakeMonacoPlaceHolder.svelte

@@ -8,6 +8,7 @@
 		autoheight?: boolean
 		lineNumbersWidth?: number
 		lineNumbersOffset?: number
+		showNumbers?: boolean
 		class?: string
 		fontSize?: number
 	}
@@ -18,6 +19,7 @@
 		lineNumbersWidth = 51,
 		lineNumbersOffset = 0,
 		class: className = '',
+		showNumbers = true,
 		fontSize = 14
 	}: Props = $props()
 
@@ -76,7 +78,9 @@
 					class="margin-view-overlays"
 					role="presentation"
 					aria-hidden="true"
-					style="position: absolute; font-family: {fontFamily}; font-weight: normal; font-size: {fontSize}px; font-feature-settings: 'liga' 0, 'calt' 0; font-variation-settings: normal; line-height: {lineHeight}px; letter-spacing: 0px; width: {lineNumbersWidth}px; height: 4893px;"
+					style="position: absolute; font-family: {fontFamily}; font-weight: normal; font-size: {fontSize}px; font-feature-settings: 'liga' 0, 'calt' 0; font-variation-settings: normal; line-height: {lineHeight}px; letter-spacing: 0px; width: {lineNumbersWidth}px; height: 4893px; display: {!showNumbers
+						? 'none'
+						: 'block'};"
 				>
 					{#each lines as _, i}
 						<div style="top:{lineHeight * i}px;height:{lineHeight}px;">

frontend/src/lib/components/InputTransformForm.svelte

@@ -591,6 +591,7 @@
 										dispatch('change', { argName, arg })
 									}}
 									loadAsync
+									class="bg-surface-secondary"
 								/>
 							{/if}
 						</div>

frontend/src/lib/components/TemplateEditor.svelte

@@ -449,7 +449,14 @@
 				lineDecorationsWidth: 6,
 				lineNumbersMinChars: 2,
 				fontSize,
-				suggestOnTriggerCharacters: true
+				suggestOnTriggerCharacters: true,
+				renderLineHighlight: 'none',
+				lineNumbers: 'off',
+
+				padding: {
+					bottom: 8,
+					top: 8
+				}
 			})
 		} catch (e) {
 			console.error('Error loading monaco:', e)
@@ -650,15 +657,16 @@
 {#if !editor}
 	<FakeMonacoPlaceHolder
 		autoheight
+		showNumbers={false}
 		{code}
-		lineNumbersWidth={23}
-		lineNumbersOffset={-8}
-		class="border template nonmain-editor rounded min-h-4 mx-0.5 overflow-clip"
+		lineNumbersWidth={14}
+		lineNumbersOffset={-20}
+		class="border template nonmain-editor rounded min-h-4 bg-surface-secondary !py-[8px] mx-0.5 overflow-clip"
 	/>
 {/if}
 <div
 	bind:this={divEl}
-	style="height: 18px;"
+	style="height: 18px; padding-left: 8px;"
 	class="{$$props.class ??
 		''} border template nonmain-editor rounded min-h-4 mx-0.5 overflow-clip {!editor
 		? 'hidden'