Search code examples
nuxt.jsprismjs

Equals sign is always highlighted white in PrismJS

I am setting up Prism Codeblocks in my Nuxt Content Project and everything seems to be going well except that my "=" symbols have a semi-transparent white background and I cannot figure out why. I have tried different themes thinking it was an issue with my styling but even when I copy/paste themes from a repo (like this one) I still see the same thing:

enter image description here

I just downloaded the default package from Prism's website and am just using plain themes.

What might be happening here?

Solution

  • Make sure you are only using a single theme's css.

    This generally happens when you include the css file for both the default theme, as well as another theme. For example, if you have prism.min.css and prism-twilight.min.css it will cause the issue you are having. It can seem like themes build upon the default prism.min.css file, but instead, they conflict with one another.