Support dark and light custom code highlight themes

[obilodeau]

Is your feature request related to a problem? Please describe.

The default monokai theme is outdated. For example, a diff code fence does not syntax highlight with this theme right now.

If I generate a new theme CSS by following this I get diff support but now the light theme (or the dark theme) is not appropriate for a given theme.

It would be nice to be able to provide both a light and dark theme syntax highlight theme.

Describe the solution you'd like

Something integrated that would generate the right CSS, like this in hugo.toml:

syntaxStyleLight = "solarized-light"
syntaxStyleDark = "monokai"

Workaround

This script and config works in the meantime.

Script:

#!/bin/bash
#
echo -e ":root {\n" > assets/css/syntax-light.css
hugo gen chromastyles --style=solarized-light >> assets/css/syntax-light.css
echo "}" >> assets/css/syntax-light.css

echo -e ":root.theme--dark {\n" > assets/css/syntax-dark.css
hugo gen chromastyles --style=monokai >> assets/css/syntax-dark.css
echo "}" >> assets/css/syntax-light.css

Config:

customCss = ["css/syntax-light.css", "css/syntax-dark.css"]

[lxndrblz]

@obilodeau Thanks for your explanation. Feel free to send a PR if you got it working.