Tutorial 2x Collapsible User Extras - Thu gọn thông tin người dùng cho XenForo 2

[PVS]

Collapsible User Extras - Thu gọn thông tin người dùng cho XenForo 2

Mod này sẽ ẩn thông tin người dùng bổ sung trong message theo mặc định. Thống kê có thể được hiển thị bằng cách nhấp vào mũi tên mở rộng.

Ở đây sẽ chỉ hỗ trợ style mặc định, style của bên thứ ba sẽ không được hỗ trợ. Cùng với đó nếu bạn sử dụng style Pixel Exit thì điều này đã có sẵn.

​

Vào template post_macros

Tìm:

<xf:macro template="message_macros" name="user_info" arg-user="{$post.User}" arg-fallbackName="{$post.username}" arg-dateHtml="{$dateHtml}" arg-linkHtml="{$linkHtml}" />

Thêm vào bên dưới:

<span id="collapse-{$post.post_id}" class="collapseTrigger collapseTrigger--block" data-xf-click="toggle" data-target="#js-post-{$post.post_id} .message-userExtras"></span>

========================================
Vào template message_macros

Tìm:

<div class="message-userExtras">

Thay bằng:

<div class="message-userExtras message-userExtras-body message-userExtras--collapsible">

Vào tempalte extra.less thêm:

/* User Extras Collapse */
.message-userExtras-body
{
   .m-listPlain();

    &.message-userExtras--collapsible
    {
        .has-no-js & { display: block; }

        .m-transitionFadeDown();
    }
}

.message-cell
{
    .collapseTrigger
    {
        text-align: center;

        &.is-active:before
        {
            transform: rotate(-180deg);
        }
        &:before
        {
            content: "\f13a";
            color: @xf-linkColor;
            transition: ease-in transform .3s;
            width: auto;
        }
        &.collapseTrigger--block:before
        {
            float: none;
        }
    }
}
@media (max-width: @xf-responsiveNarrow)
{
    .message-cell
    {
        .collapseTrigger
        {
            display: none;
        }
    }
}

Vậy là xong.

Chúc các bạn thành công.

Nguồn: xenforo.com​