lucaspalomodevelop/Party
1
0
Fork 0
mirror of https://github.com/lucaspalomodevelop/Party.git synced 2026-03-13 00:07:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

chat styling

Browse Source
This commit is contained in:
hyperbel 2023-07-14 07:23:27 +02:00
parent 310d4467bd
commit 76e56faf8e
2 changed files with 44 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
party/static/css/session.css
View File

@ -424,6 +424,43 @@ margin-right: auto;
}
#chatBox {
background-color: green;
max-height: 600px;
border: 1px solid white;
}
.chat-message {
margin-bottom: 10px;
display: flex;
align-items: flex-start;
}
.chat-message-content {
background-color: #333;
border-radius: 5px;
padding: 10px;
color: #fff;
flex-grow: 1;
text-align: left;
}
.chat-message-details {
display: flex;
flex-direction: column;
align-items: flex-start;
margin-right: 10px;
flex-shrink: 0;
border-right: 1px solid #888;
border-bottom: 1px solid #888;
width: 10%;
}
.chat-message-author {
font-weight: bold;
font-size: 12px;
margin-bottom: 5px;
}
.chat-message-timestamp {
font-size: 10px;
color: #888;
}

10
party/static/js/session.js
View File

@ -81,8 +81,6 @@ function handleSwitchDiv(index) {
chatBox.style.overflow = 'auto';
chatBox.scrollTop = chatBox.scrollHeight;
// join websocket
});
})
break;
@ -160,9 +158,13 @@ function chatMessage(content, author, timestap) {
timestamp_field.textContent = timestap;
messageTimestamp.appendChild(timestamp_field);
const messageDetails = document.createElement('div');
messageDetails.classList.add('chat-message-details');
messageDetails.appendChild(messageAuthor);
messageDetails.appendChild(messageTimestamp);
message.appendChild(messageDetails);
message.appendChild(messageContent);
message.appendChild(messageAuthor);
message.appendChild(messageTimestamp);
return message;
}