Add support up to 3 levels deep left submenu

[khos2ow]

Add support up to 3 levels deep for submenu:

H1
    H2
    H2
        H3
        H3
    H2
H1
    H2
...

maxMenuDepth is added to parameters which is optional and defaults to 2 if empty or not found. This will control the depth for submenu items to be rendered for left menu table of contents.

Fixes #37

[bep]

@khos2ow there were some expired access tokens in Netlify, refreshed them now. I also updated the Hugo version in netlify.toml in the main branch, so you may want to trigger a new build by rebasing this branch.

[khos2ow]

Thanks @bep, rebased. So this should be good to review and decide what to do to fix misalignment of h3 items.

I can think of two routes, 1) submit a patch upstream to Slate or 2) just add the rule here. Which I think later would be better since adding only a css rule upstream without underlying markup for it feels a bit weird (unless they would like to extend the functionality upstream too).

[khos2ow]

Something like 0224828 would do it. Please let me know how you'd like to move forward with this.

.toc-wrapper .toc-h3 {
  padding-left: 50px;
  font-size: 12px;
}

[bep]

The CSS is fine.

But with the example used there is a bug (not a new one) that we need to fix. If you

• Go to Kittens and click on the second "HTTP Request" you are taken to the first one
• So, we need a way to make the IDs unique.
• We should probably try to avoid breaking existing URLs, so I suggest that we put the IDs into a map (see newScratch) and if it's been used before, we append a -1 counter to it.

[khos2ow]

I also noticed that issue! Appending a sequence would definitely solve it, but feels a bit counterintuitive. Alternatively h3 ID can be constructed as <h2_id>-<h3_id>.

Admittedly it's a bit longer than usual, but it's very precise (even to be used as a permalink)

[khos2ow]

Something like 2b63b49, which will enable URLs like:

• https://deploy-preview-63--docuapi.netlify.app/#get-all-kittens-http-request
• https://deploy-preview-63--docuapi.netlify.app/#get-a-specific-kitten-http-request

If you are ok with this approach I'll clean it up a bit and move it out of baseof.html!

[bep]

So,

• A concat of the titles will still not be guaranteed uniq (but likely)
• We want to preserve backwards compability if possible

But I think that particular problem is not part of this particular problem. I you could revert this PR to its last state (e.g. with the duplicate PRs) then I will merge and handle the above issue.

[khos2ow]

We want to preserve backwards compability if possible

I wanted to point out that this PR, as it stands even with id concatination, is backward compatible. Everything is tied to maxMenuDepth (even when it doesn't exist, when upgrade theme on an existing project.)

But regardless, I agree that fixing duplicate issue spans beyond this PR (as it can realistically happen even on h1 and h2 level as well).

~That said, do you want me to cleanup commits in this PR or are you going to squash and merge?~ I reverted concatination commit and squashed the rest.

[zyxep]

I've tried it on my content. And i can't seem to get the proper indentations. what is the trick?

Inside /content folder I have a index.md with an introduction, at the top a # . then I have a folder called for example: /content/apis where inside that folder there is a bunch of .md files.

Are there anything in the .md files i need to be observant about?

[bep]

I merged this manually. Thanks for this.