NotionX / NotionX/react-notion-x
Toggle Heading Width causing misalignment on smaller screens
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 5.4k
- Forks
- 645
- PR merge metrics
- No merged PRs in 30d
Description
Description
Toggle Header just a bit larger than an iPhone 14mini width. The toggle header, returns to the line after the icon causing it to be misaligned. Icon could be absolute, and/or the title should either ellipsis, or the first line should at least remain inline with the toggle icon.
Notion Test Page ID
https://react-notion-x-demo.transitivebullsh.it/5995506f2c564d81956aa38711e12337
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 by reproducing the issue on the linked Notion test page at an iPhone 14 mini-sized viewport, focusing on the toggle heading shown in the attached screenshot. Trace the toggle heading rendering from there; done means the heading remains aligned with its icon without wrapping awkwardly at that width.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100