Topic: Some icons (fas/fab) not working on 4.6 Pro
Hello,
I'm using the latest 4.6 version.
I've noticed that the icons section has changed, but the icons are not displaying correctly (mainly fab / fas). Is there any additional setup / requirements to use these icons?
<i class="fab fa-500px"></i>
Thanks.
@Bartłomiej Malanowski This is quite an issue, as I've written previously, this affects some other aspects of the code (such as DataTables).
I've managed to fix this by copying the source code import from the "Getting Started" section:
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
Bartłomiej Malanowski staff commented 5 years ago
What are the steps to reproduce your issue?
Arye pro commented 5 years ago
There is no issue anymore, I see that the "getting started" section of the site was updated.
On Dec. 26th 2018, when I've downloaded version 4.6 of MDB, the "getting started" section was still linking to font-awesome v. 4.
Bartłomiej Malanowski staff commented 5 years ago
That's right - we've updated the getting started section and our tutorials
Fathan Fadillah free commented 3 years ago
Thanks Bruh, it works for me
And now I've noticed a far more problematic issue;
An update (or few) ago, the DataTables started rendering the sorting (arrow) icons alone. Before that, you had to add the following code line to each header cell of the table:
<i class="fa fa-sort float-left" aria-hidden="true"></i>
Now, it renders alone, and quite badly:
(https://imgur.com/xcWJlyE)
So this effectively puts default DataTables out of use, unless you're interested in showing your user a broken icon image...
I apologize for my bad english.
Faced the same problem. Icons do not work in the latest version.
From the interesting things I noticed.
https://mdbootstrap.com/docs/jquery/content/icons-usage/#basic-usage
In the example, the icon is "fa-camera-retro". If you look at the page code. Then she will call like this
<i class="fas fa-camera-retro"></i>
But if you look at this snippet (https://mdbootstrap.com/snippets/jquery/arogonov/227290), you can see that the same code does not work. And if you call the old way (I use "fa" instead of "fas") then everything works.
But this only works with old icons, and new icons cannot be called in any of the ways.
Arye pro commented 5 years ago
Hi, nice find!
This means effectively that OLD icons can be used with <i class="fa fa-{icon}"></i>, even though they have fas, fab, far etc. in the icon list.
But new icons still don't work for some reason.
Bartłomiej Malanowski staff commented 5 years ago
It's because your snippet is running on MDB 4.5.16. We've moved to FA5 in 4.6.0
arogonov pro commented 5 years ago
1. This is not my snippet :)). On the page with the instruction version 4.6.0 and click "OPEN IN MDB EDITOR" and it turns out, I get into an environment in which the latest version is not installed. This is a very strange decision.
2. I would be grateful if you would suggest why the icon does not work right here (https://iquiqui.com/testmdb/). I just downloaded the archive with the latest version again and did everything according to the instructions.
Thanks in advance for the answer!
Bartłomiej Malanowski staff commented 5 years ago
Just take a look at the 3rd line of your code - you're still using 4.7.0 instead of FA 5 ;)
arogonov pro commented 5 years ago
Hey. Thank. But I use this instruction here.
https://mdbootstrap.com/education/bootstrap/quick-start/
Where can I get the right link? On FA 5. Why is it not written anywhere, not in the instructions, or anywhere else?
Bartłomiej Malanowski staff commented 5 years ago
Our tutorial wasn't updated yet. We're sorry about that! To use FA5, please check the start page of FontAwesome: https://fontawesome.com/start
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- ForumUser: Pro
- Premium support: No
- Technology: General Bootstrap questions
- MDB Version: -
- Device: desltop
- Browser: firefox 64
- OS: ubuntu 18.4.1
- Provided sample code: Yes
- Provided link: No
Bartłomiej Malanowski staff commented 5 years ago
Does it work when you disable the Adblock? I'm asking because FA5 has some issues with Adblock: https://github.com/FortAwesome/Font-Awesome/issues/14226
Arye pro commented 5 years ago
Hi, thanks for the input. While interesting on its own, this didn't solve my problem. Also, if I'm able to see the icons on, for example, mdbootstrap.com.com via my browser with adblock, it shouldn't affect the icons differently?