Redocly / Redocly/redoc

Method name in left hand column is rendered incorrectly in Safari for Mac

Open
#2,584 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Type: Bug
Dominant language
TypeScript
Stars
25.9k
Forks
2.4k
Avg merge
13h 10m
Merged PRs (30d)
4

Description

Describe the bug

In Safari for Mac, the method name in the left hand column is rendered too large for the background lozenge:

image

To Reproduce
Steps to reproduce the behavior:

  1. Create a valid openapi.yaml spec file
  2. Run docker run --rm -v /Users/rob/Projects/work/LaminarResearch/store/payments/spec:/spec redocly/cli build-docs -o spec.html openapi.yaml
  3. Open Safari and see error

Expected behavior

In Chrome, the method name is smaller:

image

It should look like this in Safari.

Redocly Version(s)

$ docker run --rm redocly/cli --version
1.22.0

Node.js Version(s)

Whatever is in Docker image

OS, environment

MacOS 14.6.1, Apple Silicon.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the rendering issue with the provided Docker command, then open the generated documentation in Safari on macOS and compare it with Chrome. Trace the frontend styling responsible for the method-name background lozenge; done means the method name fits the lozenge in Safari as it does in Chrome.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.