[4.0] Use icon to fix space in Help button

[Quy]

Pull Request for Issue #25854 .

Summary of Changes

Change the help button to use icon- instead of fa- to be consistent with the other buttons.

Actions button has the same issue. There isn't an equivalent icon for it so it will be handled in a separate PR.

Testing Instructions

Go to Content > Articles
See space at the bottom of the Help button.

Actual result

[brianteeman]

This can't be the correct solution. The entire point of using fontawesome was that it would replace the old icon- fonts and in many/most cases you will see that the icon- fonts are mapped to the fontawesome fonts.

[Quy]

Well that is not the case at the moment as icons in the toolbar except for Help and Action are icon-.

[brianteeman]

I am referring to this file
https://github.com/joomla/joomla-cms/blob/4.0-dev/build/media_source/system/scss/_icomoon.scss where most (should be all) of the icomoon fonts are mappes to fontawesome

[Quy]

So PR is fine as it and map fa-ellipsis-h to the mentioned file?

[infograf768]

We have recently found out, that although they are indeed mapped, there are differences in padding.

[brianteeman]

Then we have to fix that in css. Just changing an icon is a bandaid solution

[C-Lodder]

I'd check that the base styling .fa { ... } and .icon { ... } are the same.
To be honest, fa is still incorrect anyway as it's deprecated.

[brianteeman]

I can't replicate this issue using chrome on windows

but i can on firefox

[Quy]

Then all the other icons in the toolbar will have to be changed instead of this one only.

[C-Lodder]

@Quy The whole of core should be using fa[b|r|s] fa-xxx.
icon-xxx is only mapped for 3rd party extensions to keep B/C

[infograf768]

My experience of the issue is indeed in Firefox, not Safari for example (Macintosh)

[Quy]

Closing. It will be fixed in #27657.