* remove hljs
* rename var --hljs-bg to --code-block-bg
* bundle chroma-styles from css/includes/chroma-styles.css
* add compatibility fixes for papermod <-> chroma
* fix line-num and line padding and set width for line container to 100%
* After a lot of experimentation this compatiblity should work well
* fix inline line highlights not working
* Use catppuccin-macchiato as default theme with highlightStyle 'bg:#474733'
- hugo gen chromastyles --style catppuccin-macchiato --highlightStyle 'bg:#474733' > assets/css/includes/chroma-styles.css
According to caniuse.com only around 69% of mobile user and 22% desktop users use a browser that supports this element. Therefore this change uses text-decoration: line-through to archive the same effect across browsers.
Take this structure:
<div .highlight>
<p>
<div .highlight>
The current post-single CSS adds margin to the bottom of the paragraph
and that's it. This works great when the previous element also got the
same amount of bottom margin, however code blocks do not! The end result
looks similar to the figure above.
This commit fixes this adding top margin to elements (as needed) that come
immediately after a code block (they have the .highlight class). The
amount of top margin added is the same they already get on the bottom.
Many of the CSS files had no semicolon after the last rule in a block,
which is proper syntax, but it's annoying when adding more rules. Since
omitting the semicolons doesn't really have a benefit, I've decided to
add them.
