From 2e77ad87ccdd1eab1b06ce4d7b01a885c1f1dd65 Mon Sep 17 00:00:00 2001
From: Ido Henri Mamia <idomamia@gmail.com>
Date: Thu, 16 May 2024 23:29:33 +0300
Subject: [PATCH] Make the margin and avatar support both LTR and RTL

---
 src/lib/components/chat/Messages/Name.svelte         | 2 +-
 src/lib/components/chat/Messages/ProfileImage.svelte | 4 +++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/chat/Messages/Name.svelte b/src/lib/components/chat/Messages/Name.svelte
index dea6ef84e..ac8e7267e 100644
--- a/src/lib/components/chat/Messages/Name.svelte
+++ b/src/lib/components/chat/Messages/Name.svelte
@@ -1,3 +1,3 @@
-<div class=" self-center font-bold mb-0.5 capitalize line-clamp-1">
+<div class=" self-center font-bold mb-0.5 capitalize line-clamp-1 contents">
 	<slot />
 </div>
diff --git a/src/lib/components/chat/Messages/ProfileImage.svelte b/src/lib/components/chat/Messages/ProfileImage.svelte
index 84410d91e..7c44d7530 100644
--- a/src/lib/components/chat/Messages/ProfileImage.svelte
+++ b/src/lib/components/chat/Messages/ProfileImage.svelte
@@ -1,7 +1,9 @@
 <script lang="ts">
+	import { settings } from '$lib/stores';
+
 	export let src = '/user.png';
 </script>
 
-<div class=" mr-4">
+<div class={$settings?.chatDirection === 'LTR' ? "mr-4" : "ml-4"}>
 	<img {src} class=" max-w-[28px] object-cover rounded-full" alt="profile" draggable="false" />
 </div>