MyBB Community Forums

Full Version: UserCP Icons for Dark Themes
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2
I've taken the liberty of renaming and editing some of famfam silks icons so they can be used for the UserCP on dark themes. You will need to upload the images to root/images/themename/usercp via ftp and what not. You will also need to edit the usercp.css in your theme and replace it all with this:

.usercp_nav_item {
	display: block;
	padding: 1px 0 1px 23px;
}

.usercp_nav_composepm {
	background: url(images/usercp/composepm.png) no-repeat left center;
}

.usercp_nav_pmfolder {
	background: url(images/usercp/pmfolder.png) no-repeat left center;
}

.usercp_nav_sub_pmfolder {
	padding-left: 40px;
	background: url(images/usercp/sub_pmfolder.png) no-repeat left center;
}

.usercp_nav_trash_pmfolder {
	padding-left: 40px;
	background: url(images/usercp/trash_pmfolder.png) no-repeat left center;
}

.usercp_nav_pmtracking {
	background: url(images/usercp/pmtracking.png) no-repeat left center;
}

.usercp_nav_pmfolders {
	background: url(images/usercp/editfolders.png) no-repeat left center;
}

.usercp_nav_profile {
	background: url(images/usercp/profile.png) no-repeat left center;
}

.usercp_nav_email {
	padding-left: 40px;
	background: url(images/usercp/email.png) no-repeat left center;
}

.usercp_nav_password {
	padding-left: 40px;
	background: url(images/usercp/password.png) no-repeat left center;
}

.usercp_nav_username {
	padding-left: 40px;
	background: url(images/usercp/username.png) no-repeat left center;
}

.usercp_nav_editsig {
	padding-left: 40px;
	background: url(images/usercp/editsig.png) no-repeat left center;
}

.usercp_nav_avatar {
	padding-left: 40px;
	background: url(images/usercp/avatar.png) no-repeat left center;
}

.usercp_nav_options {
	background: url(images/usercp/options.png) no-repeat left center;
}

.usercp_nav_usergroups {
	background: url(images/usercp/usergroups.png) no-repeat left center;
}

.usercp_nav_editlists {
	background: url(images/usercp/editlists.png) no-repeat left center;
}

.usercp_nav_attachments {
	background: url(images/usercp/attachments.png) no-repeat left center;
}

.usercp_nav_drafts {
	background: url(images/usercp/drafts.png) no-repeat left center;
}

.usercp_nav_subscriptions {
	background: url(images/usercp/subscriptions.png) no-repeat left center;
}

.usercp_nav_fsubscriptions {
	background: url(images/usercp/fsubscriptions.png) no-repeat left center;
}

.usercp_nav_notepad {
	background: url(images/usercp/notepad.png) no-repeat left center;
}

.usercp_nav_viewprofile {
	background: url(images/usercp/viewprofile.png) no-repeat left center;
}

.usercp_nav_home {
	background: url(images/usercp/home.png) no-repeat left center;
}

[attachment=16035]
You could also just make them .gif with a transparent background?
Well I dont really feel like redoing all of them, lol took me like half an hour as it is Toungue
No you just upload the .png to FileZilla and rename them to .gif. That way your computer will think it's a .gif but it still keeps its .png properties. One problem with this is that you will corrupt the image so that you wont be able to open it on PhotoShop.
Oh I didnt know because last time I tried that I did it on my desktop and the file wouldnt show a preview because it was corrupt so I figured if my computer wouldnt show it then neither would any browser.
Yes, the files are corrupt but they would transfer/download as mime types, which could potentially be bad if you just change the extension from the ftp and a browser doesn't transfer mime types. Smile
wtf is a mime type?
A download/transfer type
oh ok, also why is everyone making a big deal about it, Its not like Im gonna blow another half hour redoing it.
What do you mean big deal? Were just saying how you can make it transparent for a .gif.
Pages: 1 2