XF 1.2 Need Help Understanding Custom Node/Forum Icons

UKD

Active member
I understand that you can change the custom node icons for all forums by changing the image here:

image.png


The images changed however they were not centred. Here is what they looked like after changing the default image:

image.png


As you can see the icons are not quite right, even though they are 40x40 which is the image size of the default speech bubbles.

I then used this code (below) to correct the background position:

Code:
.node.node_7 .forumNodeInfo .nodeIcon, .node.node_7 .categoryForumNodeInfo .nodeIcon { 
    background-position: -2px -2px;
  
}
.node.node_7 .forumNodeInfo.unread .nodeIcon, .node.node_7 .categoryForumNodeInfo.unread .nodeIcon {
    background-position: -2px -2px;
    opacity: 0.4;
}

It now looks perfect:

image.png


My question is, do I now have to use that code for every single node, or is there just a way of writing one line of code for my EXTRA.css to apply a background position to all forum icons?

Any help would be much appreciated. Thanks.
 
A combination of:

Code:
.node .forumNodeInfo .nodeIcon, .node .categoryForumNodeInfo .nodeIcon {
    background-position: -2px -2px;
 
}
.node .forumNodeInfo.unread .nodeIcon, .node .categoryForumNodeInfo.unread .nodeIcon {
    background-position: -2px -2px;
    opacity: 0.4;
}

Code:
.node.node_7 .forumNodeInfo .nodeIcon, .node .categoryForumNodeInfo .nodeIcon {
    background-position: -2px -2px;
 
}
.node.node_7 .forumNodeInfo.unread .nodeIcon, .node .categoryForumNodeInfo.unread .nodeIcon {
    background-position: -2px -2px;
    opacity: 0.4;
}

Code:
.node .forumNodeInfo .nodeIcon, .node.node_7 .categoryForumNodeInfo .nodeIcon {
    background-position: -2px -2px;
 
}
.node .forumNodeInfo.unread .nodeIcon, .node.node_7 .categoryForumNodeInfo.unread .nodeIcon {
    background-position: -2px -2px;
    opacity: 0.4;
}

Neither of them seemed to have any effect. They just all reverted to their current default position. Any ideas? Thanks.
I could go ahead and do every forum manually however I just thought I would ask just in case there was a simple thing I was missing to apply to all. My forum has around 400 separate forums so the code is going to be HUGE.
 
No worries. I'm an idiot. I missed the very obvious option to move the logo here:

image.png


Hopefully this info may help others if they are stuck in this situation and search the forums.

I'm not sure why there has not been a method describing this in the past, and I did search the forums a lot in regards to this and all that came up was placing custom individual code in your extra.css. There was also an add-on however that didn't work in certain browsers, and to be honest, the less add-ons a person has the better. Less chance of things breaking on an update or different browsers.
 
Top Bottom