Изменяем внешний вид личных переписок

Внешний вид личных переписок
Совместимость с XenForo
XenForo 1.5
Изменяем внешний вид личных переписок.

Свой собственный аватар появляется всегда справа, а других участников слева.

messenger-layout-1.png

В адаптивном (отзывчивом) дизайне, лишние элементы были удалены (с помощью CSS)

messenger-layout-3.png

Инструкция

В шаблоне message находим:
Код:
<li id="{$messageId}" class="message {xen:if $message.isDeleted, 'deleted'} {xen:if '{$message.is_staff}', 'staff'} {xen:if $message.isIgnored, ignored}" data-author="{$message.username}">
и заменяем на:
Код:
<li id="{$messageId}" class="message {xen:if $message.isDeleted, 'deleted'} {xen:if '{$message.is_staff}', 'staff'} {xen:if $message.isIgnored, ignored} {xen:if '{$message.conversation_id}', {xen:if '{$visitor.user_id} ==  {$message.user_id}', 'ctaConversationMessageSelf', 'ctaConversationMessageOther'}}" data-author="{$message.username}">

В шаблон EXTRA.css добавляем:
Код:
.conversation_view .mainContent .messageList,
.conversation_view .mainContent .messageList .message
{
    border: none !important;
}

.conversation_view .message .newIndicator
{
    display: none;
}

.ctaConversationMessageSelf .messageUserInfo,
.Responsive .ctaConversationMessageSelf .messageUserInfo
{
    float: right;
}

.ctaConversationMessageSelf .messageUserBlock .arrow,
.ctaConversationMessageOther .messageUserBlock .arrow
{
    display: none;
}

.ctaConversationMessageSelf.message .messageInfo
{
    margin-left: 0;
    margin-right: 140px;
}

.ctaConversationMessageSelf .messageContent
{
    border-radius: 10px;
    background-color: @primaryLighterStill;
}

.ctaConversationMessageOther .messageContent
{
    border-radius: 10px;
    background-color: @pageBackground;
}

.ctaConversationMessageSelf .messageText,
.ctaConversationMessageOther .messageText
{
    padding: 10px;
}

<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveNarrowWidth)
{
    .Responsive .ctaConversationMessageOther .messageUserInfo
    {
        float:left;
    }

    .Responsive .ctaConversationMessageSelf .messageUserBlock div.avatarHolder,
    .Responsive .ctaConversationMessageOther .messageUserBlock div.avatarHolder
    {
        float: none;
    }

    .Responsive .ctaConversationMessageSelf .messageUserBlock h3.userText,
    .Responsive .ctaConversationMessageOther .messageUserBlock h3.userText
    {
        margin: 0;
        width: 52px;
        font-size: 80%;
    }

    .Responsive .ctaConversationMessageSelf .messageUserBlock .userTitle,
    .Responsive .ctaConversationMessageOther .messageUserBlock .userTitle,
    .Responsive .ctaConversationMessageSelf .messageUserBlock .userBanner,
    .Responsive .ctaConversationMessageOther .messageUserBlock .userBanner
    {
        display: none;
    }

    .Responsive .ctaConversationMessageSelf.message .messageInfo
    {
        margin-right: 66px;
        padding-right: 8px;
    }

    .Responsive .ctaConversationMessageOther.message .messageInfo
    {
        margin-left: 66px;
        padding-left: 8px;
    }
}
</xen:if>
Автор
Next
Первый выпуск
Обновление
Оценка
0.00 звёзд 0 оценок

Другие ресурсы пользователя Next

  • Can Warn Staff
    Возможность предупреждать администраторов и модераторов
  • ACP Extended (ACPE)
    ACP Extended (ACPE)
    Дополнительные расширенные функции для админ панели XenForo
  • Similar threads
    Similar threads
    Отображение похожих тем при просмотре темы / при создании новой темы
  • Email subscription
    Email subscription
    Отправка по e-mail списка новых тем подписчикам за 24 часа
  • Thread Reply Banner
    Указание персонального блока над редактором с сообщением для каждой темы