Баннера для форума как на Барвиха Mobile

['black 'primov]

Привет, сливаю для вас баннера проекта Барвиха Mobile.

Спойлер: Как установить баннер?:

Что бы установить баннера:

• Открыть панель управления на XenForo
• Вкладка "Внешний вид"
• Вкладка "Шаблоны"
• В поиске ищем "extrra.less"
• Заходим и вставляем (если у вас там что то есть - удаляете)

Спойлер: Код

.kk_banner {
object-fit: cover;
pointer-events: none
}

@media (max-width: 900px) {
.kk_banner {
height:150px
}
}

.userBanner,.userBanner.userBanner--staff {
display: inline-block;
min-height: 20px;
padding: 1px 7px;
border-radius: 14px;
border: none;
box-shadow: 0 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
margin: 4px 2px;
background-size: 200% 200%;
color: white;
font-size: 11px;
font-weight: 400;
text-align: center;
text-shadow: 0 0 0 transparent,1px 1px 1px #000;
-webkit-animation: AnimationBanner 5s ease infinite;
-moz-animation: AnimationBanner 5s ease infinite;
animation: AnimationBanner 5s ease infinite
}

.userBanner.special {
background-image: linear-gradient(130deg, #ff3535, #51055a);
width: 127px
}

.userBanner.ga {
background-image: linear-gradient(130deg, #ecff00, #f80000, #ff6b00)
}

.userBanner.zga {
background-image: linear-gradient(130deg, #ecff00, #f80000, #ff6b00)
}

.userBanner.stcurator {
background-image: linear-gradient(130deg, #0d8cc4, #970d3c)
}

.userBanner.curator {
background-image: linear-gradient(130deg, #b55acc, #7759cb, #b55acc)
}

.userBanner.admin {
background-image: linear-gradient(130deg, #0c7708, #5ebe83, #22d312)
}

.userBanner.discord_maker {
background-image: linear-gradient(130deg, #0053ff, #00589e, #ff00a4)
}

.userBanner.tester {
background-image: linear-gradient(130deg, #c8e067, #67e0cb)
}

.userBanner.leader {
background-image: linear-gradient(130deg, #3b45f4, #6fcbfc)
}

.userBanner.player {
background-image: linear-gradient(130deg, #00e4ff, #4f61fc, #9e00f8)
}

.userBanner.player_two {
background-image: linear-gradient(130deg, #00e4ff, #4f61fc, #9e00f8)
}

.userBanner.player_three {
background-image: linear-gradient(130deg, #00e4ff, #4f61fc, #9e00f8)
}

.userBanner.player_four {
background-image: linear-gradient(130deg, #00e4ff, #4f61fc, #9e00f8)
}

.userBanner.player_five {
background-image: linear-gradient(130deg, #00e4ff, #4f61fc, #9e00f8)
}

.userBanner.player_six {
background-image: linear-gradient(130deg, #00e4ff, #4f61fc, #9e00f8)
}

.userBanner.player_seven {
background-image: linear-gradient(130deg, #00e4ff, #4f61fc, #9e00f8)
}

.userBanner.player_eight {
background-image: linear-gradient(130deg, #00e4ff, #4f61fc, #9e00f8)
}

.userBanner.player_nine {
background-image: linear-gradient(130deg, #00e4ff, #4f61fc, #9e00f8)
}

.userBanner.discord_leader {
background-image: linear-gradient(130deg, #f78b0b, #e10d63, #3d159f)
}

.userBanner.banned {
background-color: #c0c0c0;
color: black;
text-shadow: none;
font-weight: bold
}

.userBanner.userBanner--staff {
background-image: linear-gradient(90deg, #0717ed, #ef2525)
}

@-webkit-keyframes AnimationBanner {
0% {
background-position: 10% 0%
}

50% {
background-position: 91% 100%
}

100% {
background-position: 10% 0%
}
}

@-moz-keyframes AnimationBanner {
0% {
background-position: 10% 0%
}

50% {
background-position: 91% 100%
}

100% {
background-position: 10% 0%
}
}

@keyframes AnimationBanner {
0% {
background-position: 10% 0%
}

50% {
background-position: 91% 100%
}

100% {
background-position: 10% 0%
}
}

@keyframes Halloween {
0% {
background-position: 0% 0%
}

100% {
background-position: 100% 100%
}
}