Open garretwilson opened 4 years ago
Hi!
Thanks for being part of the Font Awesome Community.
I do not see any clear drawback to use the unicode approach if that fits your use case
I think you are going to use the CSS implementation, but with the JavaScript Framework you can take advantage of the ligatures with Font Awesome: https://jsfiddle.net/tagliala/puyn0ef8/4/
I'm creating a web framework that allows declarative, semantic definitions of things like icons for pages. I would like to support several icon libraries (I personally prefer Font Awesome, but I want to support others as well) in a consistent way. Thus I'd like the user to be able to define the "type" or "class" of an icon, along with the icon itself.
For Material Icons, one can use something like
<i class="material-icons">home</i>
. Thus the "type" or "class" would bematerial-icons
, and the icon would behome
.I was looking for a way to specify this information in a consistent way with Font Awesome, but the documentation indicates I must use the class itself to identify the icon, e.g.
fas fa-home
. However I have experience with using the Font Awesome Unicode values, and with a bit of experimentation I found out I could do this:This works with variation such as "regular" (instead of "solid") as well:
To me this is much more semantic, indicating the type of icon in the HTML CSS
class
, and indicating the icon itself in the content. In addition it is consistent with the Material Icon representation<i class="material-icons">home</i>
. And especially important is that it would allow my web framework to use icons in a consistent way.My question then is whether using the representation
<i class="fas"></i>
should work just as well as<i class="fas fa-home"></i>
, and if there are any drawbacks to using the former approach. I realize that some may prefer to use the latter as it is clearer in the code which icon is intended, but that's not my question. In my framework it would be best to have consistent definitions, so I just want to make sure that using the former approach should work as well as the recommended approach.Thanks in advance for your explanation.