lunastella
/
lilachat-frontend
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Misc appearence changes.

main
Luna 2021-07-24 08:17:41 -07:00
parent 7039ad807e
commit cb636f047f
4 changed files with 15 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
chat.css
View File

@ -12,7 +12,7 @@ form {
input { input {
padding: 2%; padding: 2%;
width: 100%; width: 100%;
background-color: #55CDFC; background-color: darkgrey;
border-style: none; border-style: none;
border-bottom-style: solid; border-bottom-style: solid;
border-bottom-color: black; border-bottom-color: black;
@ -34,7 +34,7 @@ button {
font-size: 30px; font-size: 30px;
} }
#chatbox { #outerchatbox {
background-color: white; background-color: white;
padding: 1rem; padding: 1rem;
box-shadow: 10px 10px 10px black; box-shadow: 10px 10px 10px black;
@ -44,8 +44,8 @@ button {
flex-direction: column; flex-direction: column;
} }
#innerchatbox { #chatbox {
background-color: rgba(60, 60, 60, .85); background-color: rgb(60, 60, 60);
width: 100%; width: 100%;
height: 90%; height: 90%;
overflow-y: scroll; overflow-y: scroll;

4
chat.html
View File

@ -15,9 +15,9 @@
<h1>Welcome to the chat!</h1> <h1>Welcome to the chat!</h1>
<div id="chatbox"> <div id="outerchatbox">
<div id="innerchatbox"> <div id="chatbox">
</div> </div>

11
chat.js
View File

@ -38,7 +38,7 @@ let messageUpdate = window.setInterval(fetchMessages, 500);
async function fetchMessages() { async function fetchMessages() {
const response = await fetch('/api/message/messages.json'); const response = await fetch('/api/message/messages.json');
const recievedMessages = await response.json(); const recievedMessages = await response.json();
document.getElementById("innerchatbox").innerHTML = "" document.getElementById("chatbox").innerHTML = ""
for (const message of recievedMessages) { for (const message of recievedMessages) {
printText(message.user.bold().toString() + ": " + message.body.toString()); printText(message.user.bold().toString() + ": " + message.body.toString());
@ -46,7 +46,7 @@ async function fetchMessages() {
if (recievedMessages.length != messageCount) { if (recievedMessages.length != messageCount) {
let scroll = document.getElementById("innerchatbox"); let scroll = document.getElementById("chatbox");
scroll.scrollTop = scroll.scrollHeight; scroll.scrollTop = scroll.scrollHeight;
} }
@ -58,7 +58,7 @@ async function fetchMessages() {
function printText(text) { function printText(text) {
let p = document.createElement("p"); let p = document.createElement("p");
const div = document.getElementById("innerchatbox"); const div = document.getElementById("chatbox");
div.appendChild(p) div.appendChild(p)
p.innerHTML = text p.innerHTML = text
} }
@ -75,4 +75,7 @@ function loggedIn() {
} }
} }
loggedIn() loggedIn()
//REVIECE USERS PRONOUNS

5
index.css
View File

@ -1,6 +1,5 @@
html { html {
background: #F7A8B8; background: #F7A8B8;
text-align: center;
font-family: "Lucida Console", "Courier New", monospace; font-family: "Lucida Console", "Courier New", monospace;
} }
@ -28,14 +27,14 @@ a {
margin-right: 0.3em; margin-right: 0.3em;
margin-left: -40%; margin-left: -40%;
margin-top: auto; margin-top: auto;
margin-bottom: auto; margin-bottom: 20%;
} }
#chatbox { #chatbox {
flex: 1; flex: 1;
height: 53rem; height: 53rem;
margin-left: 0.3em; margin-left: 0.3em;
margin-right: -50%; margin-right: -30%;
border: none; border: none;
} }