syntax.css breaks syntax highlighting with prism.js

[lgrn]

Hi,

I haven't used Hugo in a while, so I'm a little confused being in the middle of moving away from previously having my theme vendored in themes/ to now just importing it via go.mod in an effort to have less breaking changes in the future.

What I think I've managed to figure out so far is that placing files in assets/css allows me to override css that comes with the theme, which is nice. In trying to get code syntax highlighting to work again, I got it working by placing prism.js in assets/js, which seems to be enough for Hugo to pick it up on rendering.

I noticed though that the syntax highlighting looked odd, and after fiddling around in the dev console a bit and disabling styles manually, I realized that rules from syntax.css in the theme are overriding the styles coming from prism.css

I've managed "un-break" highlighting by creating assets/css/syntax.css containing nothing but /**/, and I'm wondering if this might be a bug, or if I'm just not using the theme as expected.

[panr]

Could you upload some screenshots showing the issue? I'm not sure if I understand the problem. syntax.css is a file with custom overrides for prism.css to match the theme color scheme and making the code highlighting more "duo-tone". So it should replace some styles from Prism.

EDIT: OK, I think that what you are trying to do is to "bring back" the original Prism highlighting, right? If so, all you need to do is to create an empty assets/css/syntax.css file to "erase" all changes from the theme. That should be enough. Maybe you will have to restart the Hugo server to apply changes.

[TaChao]

I try to "erase" all changes from the theme. But still not change any code syntax

echo "" > themes/terminal/assets/css/syntax.css
echo "" > assets/css/syntax.css

cp ~/Download/prism.css themes/terminal/assets/css/prism.css
cp ~/Download/prism.css assets/css/prism.css

hugo server -D --renderStaticToDisk  --baseURL=/ --appendPort=false