Conversation
Add CSS rule with vendor prefixes for user-select: none targeting the react-syntax-highlighter-line-number class. This ensures line numbers are excluded from text selection when users manually highlight code. Resolves KNO-11736 Co-authored-by: Matt Kufchak <matt.kufchak@gmail.com>
|
Cursor Agent can help with this pull request. Just |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
CodeBlock line number exclusion
Contributor
Author
|
Tested and confirmed that this update is now excluding line numbers in Safari where our current implementation does not (even though it currently works fine in Chrome) |
samseely
approved these changes
Feb 19, 2026
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
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.
Description
This PR updates the
CodeBlockcomponent styling to prevent line numbers from being included when users manually select and copy code snippets.Why:
This addresses customer feedback where manually highlighting and copying code from a
CodeBlockunexpectedly included the line numbers, especially when only a portion of the code was selected. This change improves the user experience by ensuring only the code content is copied during manual selection.How:
A CSS rule has been added to
global.csstargeting the.react-syntax-highlighter-line-numberclass withuser-select: none(including vendor prefixes). This provides a more robust and cross-browser compatible solution than relying solely on inline styles to prevent line numbers from being selected.Todos
Tasks
Screenshots
Current docs site in Safari:

With change:

Linear Issue: KNO-11736