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

feat: remove margin-top from message box and have it be set dynamically on last message

Browse source
This commit is contained in:
SauceyRed 2025-05-31 16:34:25 +02:00
parent 3fd28ed3fc
commit 5011affd49
Signed by: sauceyred
GPG key ID: 2BF92EB6D8A5CCA7
2 changed files with 14 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

12
components/MessageArea.vue
View file

@ -1,12 +1,11 @@
<template>
<div id="message-area">
<div id="messages" ref="messagesElement">
<div v-for="(message, i) of messages">
<Message :username="message.user.display_name ?? message.user.username"
:text="message.message" :timestamp="messageTimestamps[message.uuid]" :img="message.user.avatar"
format="12" :type="messagesType[message.uuid]"
:margin-bottom="messages[i + 1] && messagesType[messages[i + 1].uuid] == 'normal'" />
</div>
<Message v-for="(message, i) of messages" :username="message.user.display_name ?? message.user.username"
:text="message.message" :timestamp="messageTimestamps[message.uuid]" :img="message.user.avatar"
format="12" :type="messagesType[message.uuid]"
:margin-bottom="messages[i + 1] && messagesType[messages[i + 1].uuid] == 'normal'"
:last="i == messages.length - 1" />
</div>
<div id="message-box" class="rounded-corners">
<form id="message-form" @submit="sendMessage">
@ -176,7 +175,6 @@ onMounted(async () => {
padding-bottom: 1dvh;
padding-top: 1dvh;
margin-bottom: 1dvh;
margin-top: 2dvh;
}
#message-form {