feat(syntax-highlighter): add CSS line numbers via data-linenumbers#36
Open
sushruth wants to merge 5 commits into
Open
feat(syntax-highlighter): add CSS line numbers via data-linenumbers#36sushruth wants to merge 5 commits into
sushruth wants to merge 5 commits into
Conversation
Line count is computed as a by-product of the existing tokenizer pass
in highlightPre (no second traversal). The count is written as the
data-linenumbers attribute value; CSS ::before { content: attr(...) }
renders the number column with zero new DOM nodes injected into code.
Blocks with data-linenumbers scroll horizontally rather than wrap, so
line numbers stay aligned against long lines.
https://claude.ai/code/session_01BEjyQ3NJxxQqBqQzdWqtKY
Was inlined unnecessarily to hit a hard line limit. The limit is a guideline; 181 lines is fine. https://claude.ai/code/session_01BEjyQ3NJxxQqBqQzdWqtKY
white-space, overflow-x, and min-width are correctness constraints for line number alignment, not style preferences. !important prevents accidental CSS overrides from silently breaking number sync. https://claude.ai/code/session_01BEjyQ3NJxxQqBqQzdWqtKY
- Bump version 0.2.3 → 0.3.0 - Add CHANGELOG.md - Add data-linenumbers to file/source code blocks in docs fragments (architecture, platform-eng, product-eng, tutorials); shell commands and short concept snippets left unchanged To publish: cd toolkit/syntax-highlighter && bun run publish https://claude.ai/code/session_01BEjyQ3NJxxQqBqQzdWqtKY
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Line count is computed as a by-product of the existing tokenizer pass
in highlightPre (no second traversal). The count is written as the
data-linenumbers attribute value; CSS ::before { content: attr(...) }
renders the number column with zero new DOM nodes injected into code.
Blocks with data-linenumbers scroll horizontally rather than wrap, so
line numbers stay aligned against long lines.
https://claude.ai/code/session_01BEjyQ3NJxxQqBqQzdWqtKY