Odd display of Mermaid diagrams, only on Chrome

[rachellawson]

Some of our users have reported that some Mermaid diagrams are appearing "squished". We can replicate the effect, see https://govstack.gitbook.io/bb-payments/~/changes/Xne5v9hv4H1zc5wKNngM/10-workflows in Chrome but note that the same diagrams appear perfectly fine in Firefox and Safari.

Chrome:

Firefox:

Safari:

[aikoii]

Hi @rachellawson!

Thank you for reporting this, it seems like a bug.

I've captured this internally. I'll reach out via email as soon as we have more to share.

Would it be possible to ask users to use Firerox or Safari in the meantime? I understand that's not a perfect solution 🙏.

Disclaimer: Please note that this is not our official support channel. If you encounter any bugs or issues, we strongly encourage you to contact support@gitbook.com.

[rachellawson]

Thanks.

I use Safari by default, anyway (yeah, judge me if you like). I can’t predetermine what browser a public reader might use - that’s kinda the point of a website.

Looking forward to hearing about an update.

[rachellawson]

Hi,

Do we have an update on this bug? It does seem an important one for us all?

[aikoii]

Hi @rachellawson,

Thank you for your patience 🙏.

Sadly, I don't have an update to share as of yet. I've pinged our team for this!

I'll make sure to reach out via email once we have anything to share.

Thank you!

[rachellawson]

If it helps, the same mermaid diagrams displays perfectly fine in Chrome when viewed on the GitHub page - see https://github.com/GovStackWorkingGroup/bb-registration/blob/1.0-QA/spec/8-workflows.md and compare to it’s gitbook published page at https://govstack.gitbook.io/bb-registration/v/registration-1.0/8-workflows
(These will get updated soon as we might have to put in bitmaps as alternatives due to the bug)

[aikoii]

Update: This has been fixed 🎉