const popup = document.querySelector('.chat-popup');
const chatBtn = document.querySelector('.chat-btn');
const submitBtn = document.querySelector('.submit');
const chatArea = document.querySelector('.chat-area');
const inputElm = document.querySelector('input');
const nameInput = document.getElementById('name-input');
const messageInput = document.getElementById('message-input');
chatBtn.addEventListener('click', ()=>{
popup.classList.toggle('show');
})
function changeColor() {
document.getElementById("chat-container").style.backgroundColor =
document.getElementById("colorpicker").value;
}
submitBtn.addEventListener('click', ()=>{
let name = nameInput.value;
let message = messageInput.value;
let temp =
`<div class="out-msg">
<span class="my-msg">${name}: ${message}</span>
<img src="https://scontent.fmnl4-3.fna.fbcdn.net/v/t1.6435-9/190312311_4328031433928410_6699575764276993915_n.jpg?_nc_cat=110&ccb=1-3&_nc_sid=730e14&_nc_ohc=YQzYqqfeJLkAX83b2yU&_nc_ht=scontent.fmnl4-3.fna&oh=c6d9865ea86a417bf45b01b9845f40df&oe=60D8B599" class="kai">
</div>`;
chatArea.insertAdjacentHTML("beforeEnd", temp);
nameInput.value = '';
messageInput.value = '';
})
const chatBtn = document.querySelector('.chat-btn');
const submitBtn = document.querySelector('.submit');
const chatArea = document.querySelector('.chat-area');
const inputElm = document.querySelector('input');
const nameInput = document.getElementById('name-input');
const messageInput = document.getElementById('message-input');
chatBtn.addEventListener('click', ()=>{
popup.classList.toggle('show');
})
function changeColor() {
document.getElementById("chat-container").style.backgroundColor =
document.getElementById("colorpicker").value;
}
submitBtn.addEventListener('click', ()=>{
let name = nameInput.value;
let message = messageInput.value;
let temp =
`<div class="out-msg">
<span class="my-msg">${name}: ${message}</span>
<img src="https://scontent.fmnl4-3.fna.fbcdn.net/v/t1.6435-9/190312311_4328031433928410_6699575764276993915_n.jpg?_nc_cat=110&ccb=1-3&_nc_sid=730e14&_nc_ohc=YQzYqqfeJLkAX83b2yU&_nc_ht=scontent.fmnl4-3.fna&oh=c6d9865ea86a417bf45b01b9845f40df&oe=60D8B599" class="kai">
</div>`;
chatArea.insertAdjacentHTML("beforeEnd", temp);
nameInput.value = '';
messageInput.value = '';
})