Home
A friendly chatting site.
Welcome to this exquisite chatting site, this is the chatting site for friendoz who just wanna hang out! Check out Neocities!
.allMessages {
display: block;
margin: 5px;
font-family: arial;
font-size: 10pt;
max-width: 80%;
clear: both;
box-shadow: 1px 1px 2px #555;
}
.allMessages:hover {
filter: brightness(85%);
-webkit-filter: brightness(85%);
}
.sent {
display: inline-block;
border-radius: 15px 15px 2px 15px;
background-color: #CCC;
color: #111;
position: relative;
}
.sent > .senderInfo {
font-style: italic;
color: #555;
}
.recieved {
display: inline-block;
border-radius: 15px 15px 15px 2px;
background-color: #04b58f;
color: #FFF;
position: relative;
}
.recieved > .senderInfo {
font-style: italic;
color: #02755d;
}
.msgBody {
text-align: justify;
}
#background {
background-color: #FFF;
background-image: url('/media/doodle.jpg');
background-size: 100% auto;
background-attachment: local;
background-repeat: repeat;
}
#input {
background-color: #AAA;
border-radius: 0;
}
#input:empty::before {
content: "Send a message...";
}
.owner {
background-color: transparent;
background-image: url('/media/owner.png');
background-size: 100% 100%;
}
.mod {
background-color: transparent;
background-image: url('/media/mod.png');
background-size: 100% 100%;
}
#timestamp {
clear: both;
font-family: arial;
font-size: 10pt;
text-shadow: 1px 1px #FFF, -1px -1px #FFF;
color: #000;
max-width: 75px;
}
#textInput {
background-color: #FFF;
background-image: url('/media/doodle.jpg');
background-size: 100% auto;
background-attachment: local;
background-repeat: repeat;
}
.msgWrapper {
display: flex;
width: 100%;
align-items: center;
}
.msgWrapper:has(.received) {
justify-content: space-between;
flex-direction: row-reverse;
}
.msgWrapper:has(.sent) {
justify-content: flex-end;
}
.pinned {
position: relative;
}
.pinned:after {
display: inline-block;
position: absolute;
right: 2px;
top: 2px;
content: "📌";
}
#top_banner {
background-color: #093B5D;
}
#replyBanner {
font-size: 10pt;
display: inline-block;
background-color: #777;
border-radius: 8px 8px 0 0;
box-shadow: 1px 1px 3px #AAA;
margin-left: 15px;
padding: 2px;
padding-right: 10px;
padding-left: 10px;
}
#emojiTray {
background-color: #AAA;
}