From 07779c45950e7319d05194fdca17104fc3350a69 Mon Sep 17 00:00:00 2001
From: Diego Imbert <diego@windmill.dev>
Date: Wed, 16 Apr 2025 15:26:45 +0200
Subject: [PATCH] fix for increased browser font sizes

---
 frontend/src/lib/components/Editor.svelte                | 2 +-
 frontend/src/lib/components/FakeMonacoPlaceHolder.svelte | 8 ++++----
 frontend/src/lib/components/ResourcePicker.svelte        | 2 +-
 frontend/src/lib/components/SimpleEditor.svelte          | 2 +-
 frontend/src/lib/components/TemplateEditor.svelte        | 2 +-
 5 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/frontend/src/lib/components/Editor.svelte b/frontend/src/lib/components/Editor.svelte
index ae28462abd..49b716de1b 100644
--- a/frontend/src/lib/components/Editor.svelte
+++ b/frontend/src/lib/components/Editor.svelte
@@ -1418,7 +1418,7 @@
 {#if !editor}
 	<div class="inset-0 absolute overflow-clip">
 		<FakeMonacoPlaceHolder
-			marginLeft="3.19em"
+			marginLeft="51px"
 			{code}
 			fontSize={!small ? 14 : 12}
 			className="dark:bg-[#272D38] h-full"
diff --git a/frontend/src/lib/components/FakeMonacoPlaceHolder.svelte b/frontend/src/lib/components/FakeMonacoPlaceHolder.svelte
index e4741cec85..2c907de5bb 100644
--- a/frontend/src/lib/components/FakeMonacoPlaceHolder.svelte
+++ b/frontend/src/lib/components/FakeMonacoPlaceHolder.svelte
@@ -12,17 +12,17 @@
 </script>
 
 <div
-	class={'relative w-full pr-14 z-9 mt-[-0.026em] dark:bg-[#272D38] mb-[0.026em] leading-5 overflow-y-clip overflow-x-auto mycontainer ' +
+	class={'relative w-full pr-14 z-9 mt-[-1px] mb-[1px] leading-[20px] dark:bg-[#272D38] overflow-y-clip overflow-x-auto mycontainer ' +
 		className}
 	style="padding-left: {marginLeft};"
 >
 	<div
-		class="absolute inset-x-0 h-[1.36em] dark:bg-[#3A4252] mix-blend-lighten"
+		class="absolute inset-x-0 h-[22px] dark:bg-[#3A4252] mix-blend-lighten"
 		style="margin-left: {marginLeft};"
 	></div>
 	<code
 		class="text-nowrap whitespace-pre-wrap overflow-clip text-tertiary/50"
-		style="font-size: {fontSize / 16}em;"
+		style="font-size: {fontSize}px;"
 	>
 		{code}
 		{#if code.endsWith('\n')}
@@ -34,7 +34,7 @@
 <style>
 	.mycontainer::-webkit-scrollbar {
 		/* Try to match monaco's scrollbar */
-		height: 0.75em;
+		height: 12px;
 	}
 	.mycontainer::-webkit-scrollbar-thumb {
 		background-color: transparent;
diff --git a/frontend/src/lib/components/ResourcePicker.svelte b/frontend/src/lib/components/ResourcePicker.svelte
index 42e93eab6e..f82dd888dc 100644
--- a/frontend/src/lib/components/ResourcePicker.svelte
+++ b/frontend/src/lib/components/ResourcePicker.svelte
@@ -135,7 +135,7 @@
 	}}
 />
 
-<div class="flex flex-col w-full items-start">
+<div class="flex flex-col w-full items-start min-h-9">
 	<div class="flex flex-row w-full items-center">
 		{#if collection?.length > 0}
 			<Select
diff --git a/frontend/src/lib/components/SimpleEditor.svelte b/frontend/src/lib/components/SimpleEditor.svelte
index d30968ea3e..46d5699787 100644
--- a/frontend/src/lib/components/SimpleEditor.svelte
+++ b/frontend/src/lib/components/SimpleEditor.svelte
@@ -559,7 +559,7 @@
 {/if}
 
 {#if !editor}
-	<FakeMonacoPlaceHolder marginLeft="1.44em" {code} fontSize={small ? 12 : 14} />
+	<FakeMonacoPlaceHolder marginLeft="23px" {code} fontSize={small ? 12 : 14} />
 {/if}
 
 <div
diff --git a/frontend/src/lib/components/TemplateEditor.svelte b/frontend/src/lib/components/TemplateEditor.svelte
index 00ebcd4339..c68f59c7bb 100644
--- a/frontend/src/lib/components/TemplateEditor.svelte
+++ b/frontend/src/lib/components/TemplateEditor.svelte
@@ -630,7 +630,7 @@
 <EditorTheme />
 
 {#if !editor}
-	<FakeMonacoPlaceHolder {code} {fontSize} marginLeft="1.6em" />
+	<FakeMonacoPlaceHolder {code} {fontSize} marginLeft="25px" className="border-[2px]" />
 {/if}
 <div
 	bind:this={divEl}