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.

diff --git a/examples/server/public/index.html.gz b/examples/server/public/index.html.gz
index 489bff84b98f7bd7ebcdabeb7d0f9b31093eae58..18f7ecac9ef63eb46dcb3b84b1e10e2b79f22c44 100644 (file)
Binary files a/examples/server/public/index.html.gz and b/examples/server/public/index.html.gz differ

diff --git a/examples/server/webui/index.html b/examples/server/webui/index.html
index a76d831a9981262464f68bb496da525fdddae28f..2180ef4ad93ee7fd6d073c38b63c9843fb42d65f 100644 (file)
--- a/examples/server/webui/index.html
+++ b/examples/server/webui/index.html
@@ -245,10 +245,11 @@
       <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 @@
           <!-- 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>