I have seen people ask about this before, so here is a simple tutorial to replace the modcp sprites with individual images of your own.
In modcp.css
Find:
Replace with:
Now create your images with the respective names, upload them and you are good to go!
Or download the images below:
modcp.zip (Size: 19.06 KB / Downloads: 0)
In modcp.css
Find:
Code:
.modcp_nav_item {
display: block;
padding: 1px 0 1px 23px;
background-image: url(images/modcp_sprite.png);
background-repeat: no-repeat;
}
.modcp_nav_home {
background-position: 0 0;
}
.modcp_nav_announcements {
background-position: 0 -20px;
}
.modcp_nav_reports {
background-position: 0 -40px;
}
.modcp_nav_modqueue {
background-position: 0 -60px;
}
.modcp_nav_modlogs {
background-position: 0 -80px;
}
.modcp_nav_editprofile {
background-position: 0 -100px;
}
.modcp_nav_banning {
background-position: 0 -120px;
}
.modcp_nav_warninglogs {
background-position: 0 -140px;
}
.modcp_nav_ipsearch {
background-position: 0 -160px;
}
Replace with:
Code:
.modcp_nav_item {
display: block;
padding: 1px 0 1px 23px;
background-repeat: no-repeat;
}
.modcp_nav_home {
background-image: url('images/modcp/home.png');
}
.modcp_nav_announcements {
background-image: url('images/modcp/announcements.png');
}
.modcp_nav_reports {
background-image: url('images/modcp/reports.png');
}
.modcp_nav_modqueue {
background-image: url('images/modcp/modqueue.png');
}
.modcp_nav_modlogs {
background-image: url('images/modcp/modlogs.png');
}
.modcp_nav_editprofile {
background-image: url('images/modcp/editprofile.png');
}
.modcp_nav_banning {
background-image: url('images/modcp/banning.png');
}
.modcp_nav_warninglogs {
background-image: url('images/modcp/warninglogs.png');
}
.modcp_nav_ipsearch {
background-image: url('images/modcp/ipsearch.png');
}
Now create your images with the respective names, upload them and you are good to go!
Or download the images below:
