Customize Code Highlight Colors

[dsrkafuu]

Customize Code Highlight Colors

[dsrkafuu]

The theme uses the Prism.js language auto-loader as syntax highlighter.
Prism provides several themes with background colors in code blocks.

To make the theme compatible with both light and dark mode, I removed the integrated background color and adjusted some color definitions in https://github.com/amzrk2/hugo-theme-fuji/blob/master/assets/scss/_fuji-theme/_style.scss#L132-L204

Since the main css is compiled from scss, you can copy the file you want to change from the theme folder to cover these files. For example you can use [SITEROOT]/assets/scss/_fuji-theme/_style.scss to cover the [SITEROOT]/themes/fuji/assets/scss/_fuji-theme/_style.scss then use Hugo Pipes to compile these files: https://github.com/amzrk2/hugo-theme-fuji#-advanced-configuration.

Or just fork the project, change any code you want, then npm run serve/build just like you would build your own theme.

[rrtjr]

Again thanks for the detailed info. You've been very helpful.