You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
48 lines
997 B
Vue
48 lines
997 B
Vue
<template>
|
|
<div>
|
|
<div ref="msgContainer" id="messagesContainer" class="messagesContainer">
|
|
<div id="messages" class="messages">
|
|
<p style="margin-left: 1rem; font-style: italic;">You entered the chat</p>
|
|
<message style="display: none;" />
|
|
<messageReceive style="display: none;" />
|
|
</div>
|
|
</div>
|
|
<newMessage />
|
|
<topBanner />
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import message from '@/components/message.vue';
|
|
import messageReceive from '@/components/messageReceive.vue';
|
|
import newMessage from '@/components/newMessage.vue';
|
|
import topBanner from "@/components/topBanner";
|
|
|
|
export default {
|
|
name: 'chat',
|
|
components: {
|
|
message,
|
|
messageReceive,
|
|
newMessage,
|
|
topBanner
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.messagesContainer{
|
|
position: absolute;
|
|
margin: 0;
|
|
left: 0;
|
|
top: 3rem;
|
|
height: calc(100% - 7rem);
|
|
width: 100%;
|
|
overflow-y: auto;
|
|
}
|
|
.messages{
|
|
position: relative;
|
|
margin-top: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
</style>
|