Using fontawesome (fa) icons clips text or icon from the end

[asimjalis]

Describe the bug Using fontawesome (fa) icons clips text or icon from the end

To Reproduce Steps to reproduce the behavior:

1/ Paste this graph on https://mermaid.live and it renders perfectly.

graph LR
App[fa:fa-server App]
DB[fa:fa-database DB]
LLM[fa:fa-language LLM]
App --> |Schema + Query| LLM --> |SQL| App
App --> |SQL| DB
DB  --> |Data| App

2/ Save this to a file called fa-examples.mmd and then run mmdc:

mmdc --theme dark --backgroundColor transparent --scale 8 -i fa-examples.mmd -o fa-examples.png

3/ Look at fa-examples.png and it has the icons clipped.

Expected behavior mmdc should produce the same image as https://mermaid.live without the icons clipped.

Screenshots What the FA icons look like on mermaid.live

What the FA icons look like in mmdc generated PNG file.

See attached screenshots.

Desktop (please complete the following information):

• OS: MacOS 13.3.1
• Chrome version 112.0.5615.137