Weird max-width for home page code example headings.
Open
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 11.8k
- Forks
- 7.9k
- Avg merge
- 1d 11h
- Merged PRs (30d)
- 11
Description
Is there a reason for max-width: 11em in the home page code headings? (this line: https://github.com/reactjs/reactjs.org/blob/master/src/components/CodeExample/CodeExample.js#L44)
"A Component Using External Plugins" is cut off into two lines when it doesn't need to be:
Especially when translated into more verbose languages, this ends up looking weird. See examples in Spanish
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start at src/components/CodeExample/CodeExample.js line 44 and inspect why the home page code example heading has max-width: 11em. Compare the English and Spanish examples shown in the issue. Done means headings no longer wrap unnecessarily, including in more verbose translations.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- documentation, frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100