XF 2.0 Replace FA node icon with an image?

This is the formula that works on my site:

CSS:
/* Forum read & unread icons */
.node--forum.node--read .node-icon i:before{content: url('node icon/node-read.png');
}
.node--forum.node--unread .node-icon i:before{content: url('node icon/node-unread.png');
}
 
If you want to use different opacity levels for read and unread forums, here's the code:

Code:
.node--forum.node--read .node-icon i:before{content: url(/img/node-icon.png); opacity: 0.3;}
.node--forum.node--unread .node-icon i:before{content: url(/img/node-icon.png); opacity: 0.9;}
 
I'm trying to target each sub forum icon.

This is what I have:
Code:
.subNodeLink.subNodeLink--forum:before {
    content: "\f187";
}

I want to change the icon for each sub forum on the forum list. Any idea how?
 
You can change a node's icon by putting a line like this into extra.less where "5" is the node id/number (click on the node and look at the unique number in the URL)

Code:
.node--id5 .node-icon .fa-comments:before {
    content: "\f084";
}
 
Top Bottom