Trying to come up with a way to replace a given icon with a custom asset, and nothing I've come up with feels quite right.
My first idea was to override the flarum/helpers/icon function with custom code, but this didn't work. All the modules that wanted the icon helper function loaded the original reference before my override happened.
What I've got currently, edits the CSS instead. Font-awesome works by making a :before pseudo-element and giving it a unicode character as its 'content' property. I've replaced the :before content with a non-breaking space, and set the <i/> element's background image to the desired asset. This works okay if the icon element inherits a fixed width, but in group badges for example, it gets cut down to the width of a non-breaking space. My current work-around is setting the content to four non-breaking spaces, but I don't like that at all.
Another idea was to use JQuery on the rendered DOM, but the only event I could think to use, that would guarantee me access to every icon on the page as soon as it rendered, was 'config' on the root Component class, and that feels wasteful. I feel like it would give me the most flexibility and fit in better with the architecture to edit the vDOM rather than the stylesheet or DOM, but without the ability to override the icon helper function, I don't see any practical way to do that.
Any thoughts?
Also, I could also give icon elements a fixed size on the stylesheet. So far as I can see, all the icons on the actual forum are about the same size in the default style, but I don't like removing the ability for icons to scale.
