understrap / understrap-child

The starter child theme for Understrap, the renowned open-source WordPress starter theme.
GNU General Public License v3.0
581 stars 331 forks source link

Fontawesome 4 conflicts with Fontawesome 5 #126

Closed lilpxl closed 6 years ago

lilpxl commented 6 years ago

First of all, thank you for this amazing tool... it is super helpful and I appreciate it A LOT!

One thing I have run into is conflicts with Fontawesome 4 and 5. With both CSS files being referenced some of the FA4 stuff was overriding FA5

I "solved" it by commenting out the Fontawesome 4 SCSS import in the "assets" folder and installing Fontawesome 5 along with my other "custom" fonts in a separate folder (I haven't included the CSS in the gulpfile as I am not super saavy and its no big deal), which I will have to remember to do if I updated the child theme.

Not sure if eventually FA5 will be included in the Bootstrap defaults (and how "FA5 Pro" users will need to further implement beyond the "FA5 Free" implementation). Just a heads up for anyone who has a similar issue.

axlright commented 6 years ago

Nice one @jaredsnider! I've also replaced FontAwesome4 with FontAwesome5 in all my projects. I removed references to the @include for FontAwesome4 and in fact removed all the .scss and font files for FontAwesome4.

I'd love to be smart enough to figure out how to fully remove FontAwesome4 from the npm install workflow as I have to manually delete all the FontAwesome4 .scss and font files every time I update the child theme. But alas, I'm not that smart so I just manually remove them all.

IngoVals commented 6 years ago

Problem with the npm workflow is that FA 5 isn't available as a npm package yet. I'm assuming it is only available to backers as of now.

I would try this, after a gulp copy-assets is ran ( does so after npm install for example ) you need to replace the /src/sass/fontawesome sass files with the ones from version 5.

Now the question is how compatible is version 4 and 5. If the sass files have the same names it should work fine. I they have changed you would need to update the /sass/assets/font-awesome.scss accordingly.

axlright commented 6 years ago

@IngoVals Please refer to issue 574 in the parent theme repo issues tracker: https://github.com/understrap/understrap/issues/547

Unless you have issues here that aren't answered there, I'll close this ticket to not have duplicates. Yes, different repository but similar issue. Thanks!

justme101 commented 6 years ago

4 and 5 are different as far as naming and styles. .fab is being used in place of .fa for some of the icons

axlright commented 6 years ago

Closing this issue as it's being tracked in the parent theme repo issue 574: understrap/understrap#547