nits

frontend/src/lib/components/AIProviderPicker.svelte

@@ -155,19 +155,21 @@
 	}
 </script>
 
-<div class="w-full flex flex-col gap-1 bg-surface-secondary rounded-md">
+<div
+	class="w-full flex flex-col gap-1 bg-surface-secondary border-[1px] border-nord-400 rounded-md"
+>
 	<!-- Provider Selection -->
-	<div class="flex flex-col gap-2">
+	<div class="flex flex-col gap-2 mx-[-1px] mt-[-1px]">
 		<ToggleButtonGroup
 			selected={value?.kind}
 			onSelected={onProviderChange}
 			{disabled}
 			wrap
-			tabListClass="w-full"
+			tabListClass="w-full bg-transparent"
 		>
 			{#snippet children({ item })}
 				{#each providerOptions.slice(0, 3) as option}
-					<ToggleButton value={option.value} label={option.label} {item} />
+					<ToggleButton value={option.value} label={option.label} {item} class="bg-transparent" />
 				{/each}
 				<ToggleButtonMore
 					class="ml-auto"

frontend/src/lib/components/InputTransformForm.svelte

@@ -761,7 +761,7 @@
 						</ArgInput>
 					{:else if arg.expr != undefined}
 						<div
-							class={`bg-surface-secondary rounded-md min-h-[2.5rem] flex flex-col pl-4 ${inputBorderClass({ forceFocus: focused })}`}
+							class={`bg-surface-secondary rounded-md flex flex-col pl-4 ${inputBorderClass({ forceFocus: focused })}`}
 						>
 							<SimpleEditor
 								bind:this={monaco}

frontend/src/lib/components/Toggle.svelte

@@ -18,7 +18,7 @@
 	export let disabled = false
 	export let textClass = ''
 	export let textStyle = ''
-	export let color: 'blue' | 'red' | 'nord' = 'blue'
+	export let color: 'blue' | 'red' | 'nord' = 'nord'
 	export let id = (Math.random() + 1).toString(36).substring(10)
 	export let lightMode: boolean = false
 	export let eeOnly: boolean = false

frontend/src/lib/components/common/fileInput/FileInput.svelte

@@ -189,7 +189,7 @@
 	class={twMerge(
 		`relative center-center flex flex-col gap-x-2 gap-y-1 justify-center items-center flex-wrap text-center font-normal text-hint text-xs rounded-md
 		bg-surface-secondary
-		border border-dashed border-transparent hover:border-blue-500
+		border border-dashed border-nord-400 dark:border-nord-300 hover:border-nord-900 dark:hover:border-nord-900
 		focus-within:border-blue-300 hover:bg-blue-50 dark:hover:bg-frost-900
 		duration-200 px-1 py-8`,
 		c
@@ -259,7 +259,7 @@
 	/>
 	{#if defaultFile && (!Array.isArray(defaultFile) || defaultFile.length > 0)}
 		<div class="w-full border-dashed border-t-2 text-2xs pt-1 text-tertiary mt-2">
-			Default file: <span class="text-blue-500">{defaultFile}</span>
+			Default file: <span class="text-nord-900">{defaultFile}</span>
 		</div>
 	{/if}
 </button>

frontend/src/lib/components/text_input/TextInput.svelte

@@ -10,7 +10,7 @@
 			'transition-colors border',
 			forceFocus
 				? '!border-nord-900 dark:!border-nord-900'
-				: '!border-transparent focus:!border-nord-900 dark:focus:!border-nord-900 hover:!border-nord-400 dark:hover:!border-nord-300',
+				: '!border-nord-400 dark:!border-nord-300 hover:!border-nord-900/50 hover:dark:!border-nord-900/50 focus:!border-nord-900 dark:focus:!border-nord-900',
 			error
 				? '!border-red-300 focus:!border-red-400 hover:!border-red-500 dark:!border-red-400/40 dark:hover:!border-red-600/40'
 				: ''

frontend/tailwind.config.cjs

@@ -14,7 +14,7 @@ const lightTheme = {
 	textPrimary: '#2d3748',
 	textSecondary: '#4a5568',
 	textTertiary: '#505c70',
-	textHint: '#A0A6B2',
+	textHint: '#757E8F',
 	textDisabled: '#a0aec0',
 
 	border: '#dddddd',