stencila/designa

Component for table of contents

Opened this issue · 3 comments

It would be useful, particularly for long documents, to have a table of contents generated based on the heading structure of the HTML document. The main requirements for this:

  • able to build a TOC from h1, h2 etc tags alone
  • easily able to be styled to fit with the theme it is applied within
  • indicates the current section the document the viewport is in
  • light weight

A good, pre-existing solution appears to be https://tscanlin.github.io/tocbot/. We should probably use that, at least to start with.

After discussion with @jwijay and @alex-ketch I've moved this from thema to here. This component will still be used in thema (in the stencila theme, and possibly others).

I'd like to put this and #11 as highest priority for design and development because they are needed for the documentation that we are generating for encoda and other repos (which use the stencila theme).

Some inspo for this from HackMD. I like it's combination of minimalism, interactivity (tells you where you are), responsiveness (only appears on wide screens) and utility (Back to top etc).

Peek 2019-07-05 10-55