I’ve noticed that people in the PowerApps community have been having trouble using image resources within their custom PCF controls, so I thought I would look at a simple but novel approach for customizing your buttons and icons.
If you aren’t familiar with font-awesome they let you search from a catalog of great looking icons that you embed within your web apps.
In the following example, I created three buttons which have their own font-awesome icons. This was achieved by doing two things
1) Using an import statement within my css file. I then referenced the font-awesome css file.
2) Then within my typescript init class I added the following to HTML to my button elements.
The end result looked something along the lines of the following example:
If you would like to test this solution out, you can find the source code and test solution file over at GitHub.
- Shout out to Mo Mostafa MVP for the challenge.