Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Text is not selectable when using highlight #63

Open
wizh opened this issue Apr 12, 2022 · 1 comment
Open

Text is not selectable when using highlight #63

wizh opened this issue Apr 12, 2022 · 1 comment

Comments

@wizh
Copy link

wizh commented Apr 12, 2022

Hello! Love the component and especially the highlight feature. However, when using the highlight prop, text becomes not selectable.

Works fine with the normal component:
image

However, I cannot select any text when highlighting a line:
image

Would be amazing to see a fix for this.

@PrimFBourdeau
Copy link

It seems the css attribute user-select is set to none in this particular use-case, causing the unexpected behavior.

If you are looking for a quick patch, you can wrap the CodeBlock element in a div with a custom class, ex: code-block, and add this CSS to your page:

.code-block span[style] {
    user-select: auto !important;
}

Ideally somebody should submit a pull request for this, since passing codeBlockStyle={{ userSelect: 'auto' }} does not work.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants