Code example displays incorrectly when JavaScript is unavailable

[colinkiama]

The code example relies on prism.js for formatting and highlighting. When it's not available, here's what the home page looks like:

If a fix can't be found, the code example should be hidden and the global header should have the "diagonal slice" effect when JavaScript is off.

[naipotato]

Uh, this is too far from what I expected. In the previous version of the site, when JavaScript was not available, the code simply lost its highlighting, it didn't break the layout.

[pervoj]

We can make the highlighting done with Zola. I've already done something similar on my website: https://github.com/pervoj/website/tree/main/syntaxes

It needs to add a line to Zola config: https://github.com/pervoj/website/blob/main/config.toml#L15

[colinkiama]

Uh, this is too far from what I expected. In the previous version of the site, when JavaScript was not available, the code simply lost its highlighting, it didn't break the layout.

Yeah, there's probably something wrong with the way I implemented it then.

[colinkiama]

We can make the highlighting done with Zola. I've already did something similar on my website: https://github.com/pervoj/website/tree/main/syntaxes

It needs to add a line to Zola config: https://github.com/pervoj/website/blob/main/config.toml#L15

Is there a page on your website there is a Vala code block?

[pervoj]

We can make the highlighting done with Zola. I've already did something similar on my website: https://github.com/pervoj/website/tree/main/syntaxes

It needs to add a line to Zola config: https://github.com/pervoj/website/blob/main/config.toml#L15

Is there a page on your website there is a Vala code block?

Currently not, but it's just syntax highlighter copied from the Vala Sublime Text plugin. It uses the Zola higlight theme.

[pervoj]

I found out one thing: Zola supports highlighting only in .md files.

[colinkiama]

If loaded markdown content was passed through the markdown filter would the highlighting still work?

It also looks from the syntax_highlighting docs, highlight_themes_css will allow us to continue using a separate light and dark theme for syntax highlighting.