lks/websocket-chat
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add new message style

Browse Source
This commit is contained in:
Lucas Schumacher 2023-11-06 11:00:28 -05:00
parent 6d24f03648
commit 6e5915fbbd
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
client/src/components/Chat.vue
View File

@ -42,15 +42,21 @@ onMounted(async () => {
<template> <template>
<main> <main>
<div class="overflow-auto position-relative pb-5"> <div class="overflow-auto position-relative pb-5">
<!--
<div v-for="msg in msgs" class="card m-3 text-bg-secondary"> <div v-for="msg in msgs" class="card m-3 text-bg-secondary">
<div class="card-body">{{ msg.username }}: {{ msg.message }}</div> <div class="card-body">{{ msg.username }}: {{ msg.message }}</div>
</div> </div>
<!--
<div v-for="msg in msgs" class="input-group"> <div v-for="msg in msgs" class="input-group">
<div class="alert alert-primary">{{ msg.username }}</div> <div class="alert alert-primary">{{ msg.username }}</div>
<div class="alert alert-secondary">{{ msg.message }}</div> <div class="alert alert-secondary">{{ msg.message }}</div>
</div> </div>
--> -->
<div v-for="msg in msgs" class="d-flex text-body-secondary pt-2 px-3 border-bottom">
<p class="pb-2 mb-0 small lh-sm">
<strong class="d-block text-gray-dark">{{ msg.username }}</strong>
{{ msg.message }}
</p>
</div>
<form onsubmit="event.preventDefault();" class="container-fluid fixed-bottom mb-3"> <form onsubmit="event.preventDefault();" class="container-fluid fixed-bottom mb-3">
<div class="input-group"> <div class="input-group">
<input v-model="input" type="text" class="form-control text-bg-secondary" placeholder="Type message here" <input v-model="input" type="text" class="form-control text-bg-secondary" placeholder="Type message here"