[thibaudcolas]

Description

The main menu now supports one more level of the site’s page hierarchy, and the "On this page" menu now reflects the h2 → h3 → h4 heading hierarchy as nesting.

• Main menu: the header query now includes grandchild pages (depth 5), and nested lists get a small 15px indentation so the page hierarchy reads visually. The existing annotated list template already handled arbitrary depth, so only the queryset filter and the indentation styling changed. Nothing changes for sites with two levels of pages.
• "On this page": the table of contents is generated from h2/h3/h4 with nested lists – h3 within h2, and h4 within h3. The first heading defines the top level (a page starting with h3 isn’t nested under an empty item), and a heading can only be one level deeper than the previous one, so content skipping levels (h2 to h4) still produces a well-formed list. Nested lists are indented so their icon aligns under the parent item’s text.

Worth reviewing carefully:

• TOC items are flex rows, so nested lists rely on flex-basis: 100% and flex-wrap: wrap to sit below the parent’s link. Worth checking with RTL languages and long translated heading text.
• Two styling judgement calls to confirm: nested TOC entries keep the same arrow icon and bold weight as top-level ones (hierarchy is conveyed by indentation only), and the menu nesting indent is 15px per level.

Testing

• just test – 182 backend and 21 frontend tests pass; just lint passes.
• New tests cover TOC nesting (h2/h3/h4, skipped heading levels, first heading not h2) and the header menu with a grandchild page.
• Manually verified in the dev environment: desktop and mobile menus, active item highlighting, logical (RTL-friendly) properties, and translation behaviour. Real content already uses h4 headings (e.g. "How to find your way around"), so the TOC nesting is visible on existing pages; the menu’s third level only appears once grandchild pages exist.

AI usage

• The code and this PR description were written by an AI agent (GLM 5.3, running in Conductor). The maintainer reviewed the approach and screenshots of the resulting behaviour before opening this PR; a full human review of the code is still pending.

[Copilot]

🟡 Changes recommended

Active issues cause incorrect heading nesting after level transitions and push long navigation links onto a separate line instead of wrapping beside the arrow.

2 open issues

• Update retained heading level when closing stack entries · New
• Allow long heading links to wrap beside the arrow · New

What changed in this PR

This PR extends the guide’s navigation to show a third page level and represent heading hierarchy in the “On this page” menu.

Changes:

• Includes depth-5 pages in the main menu and indents nested navigation.
• Builds nested table-of-contents lists from h2, h3, and h4 headings.
• Adds tests for deeper navigation and heading nesting, including skipped levels.

File	Description
apps/​frontend/​static_src/​scss/​components/​toc.scss	Adds indentation and flex wrapping for nested contents lists.
apps/​frontend/​static_src/​scss/​components/​navigation.scss	Indents nested main-menu lists.
apps/​core/​tests/​test_header.py	Adds coverage for a third-level menu page.
apps/​core/​tests/​test_content_page.py	Tests nested headings, skipped levels, and headings starting at h3.
apps/​core/​templatetags/​core_tags.py	Extends the header query to include depth-5 pages.
apps/​core/​models/​content.py	Generates nested contents lists from h2–h4 headings.

_{Review effort: Balanced}