XF 2.2 Проблема с анимированным градиентным ником

[Markelov_Leon]

Есть проблема - под ником создается как я понимаю дополнительные символы, а градиент накладывается. И вот вопрос, как удалить этот доп слой чтоб градиент нормально отображался?

 

[KRAVCHUK]

на этом форуме не раз уже задавался этот вопрос, что то в поиске да должно выдать по запросу "градиентный ник"

 

[KRAVCHUK]

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

 

[Markelov_Leon]

А не подскажете куда этот код вставлять и нужно ли в нем что то менять(Если да, то что и на то)

.username--style8 {
    background: -webkit-linear-gradient(90deg, #0095dd 0%, #f1094b 100%, #0095dd);
    background: linear-gradient(90deg, #04adff 0%, #ff0049 100%, #0095dd);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.memberHeader--withBanner,
.memberTooltip--withBanner {
    .username--style8 {
        &.is-stroked {
            &:before {
                color: transparent;
                -webkit-text-stroke: 2px transparent;
            }
            & span {
                position: unset;
                text-shadow: 0 0 20px black;
            }
        }
    }
}

 

[dimka1510]

Asp1d, на последних версиях движка нет div'а .is-stoked

 

[dimka1510]

Markelov_Leon, на последней версии движка это не прокатывает.

на последних версиях движка нет div'а .is-stoked

Можно модификациями вырезать кусок кода, отвечающий за эту фигню

Модификации вручную, если не установлен [MMO] Export/Import TMS.

Шаблон: member.less
Ключ модификации: gradientNickStrokeProfileFix (или как удобно)
Тип поиска: Простая замена
Найти:

// See XF-197998
@_member-textStroke: 0 #000;

.member-textStroke()
{
    text-shadow:
        -1px -1px @_member-textStroke,
        1px -1px @_member-textStroke,
        -1px 1px @_member-textStroke,
        1px 1px @_member-textStroke;
}

.memberHeader--withBanner
{
    .username
    {
        .member-textStroke();
    }

    .memberHeader-nameChangeIndicator .fa-history
    {
        .member-textStroke();
    }
}

Заменить: оставить пустым

Шаблон: member_tooltip.less
Ключ модификации: gradientNickStrokeTooltipFix (или как удобно)
Тип поиска: Простая замена
Найти:

// See XF-197998
@_memberTooltip-textStroke: 0 #000;

.memberTooltip-textStroke()
{
    text-shadow:
        -1px -1px @_memberTooltip-textStroke,
        1px -1px @_memberTooltip-textStroke,
        -1px 1px @_memberTooltip-textStroke,
        1px 1px @_memberTooltip-textStroke;
}

.memberTooltip--withBanner
{
    .memberTooltip-nameWrapper
    {
        .username:hover
        {
            text-decoration: none;
        }
    }

    .username
    {
        .memberTooltip-textStroke();
    }

    .memberTooltip-nameChangeIndicator .fa-history
    {
        .memberTooltip-textStroke();
    }
}

Заменить: оставить пустым

Либо импортировать модификации из прикреплённого архива через [MMO] Export/Import TMS.

 

[Markelov_Leon]

Не помогло к сожалению.

 

[dimka1510]

Markelov_Leon, что именно не помогло?

 

[Markelov_Leon]

Markelov_Leon, что именно не помогло?

Создание модифицированных шаблонов

 

[dimka1510]

Markelov_Leon, модификации шаблонов создаются в /admin.php?template-modifications/&type=public
И прекрасно применяются.

НЕ НУЖНО НИЧЕГО РЕДАКТИРОВАТЬ НАПРЯМУЮ В ШАБЛОНАХ!

Можно импортировать модификации из прикреплённого архива через [MMO] Export/Import TMS или воспользоваться ручными способами №1 или №2.

 

[Markelov_Leon]

Все заработало.
Не тот шаблон модифицировал)
Спасибо

 

[Atikin]

Я, конечно, не верстальщик, но зачем что-то выпиливать из стандартных шаблонов? Чем плох такой вариант?

.memberTooltip--withBanner
{
    .username
    {
        .username--style5
        {
            text-shadow: none;
        }
    }
}

 

[dimka1510]

Atikin, тогда можно вообще в стиле градиента дописать text-shadow: none; чтобы привести код к виду

background: -webkit-linear-gradient(90deg, #0095dd 0%, #f1094b 100%, #0095dd);
background: linear-gradient(90deg, #04adff 0%, #ff0049 100%, #0095dd);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-shadow: none;

И чёрная тень будет убираться только у конкретных градиентов (если они стоят например у отдельных юзеров через extra.less или через плагины типа DragonByte Shop). Да и вырезание из шаблонов с помощью модификаций нигде ничего не ломает (во всяком случае у меня и на используемом мной стиле).