From 1429a6a5cb80324c0a9ee15ab8b256fddd51f255 Mon Sep 17 00:00:00 2001
From: Adam French <adam.a.french@outlook.com>
Date: Fri, 6 Mar 2026 16:01:44 +0000
Subject: [PATCH] Change author ID colour

---
 nginx/vue/src/components/util/Chat.vue | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/nginx/vue/src/components/util/Chat.vue b/nginx/vue/src/components/util/Chat.vue
index 5b82a74..b399d13 100644
--- a/nginx/vue/src/components/util/Chat.vue
+++ b/nginx/vue/src/components/util/Chat.vue
@@ -12,7 +12,8 @@ const messagesContainer = ref(null);
 function scrollToBottom() {
     nextTick(() => {
         if (messagesContainer.value) {
-            messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight;
+            messagesContainer.value.scrollTop =
+                messagesContainer.value.scrollHeight;
         }
     });
 }
@@ -37,9 +38,13 @@ onUnmounted(() => {
 <template>
     <div class="flex flex-col">
         <Header>Chat</Header>
-        <div ref="messagesContainer" class="flex flex-col flex-1 overflow-y-auto">
+        <div
+            ref="messagesContainer"
+            class="flex flex-col flex-1 overflow-y-auto"
+        >
             <p v-for="message in messages" :key="message.id">
-                <span class="font-bold">User {{ message.authorId }}:</span> {{ message.text }}
+                <small>{{ message.authorId }}:</small>
+                {{ message.text }}
             </p>
         </div>
         <input v-model="messageInput" @keyup.enter="sendMessage" />