OpenSourceOrg / OpenSourceOrg/dotOrg
Markdown code not showing properly
Nobody has claimed this yet.
- Dominant language
- PHP
- Stars
- 12
- Forks
- 6
- Avg merge
- 13h 26m
- Merged PRs (30d)
- 12
Description
Description
The <code> CSS on the page causes problems in design on large and small screens - for example, check out this screenshot:
...and this video on mobile (causes unwanted escaping of the layout horizontally and unexpected left-right scrolling):
@karlhorky has suggested the following CSS changes to improve this design, inspired by GitHub's CSS for <code> elements:
code { font-size: 0.9em; padding: 0.15em 0.3em; border-radius: 6px; max-width: 100%; }
a code { color: var(--wp--preset--color--brand-links); text-decoration: underline; }
I added as a custom CSS for now, and would appreciate it if you could add it as a permanent fix.
Steps to reproduce
No response
What you expected to happen
No response
What actually happened
No response
Contributor guide
No contributing guide indexed for this repository
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
Inspect the stylesheet or theme CSS where the page's code elements are styled, then reproduce the layout on large and small screens using the linked screenshot and video. Apply the suggested code styling and verify that inline code fits within the viewport without unwanted horizontal scrolling.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100