Client side syntax highlighting in Hugo

There are existing docs about Hugo Syntax Highliting. They indicate that generating style sheets for syntax highlighting may be required but they don’t present a complete picture. This is an attempt to create that picture.

Changes to config.yaml

pygmentsCodefences: true
pygmentsCodefencesGuessSyntax: true
pygmentsStyle: "monokai"

Create a directory for the code highlighting css

mkdir static/css

Generate the syntax highlighting style sheet.

hugo gen chromastyles --style=monokai > static/css/syntax.css