Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!

новый баннер crmp online

кккыфв

кккыфв

Ноя
26
3
Пользователь
3.2. Код больше 10 строк необходимо брать еще и под спойлер.
сегодня заметил краску, протестил - все окей, кому нужно пользуйтесь.​

CSS: 
.userBanner.wag {
    background: linear-gradient(45deg, #f00, #c00, #f00, #c00) !important;
    background-size: 400% 400% !important;
    animation: wagnerShimmer 3s ease-in-out infinite !important;
    color: white !important;
    text-align: center !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
    padding: 4px 10px !important;
    border: none !important;
    position: relative !important;
    overflow: visible !important;
    box-shadow: 0 2px 8px rgba(255,0,0,0.3) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 2px 4px !important;
    text-shadow: 0 0 10px rgba(255,0,0,0.7) !important;
    letter-spacing: 1px !important;
    min-height: 22px !important;
    max-height: 24px !important;
    line-height: 1.3 !important
}

@keyframes wagnerShimmer {
    .userBanner 0% {
        background-position: 0% 50%
    }

    .userBanner 50% {
        background-position: 100% 50%
    }

    .userBanner 100% {
        background-position: 0% 50%
    }
}

.userBanner.wag::after {
    content: '';
    background-image: url('[URL]https://steamuserimages-a.akamaihd.net/ugc/2017102299334556140/2850FEB3E6AA7B24685305EC7610E5BCC874983F/?imw=512&imh=619&ima=fit&impolicy=Letterbox&imcolor=%23000000&letterbox=true');[/URL]
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 20px;
    height: 20px;
    display: inline-block;
    margin-left: 8px;
    vertical-align: middle;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 0 12px rgba(255,255,255,0.8),0 0 18px rgba(255,0,0,0.6),0 3px 6px rgba(0,0,0,0.3);
    animation: wagnerPhoto 3s ease-in-out infinite;
    flex-shrink: 0 !important;
    align-self: center !important;
    filter: brightness(1.15) contrast(1.08) saturate(1.2)
}

@keyframes wagnerPhoto {
    .userBanner 0%,.userBanner 100% {
        transform: scale(1) rotate(0deg);
        box-shadow: 0 0 12px rgba(255,255,255,0.8),0 0 18px rgba(255,0,0,0.6),0 3px 6px rgba(0,0,0,0.3)
    }

    .userBanner 50% {
        transform: scale(1.12) rotate(6deg);
        box-shadow: 0 0 18px rgba(255,255,255,0.9),0 0 25px rgba(255,0,0,0.7),0 4px 8px rgba(0,0,0,0.4)
    }
}

.userBanner.wag:hover {
    animation: wagnerPulse .5s ease-in-out !important;
    transform: scale(1.04) !important
}

.userBanner.wag:hover::after {
    transform: scale(1.15) !important;
    box-shadow: 0 0 18px rgba(255,255,255,0.9),0 0 25px rgba(255,0,0,0.7),0 4px 8px rgba(0,0,0,0.4)
}

@keyframes wagnerPulse {
    .userBanner 0% {
        transform: scale(1)
    }

    .userBanner 50% {
        transform: scale(1.06)
    }

    .userBanner 100% {
        transform: scale(1.04)
    }
}

@media (max-width: 768px) {
    .userBanner.wag {
        font-size:13px !important;
        padding: 3px 8px !important;
        min-height: 20px !important;
        max-height: 22px !important
    }

    .userBanner.wag::after {
        width: 18px;
        height: 18px;
        margin-left: 6px;
        border-width: 2px
    }
}

--dark .userBanner.wag {
    box-shadow: 0 2px 8px rgba(255,0,0,0.4) !important
}

.userList .userBanner.wag {
    margin: 2px 0 !important
}

.profilePage .userBanner.wag {
    font-size: 14px !important;
    padding: 4px 10px !important;
    margin: 4px 0 !important
}

.userBanner.wag * {
    color: #ffffff !important
}

.userBanner.wag .avatar,.userBanner.wag .userAvatar {
    box-shadow: 0 0 8px rgba(255,0,0,0.5) !important;
    border: 2px solid #f00 !important;
    box-shadow: 0 0 6px rgba(255,0,0,0.4) !important;
    border: 1px solid #f00 !important;
    box-shadow: 0 0 4px rgba(255,0,0,0.3) !important
}
1756625037711.png
 
Последнее редактирование модератором:
D

denden

Авг
4
0
Заблокированный
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
В чем смысл от него?
кккыфв написал(а):
сегодня заметил краску, протестил - все окей, кому нужно пользуйтесь.​

OFFTOP


.userBanner.vilonov {
background: linear-gradient(45deg, #f00, #c00, #f00, #c00) !important;
background-size: 400% 400% !important;
animation: wagnerShimmer 3s ease-in-out infinite !important;
color: white !important;
text-align: center !important;
font-size: 13px !important;
font-weight: 500 !important;
border-radius: 8px !important;
padding: 3px 8px !important;
border: none !important;
position: relative !important;
overflow: visible !important;
box-shadow: 0 2px 6px rgba(255,0,0,0.3) !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
margin: 2px 3px !important;
text-shadow: 0 0 8px rgba(255,0,0,0.7) !important;
letter-spacing: 0.8px !important;
min-height: 20px !important;
max-height: 22px !important;
line-height: 1.2 !important
}

@keyframes vilonovShimmer {
.userBanner 0% {
background-position: 0% 50%
}

.userBanner 50% {
background-position: 100% 50%
}

.userBanner 100% {
background-position: 0% 50%
}
}

.userBanner.vilonov::after {
content: '';
background-image: url('https://i.postimg.cc/Ls0JKyz5/f9fd7818a6e3e4868d76460afb5e239e.jpg/?imw=512&imh=619&ima=fit&impolicy=Letterbox&imcolor=#000000&letterbox=true');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
width: 18px;
height: 18px;
display: inline-block;
margin-left: 6px;
vertical-align: middle;
border-radius: 50%;
border: 2px solid #fff;
box-shadow: 0 0 10px rgba(255,255,255,0.7),0 0 15px rgba(255,0,0,0.5),0 2px 4px rgba(0,0,0,0.3);
animation: wagnerPhoto 3s ease-in-out infinite;
flex-shrink: 0 !important;
align-self: center !important;
filter: brightness(1.1) contrast(1.05) saturate(1.15)
}




Посмотреть вложение 12193
Нажмите для раскрытия...
 
D

denden

Авг
4
0
Заблокированный
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
К тому же он весь баганный
 
кккыфв

кккыфв

Ноя
26
3
Пользователь
если кому то нужен - возьмут и я багов не заметил , скинь скрин
 
D

denden

Авг
4
0
Заблокированный
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
Посмотри повнимательнее он стоит ниже чем остальные роли
 
P

Platonchik Pluxury

Окт
380
676
Заблокированный
2.2. Запрещено публиковать сообщения, разжигающие конфликты.
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
и че за хуйня эт
 
JustAlex

JustAlex

Лучше плохо начать, чем хорошо бездействовать
Ноя
2,152
1,398
Профессионал
denden написал(а):
К тому же он весь баганный
Нажмите для раскрытия...
Где.. нормально работает
denden написал(а):
Посмотри повнимательнее он стоит ниже чем остальные роли
Нажмите для раскрытия...
Потому что из-за аватарки его ширина больше и он отличается. Только в этом разница и всё
 
AuraDev

AuraDev

Фев
458
106
Пользователь
ну смотри я просто скопировал весь код вставил его в extra.less и css указал wag все
 
Войдите или зарегистрируйтесь для ответа.
Сверху