Move away from JS to write Font Awesome Icons on elements

Hutchy68 commented 3 years ago

There is a better method to add icons to the elements on the skin using a pure CSS stylesheet with Font Awesome.

As an alternative icons can be added via the fontawsome.css file in assets/stylesheets. This method will preload the icons instead of relying on javascript to fetch them. To add an icon just create or add to your MediaWiki:Fontawsome.css page something similar to this code:

n-recentchanges a:before {content: "\f0ae";}

This will also prevent some of the quirks with using VE too that have been discussed in other issues over the years.

Hutchy68 commented 3 years ago

Adding icons will have to be done on

MediaWiki:Foreground.css
MediaWiki:Common.css

Will have to use the Unicode for content: "\...."; CSS value.

Hutchy68 commented 3 years ago

Has anyone tested this. I would like to do a release soon and would appreciate testing and comments. Thanks!

Hutchy68 commented 3 years ago

Released.

jthingelstad / foreground

Move away from JS to write Font Awesome Icons on elements #385

n-recentchanges a:before {content: "\f0ae";}