Баннера проекта Brown Russia(до слива форума)

Добро пожаловать!

Зарегистрировавшись у нас, вы сможете обсуждать, делиться и отправлять личные сообщения другим участникам нашего сообщества.

Зарегистрироваться!
Заблокированный
Регистрация
26 Окт 2024
Сообщения
1,285
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
Приветствую, сегодня я вам солью код баннеров форума Brown Russia , конечно у них сейчас не такие , но все же они у них были. Заранее скажу код чуть чуть переделан , потому что , я сам раньше по нему делал баннера.
Сначало заходим в панель управления--поиск--extra.Less
Водим туда вот этот код
.userBanner {
color: #fff;
text-transform: uppercase;
font-weight: 6000;
font-size: 72%; // размер шрифта
padding: 4px 6px;
background-size: 650% 650%;
border-radius: 7px;
animation: AnimBanner 9s ease infinite;
&.userBaner--staff {
color: #fff;
border: none;
background: linear-gradient(290beg, #ff2424, #ffb224, #81ff24, #24ffd2, #2443ff, #d924ff, #ff243c);
background-size: 900% 900%;
border-radius: 7px;
}
&.admin {
background-image: black;
font-size: 72%; // размер шрифта
padding: 4px 6px;
border-radius: 7px;
}
&.purple {
background-image: linear-gradient(270deg, #85099b, #a904f0);
border-radius: 7px;
}
&.green {
background: linear-gradient(200deg, #0de2a6, #19e13d, #1ef845);
border-radius: 7px;
}
}

@keyframes AnimBanner {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
Баннера вы можете настроить под себя измененив вот эти пункты.
Picsart_24-12-26_21-33-36-667.jpg
Это ещё не все , но для начала нам надо разобраться , что , куда , и как.
Для начала чтобы нам менять цвета баннера , нужно найти
&.'Ваше название' {
background-image: linear-gradient(270deg, #878a88, #7b73a5, #648981);
Ну если вы не глупые то поймете , что надо менять background-image.
После того как мы сделали свои коды , но вы скажите нету иконок перед текстом.
Теперь вводим это;
.userBanner.'Ваше название' .userBanner-before:before {
content: '';
display: inline-flex;
width: 12px;
height: 12px;
background: url(ваша ссылка) no-repeat center / 18px, linear-gradient(to top, rgba(0, 0, 0, 0.8) 10%, rgba(0, 0, 0, 0.2) 100%);
filter: opacity(100%);
padding: 2px;
border-radius: 7px;
margin-right: 3%;
}
Теперь объясню , чтобы мне нечего не предъявляли, чтобы всё работало, вы к примеру делаете баннер "Основатель" Вы пишете в этот пункт
osnov(к примеру)
Picsart_24-12-26_21-31-10-821.jpg
Так же пишет это и сюда
Picsart_24-12-26_21-29-42-807.jpg
Надеюсь хоть чем то помог , спасибо за внимание.
Так же забыл сказать в группе пользователя , вписываем код
userBanner "ваше название". Screenshot_20241226-213527.jpg
И получаем вот такой результат
Picsart_24-12-26_21-36-52-481.jpg
Картинку вы можете заменить на свою, да не шикарно, но для новичков сойдет.
 
Сверху