diff --git a/src/lib/components/chat/MessageInput.svelte b/src/lib/components/chat/MessageInput.svelte
index b70430c501..acf797cd10 100644
--- a/src/lib/components/chat/MessageInput.svelte
+++ b/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);
diff --git a/src/lib/components/chat/Messages/CompareMessages.svelte b/src/lib/components/chat/Messages/CompareMessages.svelte
index a7959dbec3..abb06e3a45 100644
--- a/src/lib/components/chat/Messages/CompareMessages.svelte
+++ b/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;
 
diff --git a/src/lib/components/chat/Messages/ProfileImage.svelte b/src/lib/components/chat/Messages/ProfileImage.svelte
index 3ee78e8f60..80bdea2c72 100644
--- a/src/lib/components/chat/Messages/ProfileImage.svelte
+++ b/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) ||