[4.0] add fa Regular icons back into core availability

[N6REJ]

Pull Request for Issue # .

Summary of Changes

adds back the ability to use fontawesome regular fonts into core.

Testing Instructions

go to /administrator/index.php
inspect eye.
do the same for front end login
apply pr
using the inspector, change "fas fa-eye fa-fw" to "far fa-eye fa-fw"
notice the icon changed.

Actual result BEFORE applying this Pull Request

Expected result AFTER applying this Pull Request

Documentation Changes Required

Our implementation of "Fontawesome Regular icons" is a limited 151 icon set from the 1852 icons included in their "pro" version. This is by design from FA. They don't mention that ANY regular icons are included in the free set at all on their site. Only the icons listed here are included.

[adj9]

I have tested this item ✅ successfully on 8a17b03

There is the modify in HTML.

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/31096.}

[richard67]

@adj9 How can you mark a PR with a successful test when there is a discussion on it about an obvious mistake in it?

Maybe the discussion is not visible in the issue tracker because it was a code review comment. But please always check a PR on GitHub, too, not only in the issue tracker, because only on GitHub you can see which files were changed and if there are unresolved review comments.

Thanks in advance.

[richard67]

@adj9 Please repeat your test. Thanks in advance.

[ceford]

I tested this but did not see any change in the source code and the diff only shows changes to files processed by npm.

[richard67]

@ceford As far as I understood the testing instructions, you will only see a difference if you change the code in the html markup from "fas fa-eye fa-fw" to "far fa-eye fa-fw" e.g. by manipulating the markup in your browser's developer tools or by editing the PHP file. The icon should then visibly change it's look from solid to regular.

The changes of this PR here do not change the html markup, they only change the scss and so the compiled css so that the icon still is shown when far is used instead of fas.

@N6REJ Correct me if my understanding is wrong.

[ceford]

Baffled again! I now see the eye icon change appearance in atum. But it does not make any difference whether or not I have the patch applied. This last part of the dif looks odd:

 // Backend Template stuff
 @import "../../../administrator/templates/atum/scss/mixin";
diff --git a/templates/cassiopeia/scss/template.scss b/templates/cassiopeia/scss/template.scss
index 896fb521bf09..1544b8a27a1f 100644
--- a/templates/cassiopeia/scss/template.scss
+++ b/templates/cassiopeia/scss/template.scss
@@ -14,8 +14,9 @@
 
 // "Font Awesome 5 Free"
 @import "../../../media/vendor/fontawesome-free/scss/fontawesome";
-@import "../../../media/vendor/fontawesome-free/scss/solid";
 @import "../../../media/vendor/fontawesome-free/scss/brands";
+@import "../../../media/vendor/fontawesome-free/scss/regular";
+@import "../../../media/vendor/fontawesome-free/scss/solid";
 

There is no mention of import into atum.

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/31096.}

[N6REJ]

@richard67 100% on the money
@ceford for some reason it was never removed in atum ( which turned out to be a good thing )

joomla-cms/administrator/templates/atum/scss/vendor/fontawesome-free/fontawesome.scss

Line 6 in 5813af5

@import "../../../../../../media/vendor/fontawesome-free/scss/regular";

the diff probably looks odd to you because I put the imports in alphabetical order.
which brings up that atum was NOT in proper order at all. So thanks for that.

[particthistle]

I have tested this item ✅ successfully on fb5cc3e

Swapping fas for far when inspecting code on the administrator area after applying the patch changed the icon from solid to regular as expected as the result.

Handy to know Font Awesome's Regular free icons are now included in the backend.

@N6REJ can you replicate this PR over into Cassiopeia, as seeing if it carried over to the front end didn't repeat the backend behaviour.

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/31096.}

[N6REJ]

@particthistle not sure how to do that but I can try.

[particthistle]

@particthistle not sure how to do that but I can try.

Looking at it more this afternoon it might be a little more difficult as the fonts are currently in the atum template, and not a library loading on it's own.

As mentioned though in #30793 once you know where the files are you could reference them when building a template.

[degobbis]

I have tested this item 🔴 unsuccessfully on fb5cc3e

Tested unsuccessfully with 4.0-dev after run npm run build:css
The icon far fa-eye fa-fw looks equal before and after the patch.

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/31096.}

[particthistle]

@degobbis The PR doesn't actually change the class to far fa-eye fa-fw, you need to do that with a manual code inspection.

Here's what the login page fa-eye looks like after my test...

[degobbis]

@particthistle This is exactly what I did, before and after the patch.
The icon far fa-eye fa-fw looks the same before and after the patch.

[N6REJ]

@particthistle This is exactly what I did, before and after the patch.
The icon far fa-eye fa-fw looks the same before and after the patch.

it's a VERY subtle change. if you want something more dramatic a shift use envelope.. https://fontawesome.com/icons?d=gallery&q=envelope&m=free
so, 'far fa-envelope fa-fw" & "fas fa-envelope fa-fw"

[jwaisner]

I have tested this item ✅ successfully on fb5cc3e

Confirmed after patch that changing to "far fa-eye fa-fw" on eye image results in the new eye icon. This was confirmed on front end, backend, and installation.

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/31096.}

[jwaisner]

RTC

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/31096.}