using SVG for node icons?

[dark_night]

is there an addon or way to use SVG icons as my forum node icons or nothing exists like it? i know you can with font awesome, but wanting to use SVG icons instead and havent been able to find anything about it.

 

[PapaUnstuck]

Do you mean this one? https://enxf.net/resources/cv6-node-icons-tools.3501/

 

[dark_night]

Do you mean this one? https://enxf.net/resources/cv6-node-icons-tools.3501/

PapaUnstuckthis works pretty well so far. have you used this? trying to figure out how to color the SVG icon once uploaded via CSS, would that be possible?

 

[PapaUnstuck]

this works pretty well so far. have you used this? trying to figure out how to color the SVG icon once uploaded via CSS, would that be possible?

dark_nightI am sorry, but I don't use this on my forum. I am not sure if I gonna add it in the future. When I read the topic on the forum of XF itself, someone said it isn't possible to do it with css.

You could try it, and add this code to your extra.less

.node.node--id<yournodeid> .no-icon i
{
    color: purple;
}

 

[dark_night]

I am sorry, but I don't use this on my forum. I am not sure if I gonna add it in the future. When I read the topic on the forum of XF itself, someone said it isn't possible to do it with css.

You could try it, and add this code to your extra.css

.node.node--id<yournodeid> .no-icon i
{
    color: purple;
}

PapaUnstuckthe element itself works but yeah doesnt seem to color the icon. addon may be bugged a little, as when i set the "Node background" to the svg icon the icon appears, but if i set it to the "Node icon" then nothing changes and the font awesome icon remains, its a good start though so thank you bro.

 

[PapaUnstuck]

the element itself works but yeah doesnt seem to color the icon. addon may be bugged a little, as when i set the "Node background" to the svg icon the icon appears, but if i set it to the "Node icon" then nothing changes and the font awesome icon remains, its a good start though so thank you bro.

dark_nightMaybe this one in extra.less

.node--id<yournodeid>.node--link .node-icon i:before {
    background-image: url('your URL to your SVG');
    background-size: 44px 44px;
    color: purple;
    display: inline-block;
    width: 44px;
    height: 44px;
    content:"";
}

You could try it, not sure if this one will work and tweak it yourself a bit.