xf 2.1 only เพิ่ม css code ด้านล่างใน "Extra.less" Template:
cr.
CSS:
.block--messages .message {
&.is-mod-selected {border-color: transparent; border-bottom-color: @xf-inlineModHighlightColor;}
}
.blockMessage {box-shadow: none;
&.blockMessage--none {box-shadow: none;}
}
.block--messages {.block-container {box-shadow: none;}}
.message-inner {display: block;}
.message-cell {
.m-clearFix();
&.message-cell--user {
width: auto;
border-right: none;
border-bottom: @xf-messageUserBlock--border-width solid @xf-messageUserBlock--border-color;
}
&.message-cell--main {padding-left: @xf-messagePadding;}
&.message-cell--extra {
width: auto;
border-left: none;
}
.message--quickReply {}
}
.message--quickReply .message-cell--user {display:none;}
.message-userArrow {
top: auto;
right: auto;
bottom: -1px;
left: ((@avatar-s));
content: "";
border: none;
.m-triangleLeft(@xf-contentBg, @xf-messagePadding - 1px);
.m-triangleUp(xf-default(@xf-messageUserBlock--border-color, transparent), @xf-messagePadding);
&:after {
top: auto;
right: auto;
left: -(@xf-messagePadding - 1px);
bottom: -@xf-messagePadding;
border: none;
.m-triangleUp(@xf-contentBg, @xf-messagePadding - 1px);
}
}
.message-avatar {margin-bottom: 0; .avatar {& + .message-avatar-online {left: auto; right: 0;}}}
.message-name {font-size: @xf-fontSizeLarge; text-align: left;}
.message-user {display: flex;}
.message-userTitle {display: inline-block; text-align: left;}
.message-userBanner.userBanner {
width: -moz-fit-content;
width: fit-content;
text-align: left;
margin: 3px 0 0 0;
}
.message-userDetails {
flex: 1;
min-width: 0;
padding-left: @xf-messagePadding;
display: flex;
flex-flow: column;
justify-content: center;
}
.message--deleted {display: block;}
@media (max-width: @xf-messageSingleColumnWidth) {.message:not(.message--forceColumns) {.message-name {font-size: inherit;}}}cr.
