creativetimofficial / material-kit

Free and Open Source UI Kit for Bootstrap 5, React, Vue.js, React Native and Sketch based on Google's Material Design
https://www.creative-tim.com/product/material-kit?ref=mk-creativetimofficial-github
MIT License
5.91k stars 1.35k forks source link

[Bug] Font Awesome 5 incompatible because of prefix change from "fa" to "fas"/"fab" #184

Open kmindi opened 4 years ago

kmindi commented 4 years ago

Version

2.0.6

Reproduction link

https://example.com/sorryIhavenotputalldemofilesonjsfiddleorsimilar

Operating System

Any

Device

Any

Browser & Version

Any

Steps to reproduce

Use current Font Awesome 5 instead of deprecated 4.7 (which is the latest that is delivered by the maxcdn link currently used)

What is expected?

I would expect this great theme to follow dependency updates such as Font Awesome

What is actually happening?

No icons shown for used FA Icons in menu


Solution

https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4

E.g. use new link:

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css">
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/v4-shims.css">

better not use that v4-shim and change usages of "fa" to either "fas" or "fab" (for brand icons).

Also I guess the fonts should be stored locally/along the theme/website and no more gotten from their CDN.

Additional comments