美化 发帖、威望、支持用图型显示

1.模板message_user_info
查找

代码:

<div class="avatarHolder">
            <span class="helper"></span>

替换

代码:

<div class="avatarHolder" align="center">
<div class="extraUserInfo roundStats">
<dl class="pairsInline roundMessage">
<dt><span class="fa fa-comments fa-fw Tooltip" title="{xen:phrase messages}"></span></dt>
<dd><a href="{xen:link search/member, '', 'user_id={$user.user_id}'}" class="concealed" rel="nofollow">{xen:number $user.message_count}</a></dd>
</dl>

<dl class="pairsInline roundLike">
<dt><span class="fa fa-thumbs-up fa-fw Tooltip" title="{xen:phrase likes_received}"></span></dt>
<dd>{xen:number $user.like_count}</dd>
</dl>

<dl class="pairsInline roundTrophy">
<dt><span class="fa fa-trophy fa-fw Tooltip" title="{xen:phrase trophy_points}"></span></dt>
<dd><a href="{xen:link 'members/trophies', $user}" class="OverlayTrigger concealed">{xen:number $user.trophy_points}</a></dd>
</dl>     
</div>     
        <span class="helper"></span>

2.模板 EXTRA.CSS

添加

代码:

.messageUserInfo .messageUserBlock .avatar > img { border-radius: 50%; }

.roundStats .fa {
  font-size: 30px;
  line-height: 37px;
  margin-left: -1px;
  margin-top: -1px;
  opacity: 0.25;
}
.roundStats .pairsInline {
  border: 1px solid #d5d5d5;
  border-radius: 100%;
  height: 36px;
  width: 36px;
}
.messageUserBlock .roundStats .roundTrophy { margin-left: 20px; overflow: hidden; }
.messageUserBlock .roundStats .roundLike { margin-left: 5px; overflow: hidden; }
.messageUserBlock .roundStats .roundMessage { margin-left: 20px; margin-top: -10px; overflow: hidden; }

.roundStats .pairsInline > dd {
  color: #000000;
  display: block;
  margin-top: -24px;
  text-align: center;
}
.messageUserInfo .extraUserInfo.roundStats {
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
  float: left;
  margin-left: -24px;
  margin-top: -2px;
  position: absolute;
}
.messageUserBlock .extraUserInfo { font-size: 11px; padding: 4px 6px; }

3.

4.


效果图