Forums

Dashboard icons not working after updating to Font Awesome 5.0.6

Permalink
I'm using the Fundamental theme which comes with Font Awesome out of the box. I updated to Font Awesome 5.0.6 by grabbing the new version from the Font Awesome website and placing it in the application/css/build/vendor/font-awesome folder. The new icons are now working on the front end of my website, such as when I use the code in blocks and stuff.

I have ensured that the following code is in my themes/page_theme.php file:
$this->requireAsset('css', 'font-awesome');


The problem is, the Concrete5 dashboard is still calling upon the old Font Awesome icon code:

(such as the old)
<i class="fa fa-pencil"></i>


(instead of the new)
<i class="fas fa-pencil"></i>


My questions is, which files can I edit in order to get the dashboard to call upon the new Font Awesome installation? Thank you in advance.

2 Attachments

mehreenbaakza
 
MrKDilkington replied on at Permalink Reply
MrKDilkington
Hi mehreenbaakza,

I don't believe concrete5 supports the new version of Font Awesome. To support it, a lot of code would have to be changed.

One option would be to require the core version of Font Awesome while logged in and the new version when logged out.
mehreenbaakza replied on at Permalink Reply
mehreenbaakza
Any idea how I would approach this method? I tried the shim mnakalay suggested below. It worked on the front end, but misaligned all the icons by scooting them up 20px from the position they should be in. And on the backend, I'm still seeing rectangles in places where there should be icons. Not sure if I can get the shim to work properly.
MrKDilkington replied on at Permalink Best Answer Reply
MrKDilkington
@mehreenbaakza

There are multiple approaches to conditionally loading assets.

Here is one you can try.
- in your theme page_theme.php registerAssets() method
$currentPage = \Page::getCurrentPage();
$currentPagePermissions = new \Permissions($currentPage);
$user = new \User;
if ($currentPagePermissions->canViewToolbar() || $user->isLoggedIn()) {
    // concrete5 loads its internal copy of Font Awesome
    $this->requireAsset('css', 'font-awesome');
} else {
    // you provide a copy of Font Awesome with your theme
    $this->providesAsset('css', 'font-awesome');
}

In your theme package controller, you can register your Font Awesome asset.You will likely need to change your Font Awesome CSS @font-face src path.
"Registering an asset in a package."
https://documentation.concrete5.org/developers/assets/registering-an...
mnakalay replied on at Permalink Reply
mnakalay
the new fontawesome changed classes used but they also provide a javascript shim to ensure a smooth transition. read this to implement it:https://fontawesome.com/how-to-use/upgrading-from-4...
mehreenbaakza replied on at Permalink Reply
mehreenbaakza
Thank you both for taking the time to answer. I'm currently running Concrete 8.3.2 and looking forward to a future update with the new Font Awesome. I will try the shim for now, thanks for the suggestion!
cd13sr replied on at Permalink Reply
Has anyone had luck implementing Font Awesome 5? I'm using the shim provided but it's interfering with C5's interface somewhat. Any suggestions?
MrKDilkington replied on at Permalink Reply
MrKDilkington
@cd13sr

If you are encountering conflicts with the concrete5 UI, then I would try conditionally loading the Font Awesome 5 assets and the shim.
https://www.concrete5.org/community/forums/customizing_c5/dashboard-...
cd13sr replied on at Permalink Reply
Thanks—I did try that, however, I forgot to mention that I'm trying to use the SVG & JS version of Font Awesome 5. If I use the Web Fonts & CSS version, then it doesn't interfere.