UX improvement for send message button

This commit is contained in:
Noah 2023-08-16 22:26:02 -07:00
parent 89f3937da8
commit 74aa9527cc

View File

@ -1117,20 +1117,27 @@
<div class="card-content p-2"> <div class="card-content p-2">
<div class="columns is-mobile"> <div class="columns is-mobile">
<div class="column" <div class="column pr-1 is-narrow" v-if="canUploadFile">
:class="{'pr-1': canUploadFile}"> <button type="button" class="button"
@click="uploadFile()">
<i class="fa fa-image"></i>
</button>
</div>
<div class="column pr-1"
:class="{'pl-1': canUploadFile}">
<form @submit.prevent="sendMessage()"> <form @submit.prevent="sendMessage()">
<input type="text" class="input" <input type="text" class="input"
v-model="message" v-model="message"
placeholder="Message" placeholder="Write a message"
@keydown="sendTypingNotification()" @keydown="sendTypingNotification()"
:disabled="!ws.connected"> :disabled="!ws.connected">
</form> </form>
</div> </div>
<div class="column pl-1 is-narrow" v-if="canUploadFile"> <div class="column pl-1 is-narrow">
<button type="button" class="button" <button type="button" class="button"
@click="uploadFile()"> :disabled="message.length === 0"
<i class="fa fa-image"></i> @click="sendMessage()">
<i class="fa fa-paper-plane"></i>
</button> </button>
</div> </div>
</div> </div>