Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Integrate Font Awesome to support the font-based icon mode in AsciiDoc and for general use #25

Open
mojavelinux opened this issue Dec 9, 2020 · 3 comments
Assignees

Comments

@mojavelinux
Copy link
Member

Integrate Font Awesome to support the font-based icon mode in AsciiDoc (e.g., admonition icons, checklist marker icons, menu separators, etc). Also integrate it for general use in the UI, such as for brand icons and possibly other embellishments.

Even though Asciidoctor does not yet integrate with Font Awesome 5, we should be forward looking and use it for this purpose. The Antora build gives us that opportunity. We'll need to apply whatever patches and workarounds are necessary.

There are three possible ways to integrate Font Awesome 5:

  • fonts
  • SVG with JS
  • SVG files

We should explore each route and determine which provides the best balance between flexibility, complexity of build, and performance.

mojavelinux added a commit to mojavelinux/asciidoctor-docs-ui that referenced this issue Dec 9, 2020
@mojavelinux
Copy link
Member Author

One open question is whether to support the icon macro in AsciiDoc. If we want to, we need to load the v4 shims (~15K when using the SVG with JS approach). (And to get the shims requires pulling the main Font Awesome package into the build, which is hefty).

I think we should start out without the v4 shims and either add them in later if we decide we need them, or add in our own shim mapping for icons we want to be able to use.

@mojavelinux
Copy link
Member Author

The downside to the SVG with JS approach is that there's a slight delay before the icons appear since they are swapped in by JavaScript that loads at the bottom of the page. It's possible this could be moved up and run async, though that can delay the execution of other JavaScript.

@mojavelinux
Copy link
Member Author

I'm going to split this up. I have figured out a way to selectively get the icon macro to work (see #26), but it's a pretty substantial change. I don't love that approach for built-in icons since it fills in the icons after the page loads. So what I'd like to do is decouple the built-in icons from the user icons. For the built-in icons, I'd like to use octicons since it's a much smaller library and gives us exactly what we need. See #49. This PR should focus on user icons specified using the icon macro.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant