Button: How to left align text, and right align an icon

[afleming]

Hello,

I'm needing to create buttons that have the text left aligned inside the button, and have the icon (a check mark) right aligned to the button - life if you have a button left aligned, a span in the middle to fill out the space, then an image(icon) on the right.

Is this possible with just the Button class + some scss trickery, or will I need to create a new panel with button-like listeners and such?

Thanks!

[mitchellsimoens]

Try iconAlign config on the button?

[afleming]

I did indeed - it does as expected, it aligns the icon to the right side of the text, not to the right side of the button.

I was hoping it would allow the text to be left-aligned to the button, then the icon to the right-aligned to button, so there would be space between the text and button, but the more I think about it, the less likely that seems.

I'm bulding this list using a dataview, and was hoping to not have to figure out how to make a button with the different components inside >.<

[mitchellsimoens]

I'm sure some CSS would help with that.

[afleming]

I'm going to continue working with that, see if I can come up with something, just not sure.

I'm thinking of trying out using a Disclosure Button, and perhaps causing it to not have an event attached - that would allow the right align. Problem is, the icon is to be a checkmark, that is transparent when the button is 'inactive' and opaque when the button is 'active', which is done by a tap on the button which houses it... should be an interesting challenge.