Use proper font in GoAT diagrams

[salim-b]

Summary

Font is hardcoded in Hugo's default goat code block render hook, thus we include a modifed version that uses Doks' default fonts.

Basic example

```goat
      .               .                .               .--- 1          .-- 1     / 1
     / \              |                |           .---+            .-+         +
    /   \         .---+---.         .--+--.        |   '--- 2      |   '-- 2   / \ 2
   +     +        |       |        |       |    ---+            ---+          +
  / \   / \     .-+-.   .-+-.     .+.     .+.      |   .--- 3      |   .-- 3   \ / 3
 /   \ /   \    |   |   |   |    |   |   |   |     '---+            '-+         +
 1   2 3   4    1   2   3   4    1   2   3   4         '--- 4          '-- 4     \ 4

```

Motivation

Aesthetics

To do

GoAT diagrams are awesome, I think they should be mentioned in Doks' documentation.

Checks

• Read Create a Pull Request
• Supports all screen sizes (if relevant)
• Supports both light and dark mode (if relevant)
• Passes npm run test

[h-enk]

Great!

[bigethan]

I think that this change introduces a bug with hugo create content that can be fixed by prepending a . to the with line:

 {{ with diagrams.Goat .Inner }}

should be

 {{ with .diagrams.Goat .Inner }}

without that . any time I ran hugo new content ... it'd fail with:

Error: add site dependencies: load resources: loading templates: "/Users/bigethan/Code/circus/prontosparrow.com/node_modules/@hyas/doks-core/layouts/_default/_markup/render-codeblock-goat.html:5:1": parse failed: template: _default/_markup/render-codeblock-goat.html:5: function "diagrams" not defined

Happy to put up a PR or file an issue, but also not fully sure if that's actually a fix or not first (I'm still learning hugo things)

[salim-b]

@bigethan hugo create content is not a valid Hugo command (hugo new content OTOH is).

I cannot reproduce the error you post. E.g. hugo new content blog/post-2.md creates the new MD file as supposed to.

Note that for our render-codeblock-goat.html I just copy-pasted from the original template. So I'm a bit sceptical about prepending diagrams.Goat with a dot. Did you also test whether GoAT diagrams properly render with that change?

Anyways, I don't know much about Hugo's internals incl. diagrams. So far, diagrams.Goat doesn't seem to be documented anywhere.

I would recommend to try to reproduce the issue with a minimal setup. If the problem stays the same, ask on the official Hugo forum. If you can't reproduce it outside of Doks, open a new issue here. :)

To generate a new folder my-new-site with a minimal Hugo site from built-in defaults, simply run:

hugo new theme my-new-site --themesDir .

[salim-b]

Addendum: I was curious and tested putting a dot before diagrams.Goat. It results in an error when a GoAT diagram is rendered: execute of template failed: template: _default/_markup/render-codeblock-goat.html:5:19: executing "_default/_markup/render-codeblock-goat.html" at <.diagrams.Goat>: can't evaluate field diagrams in type *codeblocks.codeBlockContext

Are you using an old version of Hugo?

[bigethan]

gah, I got my wires crossed. Doks comes with a command npm run create that links to the correct version of hugo and runs hugo new content somehow my wires got crossed and I was using my local hugo which is out of version (93) and I typed the create here (but was using the correct command in my terminal).

Thanks for talking me through this, lotsa new stuff to learn/break never quite sure what's happening yet.

[salim-b]

Yeah, hugo-installer, which Doks uses, is really not the "best of all worlds", to put it mildly. I'd recommend to use hvm instead and adapt the npm script commands in your project accordingly.

hvm registers the Hugo version to use in an .hvm text file in the project's root. Besides, hvm uses a global cache, so every Hugo version is installed only once regardless of how many projects use that version.

Thanks for talking me through this, lotsa new stuff to learn/break never quite sure what's happening yet.

You're welcome. Hugo is a really powerful tool, but generally a pain to learn, mostly due to subpar and missing documentation. I guess everyone not already proficient in Golang has +/- this same bad experience. Fortunately, the problem has been recognized by Hugo's main devs and the basics for better documentation are being laid. Especially Joe Mooring really cares and does a lot of the tedious groundwork that is needed for Hugo to become more accessible for outsiders.