- Сен
- 216
- 211
Пользователь
By registering with us, you'll be able to discuss, share and private message with other members of our community.
SignUp Now!.rainbow-prefix {
display: inline-block;
padding: 3px 12px;
font-weight: bold;
border-radius: 12px;
position: relative;
z-index: 0;
background: #1f1f1f;
background-image: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3);
background-size: 1800% 1800%;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
animation: rainbowText 6s ease infinite
}
.rainbow-prefix::before {
content: "";
position: absolute;
inset: 0;
padding: 2px;
border-radius: 12px;
background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3);
background-size...
.userBanner {
color: #fff;
text-transform: uppercase;
font-weight: 700;
font-size: 60%;
padding: 6px 12px;
background-size: 400% 400% !important;
animation: AnimBanner 10s ease infinite !important;
position: relative;
display: inline-flex;
align-items: center;
border-radius: 50px;
margin: 2px;
text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
box-shadow: 0 2px 8px rgba(0,0,0,0.2);
max-width: 200px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
transition: all .3s ease
}
.userBanner.userBanner--staff {
color: white;
background: linear-gradient(80deg, #f00, #ff8000, #ff0, #0f0, #0ff, #00f, #f0f);
font-size: 60%;
border-radius: 50px;
text-align: center;
padding: 6px 12px 3px;
font-style: normal;
border: none
}
.userBanner.cosmic {
background: linear-gradient(270deg, #667eea, #764ba2, #f093fb, #f5576c);
border: 1px solid rgba(255,255,255,0.3);
animation: AnimBanner 6s ease infinite,glowPulse 3s ease-in-out infinite !important
}
.userBanner.nebula {
background: linear-gradient(270deg, #ff6b6b, #ffa726, #66bb6a, #42a5f5, #ab47bc);
animation: AnimBanner 7s ease infinite,glowPulse 3.5s ease-in-out infinite !important
}
.userBanner.galaxy {
background: linear-gradient(270deg, #000428, #004e92, #2c3e50, #3498db);
animation: AnimBanner 9s ease infinite,glowPulse 4s ease-in-out infinite !important
}
.userBanner.quantum {
background: linear-gradient(270deg, #00b4db, #0083b0, #00f5a0, #00d9f5);
animation: AnimBanner 5s ease infinite,glowPulse 2.5s ease-in-out infinite !important
}
.userBanner.cyber {
background: linear-gradient(270deg, #ff0084, #33001b, #ff0084);
border: 1px solid #ff0084;
animation: AnimBanner 4s ease infinite,glowPulse 2s ease-in-out infinite !important
}
.userBanner.neon {
background: linear-gradient(270deg, #00ff87, #60efff, #0061ff);
color: #000;
text-shadow: none;
animation: AnimBanner 6s ease infinite,glowPulse 3s ease-in-out infinite !important
}
.userBanner.hologram {
background: linear-gradient(270deg, #ff75c3, #ffa647, #ffe83f, #9fff5b, #70e2ff, #cd93ff);
animation: AnimBanner 10s ease infinite,glowPulse 5s ease-in-out infinite !important
}
.userBanner.matrix {
background: linear-gradient(270deg, #0f0, #0c0, #090, #060);
color: #000;
animation: AnimBanner 5s ease infinite,matrixGlow 2s ease-in-out infinite !important
}
.userBanner.aurora {
background: linear-gradient(270deg, #ff7e5f, #feb47b, #86a8e7, #91eae4);
animation: AnimBanner 8s ease infinite,glowPulse 4s ease-in-out infinite !important
}
.userBanner.ocean {
background: linear-gradient(270deg, #2193b0, #6dd5ed, #6dd5fa, #2193b0);
animation: AnimBanner 7s ease infinite,glowPulse 3.5s ease-in-out infinite !important
}
.userBanner.forest {
background: linear-gradient(270deg, #56ab2f, #a8e6cf, #56ab2f, #2c7744);
animation: AnimBanner 9s ease infinite,glowPulse 4s ease-in-out infinite !important
}
.userBanner.sunset {
background: linear-gradient(270deg, #ff9a9e, #fad0c4, #fad0c4, #ff9a9e);
animation: AnimBanner 6s ease infinite,glowPulse 3s ease-in-out infinite !important
}
.userBanner.gold {
background: linear-gradient(270deg, #ffd700, #ffed4e, #ffd700, #daa520);
color: #000;
border: 1px solid #ffd700;
animation: AnimBanner 5s ease infinite,goldPulse 2s ease-in-out infinite !important
}
.userBanner.platinum {
background: linear-gradient(270deg, #e5e4e2, #b6b6b4, #e5e4e2, #8a8a88);
color: #000;
animation: AnimBanner 7s ease infinite,glowPulse 3s ease-in-out infinite !important
}
.userBanner.diamond {
background: linear-gradient(270deg, #b9f2ff, #e6f7ff, #b9f2ff, #89cff0);
color: #0066cc;
animation: AnimBanner 8s ease infinite,diamondShine 3s ease-in-out infinite !important
}
.userBanner.crystal {
background: linear-gradient(270deg, #ff6b6b, #ffa726, #66bb6a, #42a5f5);
animation: AnimBanner 9s ease infinite,glowPulse 4s ease-in-out infinite !important
}
.userBanner.epic {
background: linear-gradient(270deg, #8a2be2, #4b0082, #9400d3);
animation: AnimBanner 6s ease infinite,epicGlow 2.5s ease-in-out infinite !important
}
.userBanner.legendary {
background: linear-gradient(270deg, #ff8c00, #ff4500, #dc143c);
animation: AnimBanner 4s ease infinite,legendaryFire 2s ease-in-out infinite !important
}
.userBanner.mythic {
background: linear-gradient(270deg, #ff1493, #c71585, #8b008b);
animation: AnimBanner 7s ease infinite,mythicPulse 3s ease-in-out infinite !important
}
.userBanner.heroic {
background: linear-gradient(270deg, #1e90ff, #00bfff, #1e90ff);
animation: AnimBanner 8s ease infinite,heroicGlow 4s ease-in-out infinite !important
}
.userBanner.spring {
background: linear-gradient(270deg, #ff9a9e, #fad0c4, #fbc2eb, #a6c1ee);
animation: AnimBanner 10s ease infinite,glowPulse 5s ease-in-out infinite !important
}
.userBanner.summer {
background: linear-gradient(270deg, #ffecd2, #fcb69f, #ff9a8b);
color: #000;
animation: AnimBanner 7s ease infinite,summerGlow 3s ease-in-out infinite !important
}
.userBanner.autumn {
background: linear-gradient(270deg, #ff9a62, #ff6b6b, #c56c86);
animation: AnimBanner 8s ease infinite,autumnGlow 4s ease-in-out infinite !important
}
.userBanner.winter {
background: linear-gradient(270deg, #a1c4fd, #c2e9fb, #a1c4fd);
color: #2c3e50;
animation: AnimBanner 9s ease infinite,winterSparkle 5s ease-in-out infinite !important
}
.userBanner.creator {
background: linear-gradient(270deg, #f00, #ff8000, #ff0, #0f0, #0ff, #00f, #f0f);
border: 2px solid rgba(255,255,255,0.5);
font-size: 55%;
animation: AnimBanner 12s ease infinite,rainbowGlow 6s ease-in-out infinite !important
}
.userBanner.moderator {
background: linear-gradient(270deg, #4facfe, #00f2fe, #4facfe);
animation: AnimBanner 8s ease infinite,glowPulse 4s ease-in-out infinite !important
}
.userBanner.administrator {
background: linear-gradient(270deg, #f00, #ff6b6b, #f00);
border: 1px solid #f00;
animation: AnimBanner 5s ease infinite,adminPulse 2s ease-in-out infinite !important
}
.userBanner.developer {
background: linear-gradient(270deg, #feea10, #ff931e, #df841a, #01a72c, #f819a7, #0859fc, #0045bb, #7b9de0, #80c3df, #008000, #32cd32, #da0, #c00);
color: #000;
animation: AnimBanner 6s ease infinite,matrixGlow 3s ease-in-out infinite !important
}
.userBanner.designer {
background: linear-gradient(270deg, #ff6b6b, #ffa726, #ffeaa7);
color: #000;
animation: AnimBanner 8s ease infinite,glowPulse 4s ease-in-out infinite !important
}
.userBanner.supporter {
background: linear-gradient(270deg, #fdbb2d, #22c1c3, #fdbb2d);
animation: AnimBanner 7s ease infinite,glowPulse 3.5s ease-in-out infinite !important
}
.userBanner.vip {
background: linear-gradient(270deg, #833ab4, #fd1d1d, #fcb045);
border: 1px solid rgba(252,176,69,0.5);
animation: AnimBanner 6s ease infinite,vipGlow 3s ease-in-out infinite !important
}
.userBanner.kawaii {
background: linear-gradient(270deg, #ff9a9e, #fad0c4, #fbc2eb, #a6c1ee);
border: 2px dotted rgba(255,255,255,0.5);
animation: AnimBanner 9s ease infinite,kawaiiBounce 4s ease-in-out infinite !important
}
.userBanner.anime {
background: linear-gradient(270deg, #ff6b6b, #ffa8a8, #ff6b6b, #ff8e8e);
animation: AnimBanner 7s ease infinite,animePulse 3s ease-in-out infinite !important
}
.userBanner.retro {
background: linear-gradient(270deg, #ffafbd, #ffc3a0, #ffafbd);
color: #8b4513;
animation: AnimBanner 8s ease infinite,retroGlow 4s ease-in-out infinite !important
}
.userBanner.vintage {
background: linear-gradient(270deg, #d4af37, #c9a227, #d4af37);
color: #8b4513;
border: 1px solid #8b4513;
animation: AnimBanner 10s ease infinite,vintageShine 5s ease-in-out infinite !important
}
.userBanner.future {
background: linear-gradient(270deg, #0fc, #0cf, #0fc);
color: #000;
animation: AnimBanner 5s ease infinite,futureGlow 2s ease-in-out infinite !important
}
.userBanner.tech {
background: linear-gradient(270deg, #667eea, #764ba2, #667eea);
animation: AnimBanner 7s ease infinite,techPulse 3s ease-in-out infinite !important
}
.userBanner.magic {
background: linear-gradient(270deg, #f0c, #33f, #f0c);
animation: AnimBanner 6s ease infinite,magicSparkle 3s ease-in-out infinite !important
}
.userBanner.wizard {
background: linear-gradient(270deg, #9d50bb, #6e48aa, #9d50bb);
animation: AnimBanner 8s ease infinite,wizardGlow 4s ease-in-out infinite !important
}
.userBanner.enchanted {
background: linear-gradient(270deg, #0f0, #080, #0f0);
color: #000;
animation: AnimBanner 7s ease infinite,enchantedGlow 3.5s ease-in-out infinite !important
}
.userBanner.champion {
background: linear-gradient(270deg, #ffd700, #ffed4e, #ffd700);
color: #000;
border: 2px solid #daa520;
animation: AnimBanner 4s ease infinite,championShine 2s ease-in-out infinite !important
}
.userBanner.innovator {
background: linear-gradient(270deg, #0f8, #0cf, #0f8);
color: #000;
animation: AnimBanner 5s ease infinite,innovatorGlow 2.5s ease-in-out infinite !important
}
.userBanner.visionary {
background: linear-gradient(270deg, #f0f, #0ff, #f0f);
color: #000;
animation: AnimBanner 6s ease infinite,visionaryPulse 3s ease-in-out infinite !important
}
.userBanner.minimal {
background: linear-gradient(270deg, #667eea, #764ba2);
font-size: 55%;
padding: 4px 10px;
animation: AnimBanner 10s ease infinite,minimalGlow 5s ease-in-out infinite !important
}
.userBanner.sleek {
background: linear-gradient(270deg, #2c3e50, #3498db);
font-size: 58%;
animation: AnimBanner 12s ease infinite,sleekPulse 6s ease-in-out infinite !important
}
.userBanner.elegant {
background: linear-gradient(270deg, #636363, #a2a2a2);
font-size: 56%;
animation: AnimBanner 15s ease infinite,elegantGlow 7s ease-in-out infinite !important
}
@keyframes AnimBanner {
0% {
background-position: 0% 50%;
filter: brightness(1)
}
25% {
background-position: 50% 75%
}
50% {
background-position: 100% 50%;
filter: brightness(1.1)
}
75% {
background-position: 50% 25%
}
100% {
background-position: 0% 50%;
filter: brightness(1)
}
}
@keyframes glowPulse {
0%,100% {
box-shadow: 0 2px 8px rgba(0,0,0,0.2)
}
50% {
box-shadow: 0 4px 20px rgba(255,255,255,0.3),0 2px 8px rgba(0,0,0,0.3)
}
}
@keyframes matrixGlow {
0%,100% {
box-shadow: 0 0 15px rgba(0,255,0,0.7),0 2px 8px rgba(0,0,0,0.2)
}
50% {
box-shadow: 0 0 30px rgba(0,255,0,0.9),0 2px 8px rgba(0,0,0,0.3)
}
}
@keyframes goldPulse {
0%,100% {
box-shadow: 0 0 20px rgba(255,215,0,0.8),0 2px 8px rgba(0,0,0,0.2)
}
50% {
box-shadow: 0 0 35px #ffd700,0 2px 8px rgba(0,0,0,0.3)
}
}
@keyframes diamondShine {
0%,100% {
box-shadow: 0 0 18px rgba(185,242,255,0.7),0 2px 8px rgba(0,0,0,0.2)
}
50% {
box-shadow: 0 0 30px rgba(185,242,255,0.9),0 0 10px rgba(255,255,255,0.5),0 2px 8px rgba(0,0,0,0.3)
}
}
@keyframes epicGlow {
0%,100% {
box-shadow: 0 0 15px rgba(138,43,226,0.7),0 2px 8px rgba(0,0,0,0.2)
}
50% {
box-shadow: 0 0 25px rgba(138,43,226,0.9),0 2px 8px rgba(0,0,0,0.3)
}
}
@keyframes legendaryFire {
0%,100% {
box-shadow: 0 0 18px rgba(255,140,0,0.8),0 2px 8px rgba(0,0,0,0.2)
}
50% {
box-shadow: 0 0 30px #ff4500,0 2px 8px rgba(0,0,0,0.3)
}
}
@keyframes rainbowGlow {
0%,100% {
box-shadow: 0 0 25px rgba(255,0,0,0.8),0 2px 8px rgba(0,0,0,0.2)
}
16% {
box-shadow: 0 0 25px rgba(255,128,0,0.8),0 2px 8px rgba(0,0,0,0.2)
}
33% {
box-shadow: 0 0 25px rgba(255,255,0,0.8),0 2px 8px rgba(0,0,0,0.2)
}
50% {
box-shadow: 0 0 25px rgba(0,255,0,0.8),0 2px 8px rgba(0,0,0,0.2)
}
66% {
box-shadow: 0 0 25px rgba(0,255,255,0.8),0 2px 8px rgba(0,0,0,0.2)
}
83% {
box-shadow: 0 0 25px rgba(0,0,255,0.8),0 2px 8px rgba(0,0,0,0.2)
}
}
@keyframes adminPulse {
0%,100% {
box-shadow: 0 0 20px rgba(255,0,0,0.8),0 2px 8px rgba(0,0,0,0.2)
}
50% {
box-shadow: 0 0 35px #f00,0 2px 8px rgba(0,0,0,0.3)
}
}
.userBanner.premium {
animation: AnimBanner 6s ease infinite,goldPulse 2s ease-in-out infinite !important
}
.userBanner.animated {
animation: AnimBanner 5s ease infinite,glowPulse 2s ease-in-out infinite !important;
transition: all .3s ease
}
.userBanner.animated:hover {
transform: scale(1.05);
filter: brightness(1.2);
animation-duration: 3s,1s !important
}
.userBanner.compact {
font-size: 50%;
padding: 4px 8px;
max-width: 150px
}
.userBanner.tiny {
font-size: 45%;
padding: 3px 6px;
max-width: 120px
}
.userBanner:hover {
transform: scale(1.05);
filter: brightness(1.15);
animation-duration: 4s,2s !important;
z-index: 10
}
@media (max-width: 768px) {
.userBanner {
font-size:55%;
padding: 5px 10px;
max-width: 180px;
animation: AnimBanner 10s ease infinite,glowPulse 5s ease-in-out infinite !important
}
.userBanner.compact {
max-width: 130px
}
.userBanner.tiny {
max-width: 100px
}
}
Это же баннеры не?
а те чего надо? скрин плз приложи, я не понялЭто же баннеры не?
Щаса те чего надо? скрин плз приложи, я не понял
.rainbow-prefix {
display: inline-block;
padding: 3px 12px;
font-weight: bold;
border-radius: 12px;
position: relative;
z-index: 0;
background: #1f1f1f;
background-image: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3);
background-size: 1800% 1800%;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
animation: rainbowText 6s ease infinite
}
.rainbow-prefix::before {
content: "";
position: absolute;
inset: 0;
padding: 2px;
border-radius: 12px;
background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3);
background-size: 1800% 1800%;
animation: rainbowBorder 6s ease infinite;
-webkit-mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
-webkit-mask-composite: xor;
mask-composite: exclude;
z-index: -1
}
@keyframes rainbowText {
0% {
background-position: 0% 50%
}
50% {
background-position: 100% 50%
}
100% {
background-position: 0% 50%
}
}
@keyframes rainbowBorder {
0% {
background-position: 100% 50%
}
50% {
background-position: 0% 50%
}
100% {
background-position: 100% 50%
}
}
Баннеры то я знал, т, к я из еще сливал давно и они брали 100% мой код, а префиксы хз где взяли ониcss:.userBanner { color: #fff; text-transform: uppercase; font-weight: 700; font-size: 60%; padding: 6px 12px; background-size: 400% 400% !important; animation: AnimBanner 10s ease infinite !important; position: relative; display: inline-flex; align-items: center; border-radius: 50px; margin: 2px; text-shadow: 1px 1px 2px rgba(0,0,0,0.5); box-shadow: 0 2px 8px rgba(0,0,0,0.2); max-width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all .3s ease } .userBanner.userBanner--staff { color: white; background: linear-gradient(80deg, #f00, #ff8000, #ff0, #0f0, #0ff, #00f, #f0f); font-size: 60%; border-radius: 50px; text-align: center; padding: 6px 12px 3px; font-style: normal; border: none } .userBanner.cosmic { background: linear-gradient(270deg, #667eea, #764ba2, #f093fb, #f5576c); border: 1px solid rgba(255,255,255,0.3); animation: AnimBanner 6s ease infinite,glowPulse 3s ease-in-out infinite !important } .userBanner.nebula { background: linear-gradient(270deg, #ff6b6b, #ffa726, #66bb6a, #42a5f5, #ab47bc); animation: AnimBanner 7s ease infinite,glowPulse 3.5s ease-in-out infinite !important } .userBanner.galaxy { background: linear-gradient(270deg, #000428, #004e92, #2c3e50, #3498db); animation: AnimBanner 9s ease infinite,glowPulse 4s ease-in-out infinite !important } .userBanner.quantum { background: linear-gradient(270deg, #00b4db, #0083b0, #00f5a0, #00d9f5); animation: AnimBanner 5s ease infinite,glowPulse 2.5s ease-in-out infinite !important } .userBanner.cyber { background: linear-gradient(270deg, #ff0084, #33001b, #ff0084); border: 1px solid #ff0084; animation: AnimBanner 4s ease infinite,glowPulse 2s ease-in-out infinite !important } .userBanner.neon { background: linear-gradient(270deg, #00ff87, #60efff, #0061ff); color: #000; text-shadow: none; animation: AnimBanner 6s ease infinite,glowPulse 3s ease-in-out infinite !important } .userBanner.hologram { background: linear-gradient(270deg, #ff75c3, #ffa647, #ffe83f, #9fff5b, #70e2ff, #cd93ff); animation: AnimBanner 10s ease infinite,glowPulse 5s ease-in-out infinite !important } .userBanner.matrix { background: linear-gradient(270deg, #0f0, #0c0, #090, #060); color: #000; animation: AnimBanner 5s ease infinite,matrixGlow 2s ease-in-out infinite !important } .userBanner.aurora { background: linear-gradient(270deg, #ff7e5f, #feb47b, #86a8e7, #91eae4); animation: AnimBanner 8s ease infinite,glowPulse 4s ease-in-out infinite !important } .userBanner.ocean { background: linear-gradient(270deg, #2193b0, #6dd5ed, #6dd5fa, #2193b0); animation: AnimBanner 7s ease infinite,glowPulse 3.5s ease-in-out infinite !important } .userBanner.forest { background: linear-gradient(270deg, #56ab2f, #a8e6cf, #56ab2f, #2c7744); animation: AnimBanner 9s ease infinite,glowPulse 4s ease-in-out infinite !important } .userBanner.sunset { background: linear-gradient(270deg, #ff9a9e, #fad0c4, #fad0c4, #ff9a9e); animation: AnimBanner 6s ease infinite,glowPulse 3s ease-in-out infinite !important } .userBanner.gold { background: linear-gradient(270deg, #ffd700, #ffed4e, #ffd700, #daa520); color: #000; border: 1px solid #ffd700; animation: AnimBanner 5s ease infinite,goldPulse 2s ease-in-out infinite !important } .userBanner.platinum { background: linear-gradient(270deg, #e5e4e2, #b6b6b4, #e5e4e2, #8a8a88); color: #000; animation: AnimBanner 7s ease infinite,glowPulse 3s ease-in-out infinite !important } .userBanner.diamond { background: linear-gradient(270deg, #b9f2ff, #e6f7ff, #b9f2ff, #89cff0); color: #0066cc; animation: AnimBanner 8s ease infinite,diamondShine 3s ease-in-out infinite !important } .userBanner.crystal { background: linear-gradient(270deg, #ff6b6b, #ffa726, #66bb6a, #42a5f5); animation: AnimBanner 9s ease infinite,glowPulse 4s ease-in-out infinite !important } .userBanner.epic { background: linear-gradient(270deg, #8a2be2, #4b0082, #9400d3); animation: AnimBanner 6s ease infinite,epicGlow 2.5s ease-in-out infinite !important } .userBanner.legendary { background: linear-gradient(270deg, #ff8c00, #ff4500, #dc143c); animation: AnimBanner 4s ease infinite,legendaryFire 2s ease-in-out infinite !important } .userBanner.mythic { background: linear-gradient(270deg, #ff1493, #c71585, #8b008b); animation: AnimBanner 7s ease infinite,mythicPulse 3s ease-in-out infinite !important } .userBanner.heroic { background: linear-gradient(270deg, #1e90ff, #00bfff, #1e90ff); animation: AnimBanner 8s ease infinite,heroicGlow 4s ease-in-out infinite !important } .userBanner.spring { background: linear-gradient(270deg, #ff9a9e, #fad0c4, #fbc2eb, #a6c1ee); animation: AnimBanner 10s ease infinite,glowPulse 5s ease-in-out infinite !important } .userBanner.summer { background: linear-gradient(270deg, #ffecd2, #fcb69f, #ff9a8b); color: #000; animation: AnimBanner 7s ease infinite,summerGlow 3s ease-in-out infinite !important } .userBanner.autumn { background: linear-gradient(270deg, #ff9a62, #ff6b6b, #c56c86); animation: AnimBanner 8s ease infinite,autumnGlow 4s ease-in-out infinite !important } .userBanner.winter { background: linear-gradient(270deg, #a1c4fd, #c2e9fb, #a1c4fd); color: #2c3e50; animation: AnimBanner 9s ease infinite,winterSparkle 5s ease-in-out infinite !important } .userBanner.creator { background: linear-gradient(270deg, #f00, #ff8000, #ff0, #0f0, #0ff, #00f, #f0f); border: 2px solid rgba(255,255,255,0.5); font-size: 55%; animation: AnimBanner 12s ease infinite,rainbowGlow 6s ease-in-out infinite !important } .userBanner.moderator { background: linear-gradient(270deg, #4facfe, #00f2fe, #4facfe); animation: AnimBanner 8s ease infinite,glowPulse 4s ease-in-out infinite !important } .userBanner.administrator { background: linear-gradient(270deg, #f00, #ff6b6b, #f00); border: 1px solid #f00; animation: AnimBanner 5s ease infinite,adminPulse 2s ease-in-out infinite !important } .userBanner.developer { background: linear-gradient(270deg, #feea10, #ff931e, #df841a, #01a72c, #f819a7, #0859fc, #0045bb, #7b9de0, #80c3df, #008000, #32cd32, #da0, #c00); color: #000; animation: AnimBanner 6s ease infinite,matrixGlow 3s ease-in-out infinite !important } .userBanner.designer { background: linear-gradient(270deg, #ff6b6b, #ffa726, #ffeaa7); color: #000; animation: AnimBanner 8s ease infinite,glowPulse 4s ease-in-out infinite !important } .userBanner.supporter { background: linear-gradient(270deg, #fdbb2d, #22c1c3, #fdbb2d); animation: AnimBanner 7s ease infinite,glowPulse 3.5s ease-in-out infinite !important } .userBanner.vip { background: linear-gradient(270deg, #833ab4, #fd1d1d, #fcb045); border: 1px solid rgba(252,176,69,0.5); animation: AnimBanner 6s ease infinite,vipGlow 3s ease-in-out infinite !important } .userBanner.kawaii { background: linear-gradient(270deg, #ff9a9e, #fad0c4, #fbc2eb, #a6c1ee); border: 2px dotted rgba(255,255,255,0.5); animation: AnimBanner 9s ease infinite,kawaiiBounce 4s ease-in-out infinite !important } .userBanner.anime { background: linear-gradient(270deg, #ff6b6b, #ffa8a8, #ff6b6b, #ff8e8e); animation: AnimBanner 7s ease infinite,animePulse 3s ease-in-out infinite !important } .userBanner.retro { background: linear-gradient(270deg, #ffafbd, #ffc3a0, #ffafbd); color: #8b4513; animation: AnimBanner 8s ease infinite,retroGlow 4s ease-in-out infinite !important } .userBanner.vintage { background: linear-gradient(270deg, #d4af37, #c9a227, #d4af37); color: #8b4513; border: 1px solid #8b4513; animation: AnimBanner 10s ease infinite,vintageShine 5s ease-in-out infinite !important } .userBanner.future { background: linear-gradient(270deg, #0fc, #0cf, #0fc); color: #000; animation: AnimBanner 5s ease infinite,futureGlow 2s ease-in-out infinite !important } .userBanner.tech { background: linear-gradient(270deg, #667eea, #764ba2, #667eea); animation: AnimBanner 7s ease infinite,techPulse 3s ease-in-out infinite !important } .userBanner.magic { background: linear-gradient(270deg, #f0c, #33f, #f0c); animation: AnimBanner 6s ease infinite,magicSparkle 3s ease-in-out infinite !important } .userBanner.wizard { background: linear-gradient(270deg, #9d50bb, #6e48aa, #9d50bb); animation: AnimBanner 8s ease infinite,wizardGlow 4s ease-in-out infinite !important } .userBanner.enchanted { background: linear-gradient(270deg, #0f0, #080, #0f0); color: #000; animation: AnimBanner 7s ease infinite,enchantedGlow 3.5s ease-in-out infinite !important } .userBanner.champion { background: linear-gradient(270deg, #ffd700, #ffed4e, #ffd700); color: #000; border: 2px solid #daa520; animation: AnimBanner 4s ease infinite,championShine 2s ease-in-out infinite !important } .userBanner.innovator { background: linear-gradient(270deg, #0f8, #0cf, #0f8); color: #000; animation: AnimBanner 5s ease infinite,innovatorGlow 2.5s ease-in-out infinite !important } .userBanner.visionary { background: linear-gradient(270deg, #f0f, #0ff, #f0f); color: #000; animation: AnimBanner 6s ease infinite,visionaryPulse 3s ease-in-out infinite !important } .userBanner.minimal { background: linear-gradient(270deg, #667eea, #764ba2); font-size: 55%; padding: 4px 10px; animation: AnimBanner 10s ease infinite,minimalGlow 5s ease-in-out infinite !important } .userBanner.sleek { background: linear-gradient(270deg, #2c3e50, #3498db); font-size: 58%; animation: AnimBanner 12s ease infinite,sleekPulse 6s ease-in-out infinite !important } .userBanner.elegant { background: linear-gradient(270deg, #636363, #a2a2a2); font-size: 56%; animation: AnimBanner 15s ease infinite,elegantGlow 7s ease-in-out infinite !important } @keyframes AnimBanner { 0% { background-position: 0% 50%; filter: brightness(1) } 25% { background-position: 50% 75% } 50% { background-position: 100% 50%; filter: brightness(1.1) } 75% { background-position: 50% 25% } 100% { background-position: 0% 50%; filter: brightness(1) } } @keyframes glowPulse { 0%,100% { box-shadow: 0 2px 8px rgba(0,0,0,0.2) } 50% { box-shadow: 0 4px 20px rgba(255,255,255,0.3),0 2px 8px rgba(0,0,0,0.3) } } @keyframes matrixGlow { 0%,100% { box-shadow: 0 0 15px rgba(0,255,0,0.7),0 2px 8px rgba(0,0,0,0.2) } 50% { box-shadow: 0 0 30px rgba(0,255,0,0.9),0 2px 8px rgba(0,0,0,0.3) } } @keyframes goldPulse { 0%,100% { box-shadow: 0 0 20px rgba(255,215,0,0.8),0 2px 8px rgba(0,0,0,0.2) } 50% { box-shadow: 0 0 35px #ffd700,0 2px 8px rgba(0,0,0,0.3) } } @keyframes diamondShine { 0%,100% { box-shadow: 0 0 18px rgba(185,242,255,0.7),0 2px 8px rgba(0,0,0,0.2) } 50% { box-shadow: 0 0 30px rgba(185,242,255,0.9),0 0 10px rgba(255,255,255,0.5),0 2px 8px rgba(0,0,0,0.3) } } @keyframes epicGlow { 0%,100% { box-shadow: 0 0 15px rgba(138,43,226,0.7),0 2px 8px rgba(0,0,0,0.2) } 50% { box-shadow: 0 0 25px rgba(138,43,226,0.9),0 2px 8px rgba(0,0,0,0.3) } } @keyframes legendaryFire { 0%,100% { box-shadow: 0 0 18px rgba(255,140,0,0.8),0 2px 8px rgba(0,0,0,0.2) } 50% { box-shadow: 0 0 30px #ff4500,0 2px 8px rgba(0,0,0,0.3) } } @keyframes rainbowGlow { 0%,100% { box-shadow: 0 0 25px rgba(255,0,0,0.8),0 2px 8px rgba(0,0,0,0.2) } 16% { box-shadow: 0 0 25px rgba(255,128,0,0.8),0 2px 8px rgba(0,0,0,0.2) } 33% { box-shadow: 0 0 25px rgba(255,255,0,0.8),0 2px 8px rgba(0,0,0,0.2) } 50% { box-shadow: 0 0 25px rgba(0,255,0,0.8),0 2px 8px rgba(0,0,0,0.2) } 66% { box-shadow: 0 0 25px rgba(0,255,255,0.8),0 2px 8px rgba(0,0,0,0.2) } 83% { box-shadow: 0 0 25px rgba(0,0,255,0.8),0 2px 8px rgba(0,0,0,0.2) } } @keyframes adminPulse { 0%,100% { box-shadow: 0 0 20px rgba(255,0,0,0.8),0 2px 8px rgba(0,0,0,0.2) } 50% { box-shadow: 0 0 35px #f00,0 2px 8px rgba(0,0,0,0.3) } } .userBanner.premium { animation: AnimBanner 6s ease infinite,goldPulse 2s ease-in-out infinite !important } .userBanner.animated { animation: AnimBanner 5s ease infinite,glowPulse 2s ease-in-out infinite !important; transition: all .3s ease } .userBanner.animated:hover { transform: scale(1.05); filter: brightness(1.2); animation-duration: 3s,1s !important } .userBanner.compact { font-size: 50%; padding: 4px 8px; max-width: 150px } .userBanner.tiny { font-size: 45%; padding: 3px 6px; max-width: 120px } .userBanner:hover { transform: scale(1.05); filter: brightness(1.15); animation-duration: 4s,2s !important; z-index: 10 } @media (max-width: 768px) { .userBanner { font-size:55%; padding: 5px 10px; max-width: 180px; animation: AnimBanner 10s ease infinite,glowPulse 5s ease-in-out infinite !important } .userBanner.compact { max-width: 130px } .userBanner.tiny { max-width: 100px } }
Щас проверюcss:.rainbow-prefix { display: inline-block; padding: 3px 12px; font-weight: bold; border-radius: 12px; position: relative; z-index: 0; background: #1f1f1f; background-image: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3); background-size: 1800% 1800%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: rainbowText 6s ease infinite } .rainbow-prefix::before { content: ""; position: absolute; inset: 0; padding: 2px; border-radius: 12px; background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3); background-size: 1800% 1800%; animation: rainbowBorder 6s ease infinite; -webkit-mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; z-index: -1 }
исправил там, перезагрузи страницуЩас проверю