Open Ericky14 opened 7 years ago
Are you sure that ink-icons
name in font-family: ink-icons
is exactly the same as the name of the font? Double-click the ttf file, install it on your system, and make sure the name is not fontello
for instance.
Yes, it installed under the name 'ink-icons' regular.
I just realized that if I do <Label class="icon" [text]="'\ue800'"></Label>
instead of using the fonticon pipe, it works. Using the pipe nothing shows up.
Can you try something?
icon
class to ink
.icon-
classes in ink-icons
to .ink-
<Label class="ink" [text]="'ink-gplus' | fonticon"></Label>
TNSFontIconModule.forRoot({ 'ink': './styles/ink-icons.css' });
I did all that, and the same thing happens. Switching 'ink-gplus' | fonticon
for the code '\uf30f'
works.
ok, perhaps it's a problem with fontello then.. my icomoon font works just fine..
@Ericky14 I dont know if you fixed your problem or not but i just had a similar problem. Check if in the font's css file is ':: before' or ': before'. In my case originally was :: i changed it to single : and anythink works fine for me :)
@kamil-borecki do you have a working prototype? Trying to integrate icon moon but is failing
Another thing to try is to make sure your font icon CSS code references use double quotes, not single.
LIKE THIS: .icon-alert:before { content: "\e801"; }
NOT THIS: .icon-alert:before { content: '\e801'; }
As this might conflict with the single quotes used in the text attribute, for example:
[text]="'icon-alert' | fonticon"
I successfully was able to integrate and use font-awesome with this plugin, but I'm having trouble integrating a custom font from fontello. The font won't show. Steps I took:
I put the ttl file in the fonts/ folder. Called
TNSFontIconModule.forRoot({ 'icon': './styles/ink-icons.css' });
Created this in app.cssAnd I used this element
<Label class="icon" [text]="'icon-download' | fonticon"></Label>
I even turned on debugger and the mapping is mapping something at least it seems, but the terminal does not show the right icons.
Is it something wrong with the ttl or css files? It works for browsers, so I'm not sure it could be that.