-
-
Notifications
You must be signed in to change notification settings - Fork 272
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
SyntaxHighlighter fails to color the code on atomOneDark and Docco, possibly other themes #541
Comments
Same issue here, the default styles seem to be working fine but when changing to any other theme, the background changes (and so does the main text color) but none of the code is highlighted |
Please let me know if you have found any solution. I have tried all kinds of things but none of them work. Thanks |
I have the same issue, but even the default styling doesn't work for me and was only able to make things work when using this solution from 2020 and not setting the language on
I am using Mantine for my front end, and if I put |
I have a problem regarding the styles of the component where it doesn't color the code for some themes at least.
If I add no theme, hence:
The code looks like this:
However, when adding
atomOneDark
theme fromreact-syntax-highlighter/dist/esm/styles/hljs
, so adding thestyle={atomOneDark}
prop to the<SyntaxHighlighter />
components, background seems to change:I have observed in the DOM, the html code of the highlighter when there's no theme is like this:
<span class="token" style="color: rgb(0, 119, 170);">function</span>
for each word of the code snippet provided. When adding theatomOneDark
theme though, there is no inline style with the color, so there seems to be a bug when adding the styles. Tried the docco theme and it also fails.Also, that's my component usage in the code:
I have to add that I am using the latest version of NextJS - v14.0.3 and I have tailwind. I have also tried deleting my global css but didn't change anything.
Desktop (please complete the following information):
The text was updated successfully, but these errors were encountered: