font awesome integrated into enyo

i'm trying to figure out how to use font awesome fortawesome.github.io/Font-Awesome/ to work in enyo. any help would be appreciated! :)

seems like an easy and flexible way to use icons. if anyone has any negative feedback with this approach i'd appreciate that as well.

thanks!

Comments

  • Didn't see this - thanks!
  • edited February 2015
    if anyone has used these custom kinds, i'm trying to figure out how to change the icon via javascript. the icon is called out using icon: "fa-truck", for instance, but when i try to update the icon using this.$.quickPick.setIcon("fa-remove"); in the setupitem function for my list, there's no change.

    a little more info on this... when i inspect the element in question, it says i#test_quickPick.fa.fa-truck.fa-remove::before 47px x 48px. not sure if i somehow need to remove the fa-truck before adding the fa-remove instead of thinking it would just change it.

    any ideas?

    also, using font awesome directly with the html tags you can stack the icons like here: stacked example. not sure how i'd do this via enyo either.

    thanks!!!
  • got the first part to work with removeClass and addRemoveClass. still not sure about the second part, but i'm trying a few things.
  • For the second part you could do something along the lines of:
    enyo.kind({
        name: 'fa.Stacked',
        tag: 'span',
        classes: 'fa-stack fa-lg',
        components: [
            {tag: 'i', classes: 'fa fa-circle fa-stack-2x'},
            {tag: 'i', classes: 'fa fa-flag fa-stack-1x fa-inverse'}
        ]
    });
    
Sign In or Register to comment.