Why are we doing this?
Feedback from users suggests that it is hard to re-find a specific line in the editing interface. Many code editors include line numbers to alleviate this issue and we would like to adopt this approach as well.
User story
As an editor on the iOS app I would like to be able to easily find my place in the editing interface.
Suggested features
- Show/hide line numbers with syntax highlighting
- Collapse templates by tapping on an indicator in the line number area
Stretch features
- Syntax error indication from the line number
- 'Ask for help'
Mocks
| Example of line numbers with template extended | Example of line numbers with template condensed |
|---|---|
 |  |
| Zeplin: https://zpl.io/bz1KPEG | https://zpl.io/boZwWxo |
Design details
- Line breaks are represented by a sequential number
- At the start of a template a chevron is shown, tapping on the line number collapses the template. Tapping on the number again re-exposes the template
- If a template is embedded within a line with non-template text the non-template text should remain exposed, which may mean that the tail end of the template is still expanded when the rest of the template is collapsed
On the line where the cursor is present, the line number indicator should be presented in blue and bolded- The start of each section should be denoted with the line number '1'
