== Background
This will be the first part of setting up the new, persistent version of the table of contents
- [[ https://www.mediawiki.org/wiki/Reading/Web/Desktop_Improvements/Repository/Sticky_Header_and_Table_of_Contents_User_Testing | Objectives and research ]]
- Design prototypes [[ https://di-toc-phase2.web.app/Hokusai | 1 ]], [[https://di-toc-collapsible-sections.web.app/Aretha_Franklin | 2 ]] [[ https://di-toc-phase2.web.app/Hydrogen | 3 ]] (for design experimentation)
- [[ https://en-toc.wmcloud.org/wiki/Main_Page | User testing prototype ]] (shown to end-users)
- User testing prototype results
== Initial feature set
==== ToC visual design
{F34909394, layout=left, float, width=200}
| element | Less CSS token
|-----------|--------
| border style | `@border-base`
| border radius | `@border-radius-base`
| background color | `@background-color-base`
| Heading font size | `@font-size-heading-3` (Vector)
| Link font size | `@font-size-base` (Vector)
| Top-level link color | `@color-primary`
| Sub-level link color | `@color-base`
| Sub-level indentation | `8px`
//Tokens are taken from wikimedia-ui-base unless specified otherwise.//
---
==== Modified layout to accommodate new ToC
|{F34909384, width=400} | {F34909387, width=400}
| current sidebar, 11.5em wide, grey background | new sidebar, white background, ~14.5em wide
- The sidebar area will have to be widened to fit the longer text of the new ToC.
- The sidebar background colour should be changed to transparent to improve the transition between the ToC and sidebar.
Note: Mobile/narrow layout is TBD.
==== Open and closed states
The sidebar area should switch between showing the sidebar menu and the new table of contents.
| {F34909412, width=500} | {F34909406, width=500}
| sidebar open | sidebar closed
==== Accessibility & semantic considerations
- The new ToC should be accessible via keyboards and assistive technologies.
- In the accessibility tree, the ToC should be a labeled as a navigational landmark
- It should be a <nav> element
==== Back-end (presentation) Logic
When determining whether or not to show the new ToC, the same rules that govern the current ToC should be applied. If the ToC is currently hidden via magic words like `__NOTOC__` or by other means, it should remain hidden in this update.
With the work done in T287767, it's now possible to render the table of contents outside the parser content area via mustache templates.
At this stage the feature should be feature-flagged and off by default.
== Acceptance criteria
[] Allow the table of contents to appear persistently on the left side of the page
[] Allow the table of contents to contain links that navigate to the corresponding section within the ToC
NOTE: this tasks assumes that all sections within the ToC are uncollapsed.