fix: rtl styling

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

@@ -54,7 +54,7 @@
 	};
 </script>
 
-<div class=" flex w-full user-message" dir="{$settings.chatDirection}">
+<div class=" flex w-full user-message" dir={$settings.chatDirection}>
 	{#if !($settings?.chatBubble ?? true)}
 		<ProfileImage
 			src={message.user
@@ -239,7 +239,7 @@
 					>
 						{#if !($settings?.chatBubble ?? true)}
 							{#if siblings.length > 1}
-								<div class="flex self-center">
+								<div class="flex self-center" dir="ltr">
 									<button
 										class="self-center p-1 hover:bg-black/5 dark:hover:bg-white/5 dark:hover:text-white hover:text-black rounded-md transition"
 										on:click={() => {
@@ -368,7 +368,7 @@
 
 						{#if $settings?.chatBubble ?? true}
 							{#if siblings.length > 1}
-								<div class="flex self-center">
+								<div class="flex self-center" dir="ltr">
 									<button
 										class="self-center p-1 hover:bg-black/5 dark:hover:bg-white/5 dark:hover:text-white hover:text-black rounded-md transition"
 										on:click={() => {

src/lib/components/layout/Navbar.svelte

@@ -141,14 +141,15 @@
 						}}
 					>
 						<button
-							class=" flex rounded-xl p-1.5 w-full hover:bg-gray-100 dark:hover:bg-gray-850 transition"
+							class="select-none flex rounded-xl p-1.5 w-full hover:bg-gray-100 dark:hover:bg-gray-850 transition"
 							aria-label="User Menu"
 						>
 							<div class=" self-center">
 								<img
 									src={$user.profile_image_url}
-									class=" size-6 object-cover rounded-full"
+									class="size-6 object-cover rounded-full"
 									alt="User profile"
+									draggable="false"
 								/>
 							</div>
 						</button>