MyBB Community Forums

Full Version: helping change color Prefix
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Who knew you guidance behalf of Prefix changing color like mybb.com. thanks a lot

[Image: cntt2a2-111.JPG]
You can add your own style when adding a new Thread Prefix in Display Style field.
Add this to your global.css
.prefixgreen {
background-color:#599800;
-webkit-box-shadow:rgba(0, 0, 0, 0.3) 0 1px 3px, rgba(255, 255, 255, 0.3) 0 0 2px inset;
box-shadow:rgba(0, 0, 0, 0.3) 0 1px 3px, rgba(255, 255, 255, 0.3) 0 0 2px inset;
background-image:-webkit-gradient(linear, 0 0%, 0 100%, from(#7ed503), to(#599800));
text-shadow:#7ed503 0 1px 0;
border:1px solid #396402;
color:#212121;
padding-bottom:2px;
padding-left:10px;
padding-right:10px;
padding-top:2px;
font-size: 11px;
font-weight: normal;
border-radius: 5px;
}

.prefixred {
background-color:#FF3333;
-webkit-box-shadow:rgba(0, 0, 0, 0.3) 0 1px 3px, rgba(255, 255, 255, 0.3) 0 0 2px inset;
box-shadow:rgba(0, 0, 0, 0.3) 0 1px 3px, rgba(255, 255, 255, 0.3) 0 0 2px inset;
background-image:-webkit-gradient(linear, 0 0%, 0 100%, from(#FF4747), to(#CC2929));
text-shadow:#FF4747 0 1px 0;
border:1px solid #121212;
color:#212121;
padding-bottom:2px;
padding-left:10px;
padding-right:10px;
padding-top:2px;
font-size: 11px;
font-weight: normal;
border-radius: 5px;
}

.prefixblue {
background-color:#0099FF;
-webkit-box-shadow:rgba(0, 0, 0, 0.3) 0 1px 3px, rgba(255, 255, 255, 0.3) 0 0 2px inset;
box-shadow:rgba(0, 0, 0, 0.3) 0 1px 3px, rgba(255, 255, 255, 0.3) 0 0 2px inset;
background-image:-webkit-gradient(linear, 0 0%, 0 100%, from(#33ADFF), to(#008AE6));
text-shadow:#33ADFF 0 1px 0;
border:1px solid #121212;
color:#212121;
padding-bottom:2px;
padding-left:10px;
padding-right:10px;
padding-top:2px;
font-size: 11px;
font-weight: normal;
border-radius: 5px;
}

Then go to Configuration >> Thread Prefixes >> Add New
In Display style box, put this code.
Quote:<span class="prefixred">18+</span>

You can change prefixred to prefixblue or prefixgreen as you like. here is what you will get as a result.

Credit goes to some tutorial I read some where.
Dont mind adding a rep if you think I helped you Angel