Icomoon Glyphs in Sencha Architect ExtJs Application not working

Question

I am using Sencha Architect 3.0 for my extjs 5 application (not touch). I need to implement glyph using icomoon fonts. I am doing the following steps.

I have got icon set and its styles, already working in its demo.html page.

I have copied fonts folder and related styles in css folder under resources location, added css using Sencha Architect too.

locate correct font location in style.css also. for e.g.

@font-face {
font-family: 'icomoon';
src:url('../fonts/icomoon.eot?-lgz2n8');
src:url('../fonts/icomoon.eot?#iefix-lgz2n8') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?-lgz2n8') format('truetype'),
    url('../fonts/icomoon.woff?-lgz2n8') format('woff'),
    url('../fonts/icomoon.svg?-lgz2n8#icomoon') format('svg');
font-weight: normal;
font-style: normal;}

In style css, I have following classes for e.g.:

[class^="icon-"], [class*=" icon-"] {
font-family: 'icomoon';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;

/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.icon-2008:before {
    content: "\e600";
}

In Ext button i have set iconCls property as "icon-2008" and glyph as e600.

It shows me the glyph on button but with &#e600 in the background of button.

In Sencha CMD: sencha app refresh is just fine..

Please suggest what I am doing wrong, or what steps I should follow?

Thanks

Answer 1

I finally made this working, all the steps i followed was correct, only what I was doing wrong is setting glyph code:

I used to set Glyph code as e600@icomoon, the correct representation should be

glyph: xe600@icomoon

It should work then !!