better match to monaco

frontend/src/lib/components/Editor.svelte

@@ -1416,12 +1416,14 @@
 
 <EditorTheme />
 {#if !editor}
-	<FakeMonacoPlaceHolder
-		marginLeft="51px"
-		{code}
-		fontSize={!small ? 14 : 12}
-		className="dark:bg-[#272D38] h-full"
-	/>
+	<div class="inset-0 absolute overflow-clip">
+		<FakeMonacoPlaceHolder
+			marginLeft="51px"
+			{code}
+			fontSize={!small ? 14 : 12}
+			className="dark:bg-[#272D38] h-full"
+		/>
+	</div>
 {/if}
 <div bind:this={divEl} class="{$$props.class} editor {disabled ? 'disabled' : ''}"></div>
 {#if $vimMode}

frontend/src/lib/components/FakeMonacoPlaceHolder.svelte

@@ -8,20 +8,21 @@
 		className?: string
 	}
 
-	let { code, fontSize, marginLeft = '23px', className = '' }: Props = $props()
+	let { code, fontSize, marginLeft = '1.44em', className = '' }: Props = $props()
 </script>
 
 <div
-	class={'w-full pr-14 z-9 mt-[-1px] mb-[1px] leading-5 overflow-x-auto mycontainer ' + className}
+	class={'relative w-full pr-14 z-9 mt-[-0.026em] mb-[0.026em] leading-5 overflow-y-clip overflow-x-auto mycontainer ' +
+		className}
 	style="padding-left: {marginLeft};"
 >
 	<div
-		class="absolute inset-x-0 h-[1.36rem] bg-[#3A4252] mix-blend-lighten"
+		class="absolute inset-x-0 h-[1.36em] dark:bg-[#3A4252] mix-blend-lighten"
 		style="margin-left: {marginLeft};"
 	></div>
 	<code
-		class="text-nowrap whitespace-pre-wrap text-ellipsis overflow-clip text-tertiary"
-		style="font-size: {fontSize}px;"
+		class="text-nowrap whitespace-pre-wrap text-ellipsis overflow-clip text-tertiary/50"
+		style="font-size: {fontSize / 16}em;"
 	>
 		{code}
 	</code>
@@ -30,7 +31,7 @@
 <style>
 	.mycontainer::-webkit-scrollbar {
 		/* Try to match monaco's scrollbar */
-		height: 12px;
+		height: 0.75px;
 	}
 	.mycontainer::-webkit-scrollbar-thumb {
 		background-color: transparent;

frontend/src/lib/components/SimpleEditor.svelte

@@ -516,9 +516,7 @@
 				mounted = true
 				await loadMonaco()
 				if (autofocus) {
-					setTimeout(() => {
-						focus()
-					}, 0)
+					setTimeout(() => focus(), 0)
 				}
 			}
 		}, 0)

frontend/src/lib/components/TemplateEditor.svelte

@@ -637,7 +637,7 @@
 	style="height: 18px;"
 	class="{$$props.class ??
 		''} border template nonmain-editor rounded min-h-4 mx-0.5 overflow-clip {!editor
-		? 'absolute'
+		? 'hidden'
 		: ''}"
 	bind:clientWidth={width}
 ></div>

frontend/src/lib/components/flows/content/FlowModuleComponent.svelte

@@ -358,7 +358,7 @@
 
 				<div class="min-h-0 flex-grow" id="flow-editor-editor">
 					<Splitpanes horizontal>
-						<Pane bind:size={editorPanelSize} minSize={10}>
+						<Pane bind:size={editorPanelSize} minSize={10} class="relative">
 							{#if flowModule.value.type === 'rawscript'}
 								{#if !noEditor}
 									{#key flowModule.id}