Basic support for font awesome 5

ghost commented 6 years ago

hi, added a basic support for font awesome 5.

isometriks commented 6 years ago

Need to add a twig block: https://github.com/phiamo/MopaBootstrapBundle/blob/master/Resources/views/icons.html.twig

Looks like you'll have to change "fa" => "fas" at least for non pro stuff.

ghost commented 6 years ago

ty, taught that i have added the block. in the pro version you can use fas,fal etc, so i have removed the base fa.

isometriks commented 6 years ago

That's not right. Have you tested it to see if it works? I'm looking at the docs right now and it says only "far" and "fal" are pro. It seems like you need to have "fas" in there otherwise. And you also removed the fa- prefix for the icon names.

{% block fontawesome5 -%}
    <i class="fas fa-{{ icon }}{{ inverted ? ' fa-inverse' : '' }}"></i>
{%- endblock %}

Should be correct.

ghost commented 6 years ago

Thats why i did it without the 'fas'. You have three pro weights: "fal fa-arrow-alt-from-right" https://fontawesome.com/icons/arrow-alt-from-right?style=light

"far fa-arrow-alt-from-right" https://fontawesome.com/icons/arrow-alt-from-right?style=regular

"fas fa-arrow-alt-from-right" https://fontawesome.com/icons/arrow-alt-from-right?style=solid

and one free weight "fab fa-accessible-icon" https://fontawesome.com/icons/accessible-icon?style=brands

So there are four possible base classes:fal,far,fas,fab. How would you like me to add it? In the pro version you can use any of the three weights, thats why i have added it without the base class and the 'fa-' prefix.

I can maybe add 2 version, font awesome 5 free, and font awesome 5 pro. The free one will have the base class 'fab' and the 'fa' prefix. But for the font awesome 5 pro you will need to write those full classes when you want to add,('fas fa-arrow-alt-from-right'). Let me know how you want me to do it and ill do it this weekend.

isometriks commented 6 years ago

So, we want it to work in most cases internally. I think that doing {{ icon('fas fa-arrow-alt-from-rigth') }} is pointless, you might as well put the whole html in yourself. It's basically the same length and it doesn't abstract anything. Doing {{ icon('arrow-alt-from-right') }} could be switched to the fontawesome6 someday possibly.

I think if you want to be able to support all of these then we should add another font called "custom" or something like that, and just literally put the class name into the tag so you can type out your whole icon class. Otherwise it's much nicer to be doing stuff like {{ icon('pencil') }} which can actually be used in multiple icon fonts.

It's still always possible for somebody who really wants to customize this all to override the icon template and do as you're doing, but I guess another "custom" font would work as well.

phiamo / MopaBootstrapBundle

Basic support for font awesome 5 #1232