gorb/frontend
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

feat: add rounded corners to message box and input

Browse source
This commit is contained in:
SauceyRed 2025-05-29 15:23:10 +02:00
parent fb38edcd81
commit 786b4e0925
Signed by: sauceyred
GPG key ID: 270B096EF6E9A462
1 changed files with 6 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

9
components/MessageArea.vue
View file

@ -4,9 +4,9 @@
<Message v-for="message of messages" :username="message.user.display_name ?? message.user.username" :text="message.message" <Message v-for="message of messages" :username="message.user.display_name ?? message.user.username" :text="message.message"
:timestamp="uuidToTimestamp(message.uuid)" :img="message.user.avatar" format="12" /> :timestamp="uuidToTimestamp(message.uuid)" :img="message.user.avatar" format="12" />
</div> </div>
<div id="message-box"> <div id="message-box" class="rounded-corners">
<form id="message-form" @submit="sendMessage"> <form id="message-form" @submit="sendMessage">
<input v-model="messageInput" type="text" name="message-input" id="message-box-input" autocomplete="off"> <input v-model="messageInput" id="message-box-input" class="rounded-corners" type="text" name="message-input" autocomplete="off">
<button id="submit-button" type="submit"> <button id="submit-button" type="submit">
<Icon name="lucide:send" /> <Icon name="lucide:send" />
</button> </button>
@ -54,7 +54,7 @@ if (accessToken && apiBase) {
["Authorization", accessToken] ["Authorization", accessToken]
); );
if (ws) break; if (ws) break;
await sleep(10000); await sleep(5000);
} while (!ws); } while (!ws);
ws.addEventListener("open", (event) => { ws.addEventListener("open", (event) => {
@ -72,6 +72,9 @@ ws.addEventListener("message", async (event) => {
scrollToBottom(messagesElement); scrollToBottom(messagesElement);
} }
}); });
} else { } else {
await refresh(); await refresh();
} }