ydeng/sports-matcher
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed chat

Browse Source
This commit is contained in:
Hansi Xu 2022-03-06 21:37:30 -05:00
parent 532b5d3876
commit 30c407563d
2 changed files with 19 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
sports-matcher/src/ChatWindow.js
View File

@ -5,11 +5,13 @@ import './chats.css'
import Chat from './Chat' import Chat from './Chat'
import Contact from './Contact' import Contact from './Contact'
import { useState } from "react"; import { useState } from "react";
import Navbar from './Navbar';
class ChatWindow extends React.Component { class ChatWindow extends React.Component {
render() { render() {
return ( return (
<div class="chatcomponent"> <div class="chatcomponent">
<Navbar></Navbar>
<UserList /> <UserList />
<MessageList /> <MessageList />
<ChatInput /> <ChatInput />

33
sports-matcher/src/chats.css
View File

@ -10,7 +10,7 @@
border-color:rgb(75, 75, 75); border-color:rgb(75, 75, 75);
background-color: rgb(80, 80, 80); background-color: rgb(80, 80, 80);
height: 70px; height: 80px;
user-select: none; user-select: none;
} }
@ -18,9 +18,9 @@
background-color: black; background-color: black;
} }
.contactlist { .contactlist {
height: 500px; height: 90%;
width: 200px; width: 13%;
top: 0; top: 10%;
left: 0; left: 0;
box-sizing: border-box; box-sizing: border-box;
border-radius: 2%; border-radius: 2%;
@ -28,13 +28,14 @@
overflow-y: scroll; overflow-y: scroll;
overflow-x: hidden; overflow-x: hidden;
position: absolute;
text-align: center; text-align: center;
} }
.messagelist { .messagelist {
height: 400px; height: 70%;
width: 800px; width: 87%;
top: 0px; top: 10%;
left: 200px; left: 13%;
position: absolute; position: absolute;
background-color: rgb(80, 80, 80); background-color: rgb(80, 80, 80);
@ -77,29 +78,29 @@
} }
.left { .left {
background-color: rgba(0, 57, 163, 0.637); background-color: rgba(0, 57, 163, 0.637);
margin-right: 35px; margin-left: 20px;
color: white; color: white;
float: auto; float: left;
} }
.right { .right {
background-color: khaki; background-color: khaki;
color: black; color: black;
margin-right: 35px; margin-right: 20px;
float: right; float: right;
} }
.chatbubble-container { .chatbubble-container {
width: 800px; width: 100%;
height: auto; height: auto;
float: left; float: left;
} }
.chatinput { .chatinput {
background-color: rgb(75, 75, 75); background-color: rgb(75, 75, 75);
top: 400px; top: 80%;
left: 200px; left: 13%;
position: absolute; position: absolute;
height: 92px; height: 20%;
width: 793px; width: 87%;
color: antiquewhite; color: antiquewhite;