Search code examples
cssextjssencha-touch-2ios-simulatorsencha-architect

IcoMoon Not loading properly

Using Sencha Architect 2 with Sencha Touch 2.2.1

I have followed this tutorial, my code is exactly the same :

https://vimeo.com/66191690

Because I'm trying to use icoMoon Icons/Font into my app.

Yet even if it compiles correctly, if i set an iconCLS to a newly include icoMoon icon name... There is nothing appearing at all.

ICONCLS is set to plane for the Projects Tab. I used the default character for the plane icon which is '!'. Didnt change anything on icomoon, it's all default properties on this font sample.

Everything

Inspector

Solution

  • The first attribute in the icon-font mixin is the font-family, and in the case of IcoMoon, that value is IcoMoon (which is set in the video.

    So your SASS file should look like this:

    @import 'sencha-touch/default';
@import 'sencha-touch/default/all';

@include icon-font('IcoMoon', inline-font-files('pictos/icomoon.woff', woff, 'pictos/icomoon.ttf', truetype, 'pictos/icomoon.svg', svg));

@include icon('plane', 't', 'IcoMoon');

    Changing the file name is fine, however changing the font-family (which is set in the font file itself) is not.