Add support for other font types

[ericcornelissen]

As per https://github.com/simple-icons/simple-icons/issues/1540#issuecomment-512744777, what are our options of adding support for .ttf, .woff, .woff2 (and other?) font types?

[cactysman]

With the icon-font-buildr output options we can supply these formats:

formats: [ // Font formats to output
    'eot',
    'ttf',
    'woff',
    'woff2'
]

[ericcornelissen]

When I try .ttf the font is not working in Chrome 75.0.3770.142 (64 bits) nor Firefox 68.0 (64-bit) nor Edge 44.18362.1.0 (Microsoft EdgeHTML 18.18362) and it looks like ⬇️ Interestingly the woff/woff2 version looks the same in Firefox (both Chrome and Edge work fine). EDIT: see #19.

When I changed the font.css file to

@font-face {
  font-family: 'Simple Icons';
  src: url(SimpleIcons.ttf) format('truetype');
}

With .eot it only works in Edge, but it's generally a fallback for Internet Explorer(?) so it would be nice to have it tested there...

@font-face {
  font-family: 'Simple Icons';
  src: url(SimpleIcons.eot);
}

[mondeja]

I've created the .eot file build, but test it is a pain... This has made me check the coverage of the other formats by the browsers:

• SVG fonts are removed in SVG2 spec, so must not be covered.
• EOT is only supported by IE.
• WOFF is supported by all browsers.
• WOFF2 is supported by all browsers except IE.
• TTF/OTF is supported by all browsers except IE, which requires that the font would be "installable". This is supported by our build system now because the param fsType defined creating the TTF file is 0 as is required by IE, so our TFF file is "installable".

Since EOT is only supported by IE, and IE can use WOFF and TTF as fallbacks, my question is: we really need EOT?

[ericcornelissen]

Regarding TTF/OTF, what is your view on adding OTF in addition to TTF @mondeja? (I'm not super familiar with the ins and outs of the different font formats...)

Since EOT is only supported by IE, and IE can use WOFF and TTF as fallbacks, my question is: we really need EOT?

If it is too much effort for now, I'm fine with not supporting it, this can always be revisited at a later point at the request of a package user. (and luckily the likelyhood of that happening will only ever decrease :smile:)

is supported by all browsers except IE, which requires that the font would be "installable". This is supported by our build system now because the param fsType defined creating the TTF file is 0 as is required by IE, so our TFF file is "installable".

Not sure if that means it works if it can be installed, or if it has to be installed before it can be used. Either way, that doesn't change my opinion on adding an EOT version of the font already.

[mondeja]

Regarding TTF/OTF, what is your view on adding OTF in addition to TTF @mondeja?

I've not found any utility available to generate the font in OTF format, but if someone found one, please share here, I would also like to add it.

If it is too much effort for now, I'm fine with not supporting it, this can always be revisited at a later point at the request of a package user.

It's easy to create it using this, but make sure that works manually using IE... :man_facepalming: If someone really wants it, someone wants to help with this or if we add tests, I suppose that could be worth, but for now I think not.

[ericcornelissen]

Okay, thanks for figuring this all out @mondeja. I propose we 1) create a new issue for an OTF version of the font with the help wanted label and 2) ignore OET for now, unless a package users requests it in which case we can ask them for help testing it, and 3) close this issue to keep things organized. Agreed?

[mondeja]

Perfect :sparkles: