It would be awesome if we could use font awesome icons, or even just normal html entities to create icon-buttons.
Presently, any attempt to use an i tag (for fontawesome), or html entity (for a unicode symbol, e.g.) results in the plain text appearing in the button. I am able to paste the raw unicode character as binary to get the symbol to show, but using an entity or fontawesome would be much better.
When you have several actions on an item (edit, delete, copy, etc.) using word buttons gets quite busy on the screen, even with using custom CSS to make them look like links.
2 Likes
Hi @church!
You can link font libraries or add CSS, like you'd normally do when writing HTML. Here's a quick outline of how this might work:
Firstly, you can add a Text component to your application, and if it's the old Text component, toggle on the render as HTML. This will allows you to include <style> tags, add CSS and/or link your library. Since this field wont have any text, only HTML tags, it will appear invisible on your screen.
And as a quick note, the new way of writing CSS is not in a Text component with <style> tags, rather in the 3 dot menu > Scripts and Styles > CSS!
From there you can include the icon from the library using typical HTML conventions !
Hope this helps! Let me know if you run into any troubles!
Hi Victoria,
I am familiar with how to do CSS (both new and old ways), but that doesn't resolve the issue with buttons, where any content for the label is rendered in an escaped fashion. Currently, the contents of the button label are being wrapped in a span and escaped. If we could avoid doing that, buttons would look like this:
(I edited the html in the debugger to make it show properly)
Versus, how they currently show up:
Ah! I am now following 
My mistake.
The button group component allows you to write HTML for the labels, though they definitely aren't as friendly to use as the regular button component and there'a bit of default styling applied. For example, if the value of the button is short (ie just a symbol), then the button will also be short (lengthwise).
Would this possibly work for you?
That is possible, but would heavily complicate development (every icon button in an app needing to be in a row and then having a single handler for all of them). We are working around at the moment by finding a relatively similar unicode character, and pasting that into the button label. This, if course, has drawbacks related to the size of the icon and the coloring.
