style: changed the conversation-box to use q-form to enable the submit function, as well as made the input field autogrow for readability

This commit is contained in:
Lion Arar 2025-09-26 10:37:22 -04:00
parent 1a78b49193
commit 5036be71e6

View File

@ -35,12 +35,13 @@ const sendMessage = async () => {
<div class="chat-body">
<DialogueContent :messages="messages"></DialogueContent>
</div>
<div class="row chat-footer">
<q-input v-model="text" label="Enter a Message" class="col" />
<q-btn @click="sendMessage" :ripple="{ center: true }" color="primary" glossy label="Send"
style="width:60px; height:45px; margin-top: 8px; font-size: 14px;" class="col-2">
<q-form @submit="sendMessage" class="row chat-footer">
<q-input type="textarea" style="margin-right: 5px;" autogrow v-model="text" label="Enter a Message"
class="col" />
<q-btn type="submit" :ripple="{ center: true }" color="primary" glossy label="Send"
style="align-self: flex-end; width:60px; height:45px; margin-top: 8px; font-size: 14px;" class="col-2">
</q-btn>
</div>
</q-form>
</div>
</transition>
</template>