11ty / 11ty/docs

Always visible table of contents navigation

Open
#1,791 0 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
Nunjucks
Stars
547
Forks
726
Avg merge
2h 23m
Merged PRs (30d)
3

Description

This is expanding on an idea proposed to Zach on Mastodon

It would be helpful if the side navigation (table of contents) was always visible on the screen, even when scrolling down a long page. The navigation could have its own scroll, so that when large sections are opened (like Guide), the reader could scroll the nav or main body independently, thus keeping the context of the other section. This would be useful when reading about one thing, but wanting to see what related pages there may be. Or when trying to find the right page, skimming down the main body while not changing the position of the nav, therefore allowing you to move to the next page if you don't find what you need.

Additionally, a small amount of JS could be used to scroll the navigation on page load so that the reader's previous position is restored. This will further help them keep context as they move through the docs looking for information. I can see this being done either either heading data or just tracking scroll positions.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

No files or tests are named in the issue. Start by locating the documentation site's side-navigation and page-layout entry points, then review how navigation state is currently handled. Done should provide persistent table-of-contents visibility, independent navigation and page scrolling, and restoration of the navigation position when a page loads.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
documentation, frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.