The administration panel and web client for ParEdu
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

110 lines
3.5 KiB

.chat-container {
width: 100%;
height: 500px; }
.chat-container .user_id {
display: none; }
.chat-container .users {
height: 100%;
padding-right: 0;
}
.chat-container .users .users_user {
justify-content: space-between;
cursor: pointer; }
.chat-container .users .users_user .users_user_info {
pointer-events: none; }
.chat-container .users .users_user .users_user_id {
visibility: hidden;
pointer-events: none; }
.chat-container .users .users_user .users_user_pic {
height: 100;
width: 20%;
pointer-events: none; }
.chat-container .users .users_user .status {
height: 20px;
width: 20px;
border-radius: 50%;
background-color: black; }
.chat-container .users .users_user .active {
background-color: lime; }
.chat-container .users .users_user:hover {
background-color: #a2c6eb; }
.chat-container .chat {
display: flex;
flex-direction: column;
height: 500px; }
.chat-container .chat .chat_history {
width: 100%;
height: 80%;
display: flex;
flex-direction: column; }
.chat-container .chat .chat_history .chat_history_none {
align-self: center;
display: flex;
height: 10%; }
.chat-container .chat .chat_history .chat_history_none p {
color: blue; }
.chat-container .chat .chat_history .chat_history_user {
width: 100%;
height: 70px;
background-color: #455a64;
display: flex;
justify-content: space-between; }
.chat-container .chat .chat_history .chat_history_user .chat_history_user_pic {
background-position: center;
background-repeat: no-repeat;
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
height:100%;
width: 70px;
margin-left: 15px; }
.chat-container .chat .chat_history .chat_history_user .chat_history_user_info {
display: flex;
justify-content: center;
align-items: center;
color: white;
font-weight: bold; }
.chat-container .chat .chat_history .chat_history_user .chat_history_user_id {
visibility: hidden; }
.chat-container .chat .chat_history .chat_history_chat {
display: flex;
flex-direction: column;
width: 100%;
height: 80%;
overflow-y: scroll;
background-color: #fafafa; }
.chat-container .chat .chat_history .chat_history_chat .chat_history_chat_sent {
width: 45%;
display: flex;
flex-direction: column;
align-self: flex-end;
background-color: #26a69a;
border-radius: 10px;
padding: 5px;
margin-top: 5px;
margin-right: 15px;}
.chat-container .chat .chat_history .chat_history_chat .chat_history_chat_received {
width: 45%;
display: flex;
flex-direction: column;
align-self: flex-start;
background-color: #26c6da;
border-radius: 10px;
padding: 5px;
margin-top: 5px;
margin-left: 15px; }
.chat-container .chat .chat_box {
width: 100%;
height: 20%;
display: flex;
justify-content: center;
align-items: center;
background-color: #fafafa; }
.chat-container .chat .chat_box form {
display: flex;
align-items: center;
width: 90%;
height: 90%; }