Современный облачный хостинг провайдер | Aéza
Контакты ООО "АЕЗА ГРУПП" ИНН 2312304914 ОГРН 1212300056430
Большие аватары в темах форума

Большие аватары в темах форума

Обзор FAQ Отзывы (4) Обсуждение
Hope написал(а):
ImageMagick на сервере установлен у Вас? Та и думаю, что Вы при изменении кода где-то косякнули...
Нажмите для раскрытия...
Установлен, да и при обычных значениях аватара всё ровно.

Значения message_user_info.css.


Код: 
.messageUserInfo
{
    @property "messageUserInfo";
    background-color: rgb(246, 246, 246);
    padding: 9px;
    border: 1px solid rgb(228, 228, 228);
    border-radius: 6px;
    float: left;
    position: relative;
    width: 126px;
    @property "/messageUserInfo";
}

.avatar img {
width: 110px;
height: 110px;
}

.avatarCropper img {
width: auto;
height: auto;
}
    .messageRight .messageUserInfo
    {
        float: right;
    }

    .messageUserInfo:after
    {
        content: '';
        display: block;
        position: absolute;
        top: 15px;
        right: -10px;
        width: 11px;
        height: 17px;
        background: transparent url('@imagePath/xenforo/xenforo-ui-sprite.png') no-repeat -140px -55px;
    }
   
        .messageRight .messageUserInfo:after
        {
            right: auto;
            left: -10px;
            background-position: -120px -55px;
        }
       
    .messageFullBlock .messageUserInfo
    {
        @property "css3ClearBlock";
        background: transparent none;
        padding: 0;
        margin: 0;
        border-width: 0;
        border-radius: 0;
        box-shadow: none !important;
        @property "/css3ClearBlock";
    }
   
        .messageFullBlock .messageUserInfo:after
        {
            display: none;
        }

    .messageUserBlock
    {
        @property "messageUserBlock";

        @property "/messageUserBlock";
       
        position: relative;
    }
       
        .messageUserBlock div.avatarHolder
        {
            @property "messageAvatarHolder";
            background-color: whitesmoke;
            border-radius: 4px;
            @property "/messageAvatarHolder";   
        }
       
            .messageUserBlock div.avatarHolder .avatar
            {
                display: block;
                font-size: 0;
            }
           
        .messageUserBlock h3.userText
        {
            @property "messageUserText";
            padding: 6px 0 0;
            @property "/messageUserText";
        }
       
        .messageUserBlock .userBanner
        {
            display: block;
            margin-top: 1px;
            margin-bottom: 5px;
            margin-left: -14px;
            margin-right: -14px;
        }

            .messageFullBlock .messageUserBlock .userBanner
            {
                margin-right: -5px;
                border-top-right-radius: 3px;
            }

                .messageFullBlock .messageUserBlock .userBanner.wrapped span.after,
                .messageFullBlock.messageRight .messageUserBlock .userBanner.wrapped span.before
                {
                    display: none;
                }

                .messageFullBlock.messageRight .messageUserBlock .userBanner
                {
                    margin-left: -5px;
                    margin-right: -14px;
                    border-top-left-radius: 3px;
                }

                    .messageFullBlock.messageRight .messageUserBlock .userBanner.wrapped
                    {
                        border-top-right-radius: 0;
                    }

                    .messageFullBlock.messageRight .messageUserBlock .userBanner.wrapped span.after
                    {
                        display: block;
                    }


        .messageUserBlock .userBanner:last-child
        {
            margin-bottom: 0;
        }
   
        .messageUserBlock a.username
        {
            @property "messageUsername";
            font-weight: bold;
            display: block;
            overflow: hidden;
            line-height: 16px;
            @property "/messageUsername";
           
        }
       
        .messageUserBlock .userTitle
        {
            @property "messageUserTitle";
            font-size: 11px;
            display: block;
            @property "/messageUserTitle";
        }
       
        .messageUserBlock .extraUserInfo
        {
            @property "messageExtraUserInfo";
            font-size: 11px;
            padding: 4px 0;
            border-width: 0;
            @property "/messageExtraUserInfo";
        }
       
            .messageUserBlock .extraUserInfo dl
            {
                margin: 2px 0 0;
            }
                           
            .messageUserBlock .extraUserInfo img
            {
                max-width: 100%;
            }
       
        .messageUserBlock .arrow
        {
            display: none;
        }

<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveWideWidth)
{
    .Responsive .message.messageSeparate
    {
        margin-bottom: 15px;
    }
   
   
       
            .Responsive .message.messageFullBlock .messageUserInfo:after
            {
                display: none;
            }
       
        .Responsive .message .messageUserInfo
        {
            margin-bottom: 8px;
        }
       
            .Responsive .message.messageFullBlock .messageUserInfo
            {
                margin-bottom: 0;
                padding-bottom: 5px;
                border-bottom: 1px solid @innerBottomBorder;
            }
       
        .Responsive .message .messageUserInfo .messageUserBlock:after
        {
            content: '';
            display: block;
            clear: both;
        }
       
        .Responsive .message .messageUserBlock div.avatarHolder
        {
            float: left;
            margin-right: 10px;
        }
       
            .Responsive .message .messageUserBlock div.avatarHolder img
            {
                width: 48px;
                height: 48px;
            }
       
                .Responsive .message .messageUserBlock div.avatarHolder .userMood img
                {
                    width: auto;
                    height: auto;
                }

        .Responsive .message .messageUserBlock h3.userText
        {
            padding-top: 0;
            float: left;
        }

        .Responsive .message .messageUserBlock .ribbon
        {
            display: none;
        }

    .Responsive .message .messageInfo
    {
        margin: 0 !important;
        float: none;
    }
   
        .Responsive .message.messageFullBlock .messageInfo
        {
            border-top: 1px solid @innerTopBorder;
            padding-top: 5px;
        }

    <xen:if is="@mobileHideExtraUserInfo">       
    .Responsive .messageUserBlock .extraUserInfo
    {
        display: none;
    }
    <xen:else />
    .Responsive .messageUserBlock .extraUserInfo
    {
        float: right;
        max-width: 40%;
    }

        .Responsive .messageUserBlock .extraUserInfo dl
        {
            min-width: 100px;
        }

        .Responsive .messageUserBlock .extraUserInfo dt
        {
            display: inline !important;
        }

        .Responsive .messageUserBlock .extraUserInfo dd
        {
            float: none;
        }
    </xen:if>

    .Responsive .messageUserBlock .userBanner
    {
       
        margin: 0 !important;
        border-radius: 3px !important;
        position: static;
        display: inline-block;
    }
   
        .Responsive .messageUserBlock .userBanner span
        {
            display: none !important;
        }
}
</xen:if>


Пример. Предпросмотр профиля - всё без искажений и чётко.
А на аватаре при этом с искажениями.
897.jpeg
 
Почему-то не нахожу строку <xen:avatar user="$user" size="l" img="true" /> в Вашем коде. Сделайте всё чётко по инструкции.

Поменяйте просто цифровые значения из инструкции на свои, а всё остальное сделайте точно по мануалу.
 
Hope написал(а):
Почему-то не нахожу строку <xen:avatar user="$user" size="l" img="true" /> в Вашем коде. Сделайте всё чётко по инструкции.

Поменяйте просто цифровые значения из инструкции на свои, а всё остальное сделайте точно по мануалу.
Нажмите для раскрытия...
По инструкции высота аватарки авто, а мне нужно что бы было одинаковое маштабирование - высота, ширина как в дефолтных настройках.
В том и прикол.
 
Ну тогда я и не знаю даже. :(
 
Ну может он и додумает ещё. :)
 
Парни подскажите где искать решение, после того как удачно увеличили блок контейнера с инфой и аватар пользователя, для планшетов и мобильных устройств вообще пропало отображения блока и аватара.

Скрин.
 
Последнее редактирование модератором:
Все изображения конечно же загружаются только к нам на сервер.
А пропало всё наверное потому что скорее всего Вы не подогнали всё это дело под адаптивный дизайн... Как это сделать - я без понятия. :)
 
Hope написал(а):
ImageMagick на сервере установлен у Вас? Та и думаю, что Вы при изменении кода где-то косякнули...
Нажмите для раскрытия...
Большое спасибо за ответ. Прошу извинить за оплошность.

d60a7c46cfa8.jpg
 
Последнее редактирование:
Сколько я помню по смайлам, у вас там в шаблонах совсем неразбериха, код шаблонов не соответствует стандартному, так что причина может быть и в другом.
 
Mirovinger написал(а):
Сколько я помню по смайлам, у вас там в шаблонах совсем неразбериха, код шаблонов не соответствует стандартному, так что причина может быть и в другом.
Нажмите для раскрытия...
Спасибо, видел смотрели и всё вернули)) В любом случае спасибо).

Mirovinger написал(а):
Сколько я помню по смайлам, у вас там в шаблонах совсем неразбериха, код шаблонов не соответствует стандартному, так что причина может быть и в другом.
Нажмите для раскрытия...
У вас получилось! ВЫ МАСТЕР!)))
 
Глянул.
Можно и фиксануть, но тогда поведение на остальных девайсах, с другим разрешением не предсказуемо.
Код: 
    .Responsive .message .messageInfo
    {
        margin: 0 !important;
        /*margin: 0px 0px 0px 26% !important;*//*Можно и фиксануть, но тогда поведение на остальных девайсах, с другим разрешением не предсказуемо */
        float: none;
    }
 
Mirovinger написал(а):
Глянул.
Можно и фиксануть, но тогда поведение на остальных девайсах, с другим разрешением не предсказуемо.
Код: 
    .Responsive .message .messageInfo
    {
        margin: 0 !important;
        /*margin: 0px 0px 0px 26% !important;*//*Можно и фиксануть, но тогда поведение на остальных девайсах, с другим разрешением не предсказуемо */
        float: none;
    }
Нажмите для раскрытия...
Смотрю все вернулось. Т.е если я в ЭКСТРА это впишу станет как было 5 минут назад ?
 
Это я вернул, просмотрев отображение на других разрешениях, более мелких девайсов.
Если вас устроит так, то я верну.
 
Mirovinger написал(а):
Это я вернул, просмотрев отображение на других разрешениях, более мелких девайсов.
Если вас устроит так, то я верну.
Нажмите для раскрытия...
И как отобразилось на более мелких девайсах ?
Сорри за туфталогию, просто мне показалось у вас всё получилось!
Да конечно устроит! Всё же лучше чем не отображение а то юзеры жалуются))
Такой же косяк со сьездом аватарок в ЛС)
 
PaulZibert написал(а):
И как отобразилось на более мелких девайсах ?
Нажмите для раскрытия...
Уже нормально, на сколько можно, внёс в EXTRA.css, такой код.
Код: 
@media (max-width:480px) {
.message .messageUserInfo {
    float: initial;
    width: auto;
    margin: 2px 0 0 !important;
    }
}
responsive_mob.png
PaulZibert написал(а):
Да конечно устроит! Всё же лучше чем не отображение а то юзеры жалуются))
Нажмите для раскрытия...
responsive_plan.png
 
Mirovinger написал(а):
Уже нормально, на сколько можно, внёс в EXTRA.css, такой код.
Код: 
@media (max-width:480px) {
.message .messageUserInfo {
    float: initial;
    width: auto;
    margin: 2px 0 0 !important;
    }
}
Посмотреть вложение 20488

Посмотреть вложение 20489
Нажмите для раскрытия...
Ляпота!!!!

Не подскажите где искать ? На форуме всё идеально, а в ЛС аватарки съехали вправо.

11.jpg
 
Убираем, у вас всё равно, не по стандарту сделано.
Код: 
.thread_view .messageList a.avatar img,
.thread_view .quickReply a.avatar img,
.conversation_view .messageList a.avatar img,
.conversation_view .quickReply a.avatar img
{
    width: 130px;
    height: 130px;
}
Уже закомментил.
 
  • Мне нравится
Реакции: Hope
все сделал вышло так мне нужно меньше но как сделать так
 
Последнее редактирование модератором:
Все изображения загружаются только на наш сервер!
 
Войдите или зарегистрируйтесь для ответа.
Современный облачный хостинг провайдер | Aéza
Контакты
ООО "АЕЗА ГРУПП" ИНН 2312304914 ОГРН 1212300056430 г. Краснодар, ул. Маяковского 160, офис 2.4

Похожие темы

Estomel
Большие (Прямоугольные) аватары в темах
Ответы
4
Просмотры
1K
West14
West14
Hope
Большие аватары в темах форума для XenForo 2
2
Ответы
31
Просмотры
4K
IlyaPep
IlyaPep
Михаил Ранго
Заменяем ники на аватары в виджете Пользователи онлайн XF2.x
Ответы
2
Просмотры
1K
Skaiman
Skaiman
Обжигающий Иней
  • Закрыта
  • Вопрос
Размер аватара
Ответы
2
Просмотры
1K
Обжигающий Иней
Обжигающий Иней
SamuraiGx90
  • Вопрос
Анимация в темах при увеличенном аватаре
Ответы
11
Просмотры
808
SamuraiGx90
SamuraiGx90
Назад
Сверху Снизу