fix: styling

src/lib/components/chat/MessageInput.svelte

@@ -586,7 +586,7 @@
 						}}
 					/>
 					<form
-						dir={$settings?.chatDirection}
+						dir={$settings?.chatDirection ?? 'LTR'}
 						class=" flex flex-col relative w-full rounded-3xl px-1.5 bg-gray-50 dark:bg-gray-850 dark:text-gray-100"
 						on:submit|preventDefault={() => {
 							submitPrompt(prompt, user);

src/lib/components/chat/Messages/CompareMessages.svelte

@@ -72,7 +72,7 @@
 						currentMessageId
 					].model === model
 						? 'outline-gray-200 dark:outline-gray-700 outline-2'
-						: 'outline-gray-100 dark:outline-gray-850 '} transition p-6 rounded-3xl"
+						: 'outline-gray-100 dark:outline-gray-850 '} transition p-5 rounded-3xl"
 					on:click={() => {
 						currentMessageId = groupedMessages[model].messages[groupedMessagesIdx[model]].id;
 

src/lib/components/chat/Messages/ProfileImage.svelte

@@ -5,7 +5,7 @@
 	export let src = '/user.png';
 </script>
 
-<div class={$settings?.chatDirection === 'LTR' ? 'mr-3' : 'ml-3'}>
+<div class={($settings?.chatDirection ?? 'LTR') === 'LTR' ? 'mr-3' : 'ml-3'}>
 	<img
 		crossorigin="anonymous"
 		src={src.startsWith(WEBUI_BASE_URL) ||