Small Issues with Font Awesome Inline Icons [SOLVED]

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
7 messages Options
Reply | Threaded
Open this post in threaded view
|

Small Issues with Font Awesome Inline Icons [SOLVED]

TheMagician
This post was updated on .
I've noticed some strange behavior when using Font Awesome inline icons.

1) Some icons get mirrored horizontally.
The icon "ambulance" for example is shown driving to the right on Font Awesome. However, as an inline icon in the HTML output it drives to the left. (by the way, in ASCIIDoctor-PDF's output the ambulance drives to the right, as expected).

2) Some icons don't show
I could not yet find a rule to this behavior but some of the icons just don't show on the HTML page (even though the code is embedded correctly in the HTML source).
Working: bullseye, bullhorn, comments
Not Working: mail-bulk, comments-dollar, lightbulb
It seems to me like all the icons that have a hyphen in their name don't show. However, the lightbulb is written without a hyphen and still doesn't show so I'm not sure what the pattern is here.
Reply | Threaded
Open this post in threaded view
|

Re: Small Issues with Font Awesome Inline Icons

mojavelinux
Administrator
Keep in mind the HTML converter uses Font Awesome 4, not Font Awesome 5.


Asciidoctor PDF uses Font Awesome 5 with shims for Font Awesome 4.

The switch to Font Awesome 5 in the HTML converter is very breaking, so we cannot do it before Asciidoctor 3.

-Dan

On Thu, Oct 10, 2019 at 3:10 AM TheMagician [via Asciidoctor :: Discussion] <[hidden email]> wrote:
I've noticed some strange behavior when using Font Awesome inline icons.

1) Some icons get mirrored horizontally.
The icon "ambulance" for example is shown driving to the right on Font Awesome. However, as an inline icon in the HTML output it drives to the left. (by the way, in ASCIIDoctor-PDF's output the ambulance drives to the right, as expected).

2) Some icons don't show
I could not yet find a rule to this behavior but some of the icons just don't show on the HTML page (even though the code is embedded correctly in the HTML source).
Working: bullseye, bullhorn, comments
Not Working: mail-bulk, comments-dollar, lightbulb
It seems to me like all the icons that have a hyphen in their name don't show. However, the lightbulb is written without a hyphen and still doesn't show so I'm not sure what the pattern is here.



If you reply to this email, your message will be added to the discussion below:
https://discuss.asciidoctor.org/Small-Issues-with-Font-Awesome-Inline-Icons-tp7211.html
To start a new topic under Asciidoctor :: Discussion, email [hidden email]
To unsubscribe from Asciidoctor :: Discussion, click here.
NAML


--
Dan Allen | @mojavelinux | https://twitter.com/mojavelinux
Reply | Threaded
Open this post in threaded view
|

Re: Small Issues with Font Awesome Inline Icons

TheMagician
That explains it. Thank you!

Perhaps the third paragraph of chapter 45 of the manual could be changed to:

Alternatively, you can have Asciidoctor “draw” icons using the Font Awesome 4.7 font-based icon set.
Reply | Threaded
Open this post in threaded view
|

Re: Small Issues with Font Awesome Inline Icons

mojavelinux
Administrator
Indeed. If you'd like to propose that change, I'll merge it in.

Best,

-Dan

On Thu, Oct 10, 2019 at 5:57 PM TheMagician [via Asciidoctor :: Discussion] <[hidden email]> wrote:
That explains it. Thank you!

Perhaps the third paragraph of chapter 45 of the manual could be changed to:

Alternatively, you can have Asciidoctor “draw” icons using the Font Awesome 4.7 font-based icon set.


If you reply to this email, your message will be added to the discussion below:
https://discuss.asciidoctor.org/Small-Issues-with-Font-Awesome-Inline-Icons-tp7211p7216.html
To start a new topic under Asciidoctor :: Discussion, email [hidden email]
To unsubscribe from Asciidoctor :: Discussion, click here.
NAML


--
Dan Allen | @mojavelinux | https://twitter.com/mojavelinux
Reply | Threaded
Open this post in threaded view
|

Re: Small Issues with Font Awesome Inline Icons

Tobi
Is there an option to pass on the style (such as far or fas) within an adoc file at the moment?
Reply | Threaded
Open this post in threaded view
|

Re: Small Issues with Font Awesome Inline Icons

Alexander Schwartz
The current HTML5 output uses FontAwesome 4.7

The far/fas style was added in FontAwesome 5 AFAIK

You can follow the discussion on upgrading AsciiDoctor to FontAwesome 5 on GitHub.

So the answer to your question is "no" considering out-of-the-box options.

There is always the chance of pass-through content (with the caveat mixing HTML with AsciiDoc and making the result less maintainable) or writing an extension of an inline macro that supports FA 5.

Alexander Schwartz (alexander.schwartz@gmx.net)
https://www.ahus1.de
Reply | Threaded
Open this post in threaded view
|

Re: Small Issues with Font Awesome Inline Icons

Tobi
Thank you, Alexander! I got this now.