[SVG] User Icon 2.2.8.1

[Matew]

 

[gleboff78]

Добрый вечер! Выставил переливающий ник, при этом ник переливается, а сама иконка нет

пример форума как должно быть при анимации (здесь иконка вместе с ником переливается)

Как получается у меня (здесь тупо сплошной синий цвет картинки)

Как настроить подскажите

 

[Skaiman]

Добрый вечер! Выставил переливающий ник, при этом ник переливается, а сама иконка нет

Какой код использовал для ника?

 

[Skaiman]

Короче так, если использован градиентный ник Градиентный ник пользователя, то надо в настройках группы, где указано, например:

background-image: linear-gradient(to right, #b31d3f 0%, #f27a8a 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: #ff0000;

продублировать код для иконки и в общем сделать так:

background-image: linear-gradient(to right, #b31d3f 0%, #f27a8a 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: #ff0000;
i:before {
    background-image: linear-gradient(to right, #b31d3f 0%, #f27a8a 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #ff0000;   
}

для градиентного ника с анимацией, Анимируем градиентный ник, в принципе тоже самое, было:

background: linear-gradient(270deg, #01bf3b, #1000f2, #ff00ea);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 900% 20%;
color: #1000f2;
animation: AnimNic 10s ease infinite;

делаем:

background: linear-gradient(270deg, #01bf3b, #1000f2, #ff00ea);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 900% 20%;
color: #1000f2;
animation: AnimNic 10s ease infinite;
i:before {
    background: linear-gradient(270deg, #01bf3b, #1000f2, #ff00ea);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 900% 20%;
    color: #1000f2;
    animation: AnimNic 10s ease infinite;   
}

 

[pandolfomercer]

Какой код использовал для ника?

Он и я, мы используем

CSS-стиль :

background: linear-gradient(270deg, #f00, #ff0, #0f0, #0ff, #800080);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 900% 20%;
color: #1000f2;
animation: AnimNic 10s ease infinite;

less:

@keyframes AnimNic {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

И вот нужно с этим градиентом, эконки fast awesome двигаться
Нужно как тут:

Спойлер

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

 

[Skaiman]

pandolfomercer, выше ответ

 

[pandolfomercer]

Skaiman я проверил, все равно также осталось

Спойлер

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

 

[Skaiman]

pandolfomercer, ну так то прежде чем написать, я тоже проверил и все нормально

 

[Skaiman]

могу по месту глянуть

 

[pandolfomercer]

Skaiman в спойлере прикрепил ссылку на форум профиля

Skaiman я проверил, все равно также осталось

Спойлер

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

 

[Skaiman]

pandolfomercer, при чем форум на котором работает, там может не использует этот плагин или не используется иконка fonts awesome, мне надо посмотреть проблему именно там, где она есть.

 

[pandolfomercer]

Skaiman так вот я тебе и скидываю тут не работает эта иконка

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

А тут работает как нужно

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

 

[Skaiman]

pandolfomercer, в поле иконка укажи <i class="ri-user-star-line"></i>, а в поле CSS-стиль можно убрать

i:before {
    background: linear-gradient(270deg, #01bf3b, #1000f2, #ff00ea);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 900% 20%;
    color: #1000f2;
    animation: AnimNic 10s ease infinite;   
}

 

[pandolfomercer]

pandolfomercer, в поле иконка укажи <i class="ri-user-star-line"></i>, а в поле

OFFTOP

не дописал?

 

[Skaiman]

pandolfomercer, у тебя просто другая иконка использовалась, Iconify, она в svg, поэтому не применялся стиль, та же проблема и font awesome, для них я указал выше решение. На форуме, который для примера, использована иконка Remix Icon, с ней вообще ни каких проблем, без лишних манипуляций.

 

[pandolfomercer]

Skaiman прошу прощения, хочу вот эту иконку

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

Но когда копирую данный текст <i class="fa-brands fa-connectdevelop"></i>
Получается пустой квадратик

 

[Skaiman]

ты жмякаешь иконки версии шрифта 6.1, они не используются в xenforo 2.2.8, ищи так

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

 

[Skaiman]

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

<i class="fab fa-connectdevelop"></i>

 

[Tommi365]

Совместимости с php8 не сделана?

 

[Skaiman]

Совместимости с php8 не сделана?

А она есть? Так то по логике, если возник такой вопрос, а обновлений не было, то какой можно сделать вывод?