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"> <div class="chat-body">
<DialogueContent :messages="messages"></DialogueContent> <DialogueContent :messages="messages"></DialogueContent>
</div> </div>
<div class="row chat-footer"> <q-form @submit="sendMessage" class="row chat-footer">
<q-input v-model="text" label="Enter a Message" class="col" /> <q-input type="textarea" style="margin-right: 5px;" autogrow v-model="text" label="Enter a Message"
<q-btn @click="sendMessage" :ripple="{ center: true }" color="primary" glossy label="Send" class="col" />
style="width:60px; height:45px; margin-top: 8px; font-size: 14px;" class="col-2"> <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> </q-btn>
</div> </q-form>
</div> </div>
</transition> </transition>
</template> </template>