server : (UI) Improve messages bubble shape in RTL (#11220)

I simply have overlooked message bubble's tail placement for RTL text as I use the dark mode and that isn't visible there and this fixes it.
ggerganov · Jan 13, 2025 · 504af20 · 504af20
1 parent 84a4481
commit 504af20
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/examples/server/public/index.html.gz b/examples/server/public/index.html.gz
diff --git a/examples/server/webui/index.html b/examples/server/webui/index.html
@@ -245,10 +245,11 @@ <h3 class="text-lg font-bold mb-6">Settings</h3>
       <div :class="{
         'chat-bubble markdown': true,
         'chat-bubble-base-300': msg.role !== 'user',
-      }" dir="auto">
+      }">
         <!-- textarea for editing message -->
         <template v-if="editingContent !== null">
           <textarea
+            dir="auto"
             class="textarea textarea-bordered bg-base-100 text-base-content w-[calc(90vw-8em)] lg:w-96"
             v-model="editingContent"></textarea>
           <br/>
@@ -259,7 +260,9 @@ <h3 class="text-lg font-bold mb-6">Settings</h3>
           <!-- show loading dots for pending message -->
           <span v-if="msg.content === null" class="loading loading-dots loading-md"></span>
           <!-- render message as markdown -->
-          <vue-markdown v-else :source="msg.content"></vue-markdown>
+          <div v-else dir="auto">
+            <vue-markdown :source="msg.content"></vue-markdown>
+          </div>
           <!-- render timings if enabled -->
           <div class="dropdown dropdown-hover dropdown-top mt-2" v-if="timings && config.showTokensPerSecond">
             <div tabindex="0" role="button" class="cursor-pointer font-semibold text-sm opacity-60">Speed: {{ timings.predicted_per_second.toFixed(1) }} t/s</div>