website/frontend/src/components/DocShell.vue, branch design/docs-layout The site of tala.run: a Vue frontend and an ASP.NET Core API. Lay out the documentation like kotlinlang.org/docs 2026-10-18T06:00:14+00:00 Leitwolf11 2026-10-18T06:00:14+00:00 47ffd40c8b61aa9dd131e567bfb2ce78ec7f354c The three documentation pages each drew their own sidebar. The two hand-built pages listed different topics: Getting started had no link to Syntax. Each page also opened with a capitalized section kicker. DocShell now frames every documentation page: - On the left, the topics of the site, with the current one marked. On a narrow screen they fold into a Contents button above the page. - Above the page, a breadcrumb: site / Documentation / topic. - The page in a column of at most 720 px. - On the right, "On this page". It is read from the h2 headings of the rendered page, and each heading gets an id from its words in any script. It is hidden below 1100 px. - Under the page, previous and next topic cards and an "Edit this page" link to the file the page is written in. DocPage, OverviewPage and GettingStartedPage use it and drop their own sidebars and kickers. The styles of the old layout are removed. The labels are in all four languages. 
The three documentation pages each drew their own sidebar. The two hand-built
pages listed different topics: Getting started had no link to Syntax. Each page
also opened with a capitalized section kicker.

DocShell now frames every documentation page:

- On the left, the topics of the site, with the current one marked. On a
  narrow screen they fold into a Contents button above the page.
- Above the page, a breadcrumb: site / Documentation / topic.
- The page in a column of at most 720 px.
- On the right, "On this page". It is read from the h2 headings of the
  rendered page, and each heading gets an id from its words in any script.
  It is hidden below 1100 px.
- Under the page, previous and next topic cards and an "Edit this page"
  link to the file the page is written in.

DocPage, OverviewPage and GettingStartedPage use it and drop their own
sidebars and kickers. The styles of the old layout are removed. The labels
are in all four languages.