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.

Sign up for GitHub

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

Jump to bottom

Mermaid Diagram labels are clipped on Safari #187

Closed
seshrs opened this issue Jul 4, 2022 · 0 comments · Fixed by #188
Closed

Mermaid Diagram labels are clipped on Safari #187

seshrs opened this issue Jul 4, 2022 · 0 comments · Fixed by #188
Labels
bug Something isn't working
Milestone
FA 2022

Comments

@seshrs
Copy link
Member

seshrs commented Jul 4, 2022

Describe the bug
When loading a Mermaid flowchart with long words in Safari, the labels sometimes appear clipped. Refreshing the page fixes the issue.

To Reproduce
Steps to reproduce the behavior:

  1. Go to https://preview.sesh.rs/previews/eecs485staff/primer-spec/develop-preview/demo/diagrams.html#fontawesome-icons
  2. Observe that the text labels, for instance, 'Forbidden', are not displayed fully.

Screen recording
In this video, I visit https://preview.sesh.rs/previews/eecs485staff/primer-spec/develop-preview/demo/diagrams.html#fontawesome-icons on Safari on MacOS. Notice that the labels are clipped. After refreshing the page, the labels are fixed.

Screen.Recording.2022-07-04.at.5.04.39.PM.mov

Desktop:

  • Browser: Safari (MacOS and iOS)

Acknowledgements:
@jamesjuett first reported this issue in https://github.com/eecs280staff/p2-cv/pull/158#issuecomment-1122680221
@seshrs seshrs added the bug Something isn't working label Jul 4, 2022
@seshrs seshrs mentioned this issue Jul 4, 2022
Merged
@seshrs seshrs closed this as completed Jul 4, 2022
@seshrs seshrs added this to the FA 2022 milestone Jul 4, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working
Projects
None yet
Milestone
FA 2022
Development

Successfully merging a pull request may close this issue.

Re-render Mermaid diagrams on window load eecs485staff/primer-spec
1 participant
@seshrs