yvachot/chatless
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

first commit

Browse source
This commit is contained in:
wilfried 2021-05-27 10:53:34 +02:00
parent 6984c550fb
commit 595d0e3013
47 changed files with 13471 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

109
frontend/src/styles.scss Normal file
View file

@ -0,0 +1,109 @@
body {
background-color: #E5E5E5;
}
.container-fluid {
padding: 50px 200px;
overflow: hidden;
}
.user-list-card {
background-color: white;
border-radius: 10px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
height: calc(100vh - 100px);
padding: 10px;
.user-card {
display: flex;
padding: 10px;
cursor: pointer;
&.active {
background-color: #E5E5E5;
}
.username {
font-size: 20px;
font-weight: 500;
margin-bottom: 0;
display: flex;
justify-content: center;
align-items: center;
}
}
.user-card:not(:last-child) {
border-bottom: 1px solid #BBBBBB;
}
}
.chat-container {
background-color: white;
border-radius: 10px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
height: calc(100vh - 100px);
position: relative;
overflow: hidden;
.chat-header {
height: 70px;
background-color: #E5E5E5;
display: flex;
justify-content: flex-start;
align-items: center;
.username {
font-size: 14px;
font-weight: 500;
margin-bottom: 0;
display: flex;
justify-content: center;
align-items: center;
}
}
.chat-body {
background-image: url(./assets/image/user.png);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
height: calc(100vh - 125px);
overflow-y: auto;
.message-container {
background-color: white;
padding: 7px;
border-radius: 5px;
width: fit-content;
max-width: 90%;
margin-bottom: 15px;
}
.same-user {
display: flex;
justify-content: flex-end;
.message-container {
background-color: lightskyblue;
}
}
}
.chat-footer {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background-color: #EDEDED;
padding: 10px 20px;
.form-control {
background-color: white;
border: 1px solid #D8DDEC;
box-sizing: border-box;
font-size: 1rem;
color: black;
}
}
}