icons8 / line-awesome

Replace Font Awesome with modern line icons
https://icons8.com/line-awesome
Other
1.25k stars 140 forks source link

CSS Pseudo-elements broken after upgrading to 1.3.0 #27

Closed travisbotello closed 4 years ago

travisbotello commented 4 years ago

After upgrading from 1.1.0 to 1.3.0 my pseudo-elements are broken, e.g.

.menu-sec nav > ul > li.menu-item-has-children > a::before {
    content: "\f107";
    font-family: lineawesome;
}

Also tried font-family: 'Line Awesome Free'

Am I missing something here?

travisbotello commented 4 years ago

font-family: 'Line Awesome Free' is correct but you also have to add font-weight: 900;.

aboodz commented 4 years ago

I think it's a bug. I checked the font files. Only font files with weight 900 have all the glyphs. Fonts with weight 400 files contain 146 glyphs only.

travisbotello commented 4 years ago

Good point! In the meantime font-weight: 900; can be used for bypassing this issue.

hssamconf commented 4 years ago

font-weight: 900; doesn't work for me

travisbotello commented 4 years ago

Are you using the correct unicode for the content property? The codes also changed in the newest version. Also make sure that you are using font-family: "Line Awesome Free";. This is a working example for a dropdown indicator I am using with the newest version:


li.menu-item-has-children > a::before {
    position: absolute;
    right: 0px;
    width: 10px;
    height: 10px;
    content: "\f107";
    font-family: "Line Awesome Free";
    font-weight: 900;
    font-size: 10px;
    top: 50%;
    margin-top: -4px;
}
hssamconf commented 4 years ago

yes the unicode of the right arrow changed from 1.1.0 to 1.3.0 thanks that fix it

fatawesome commented 4 years ago

Sorry for late answer. This behavior is the result of upgrading to new version. Hopefully everything is ok for you now :)