8c93101989
This was used to conditionally render messages in the group style, but it's actually unnecessary. We can render the same markup in both cases and change the appearance with css.
98 lines
1.3 KiB
CSS
98 lines
1.3 KiB
CSS
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
|
|
.clearfix:after { clear: both; }
|
|
.clearfix { zoom: 1; }
|
|
|
|
body {
|
|
min-width: 320px;
|
|
min-height: 500px;
|
|
}
|
|
.number.error {
|
|
background-color: #ffdddd;
|
|
}
|
|
|
|
.gutter {
|
|
padding-bottom: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
#contacts {
|
|
overflow-y: scroll;
|
|
}
|
|
#contacts::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
.contact.selected {
|
|
background-color: aliceblue;
|
|
}
|
|
|
|
.gutter .contact .avatar {
|
|
background-position: center;
|
|
background-size: cover;
|
|
}
|
|
|
|
.conversation {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
ul.discussion {
|
|
margin: 0;
|
|
padding: 10px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
li.entry .sender {
|
|
display: none;
|
|
font-size: 0.75em;
|
|
opacity: 0.54;
|
|
}
|
|
|
|
.group.conversation li.entry .sender {
|
|
display: block;
|
|
}
|
|
|
|
|
|
li.entry .avatar {
|
|
height:32px;
|
|
width:32px;
|
|
border-radius:32px;
|
|
cursor:pointer;
|
|
display:inline-block;
|
|
float:left;
|
|
clear:both;
|
|
background-color:whitesmoke;
|
|
}
|
|
|
|
li.entry.outgoing .avatar {
|
|
display: none;
|
|
}
|
|
|
|
li.entry img {
|
|
max-width: 100%;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.send .attachments img {
|
|
width: 30px;
|
|
height: 30px;
|
|
}
|
|
|
|
.bootstrap-tagsinput .tag {
|
|
background-color: #00badd;
|
|
padding: 5px;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.timestamp {
|
|
font-size: 0.75em;
|
|
display: block;
|
|
}
|
|
|
|
.incoming .timestamp {
|
|
color: gray;
|
|
}
|
|
|
|
.outgoing .timestamp {
|
|
color: whitesmoke;
|
|
}
|