Following up from to T314670 in addition to the ToC active-section being bold, the active link should also behave in the following way.
- If the active section is a child section, and the parent section is expanded, the parent section should be black but not bold.
- If the active section is a child section, but the parent section is collapsed, the parent section should be black and bold.
Technical notes
Currently the ToC does not differentiate between active links and active sections (which can be defined as menus that contain sub-menus). In order to handle child links differently than top-level links, we might have to introduce the concept of an active section in addition to the active-link state.
An active-section class could then be appended to the active top-level section which would style it black.
Acceptance Criteria
- Add jest unit test
QA
When a top-level section of the table of contents is active:
- The section link is bold and black.
when a sub-section of the table of contents is active:
- and the section is collapsed: the parent (top-level) section link is bold and black.
- and the section is expanded: the parent (top-level) section link is black, and the active sub-section link is bold and black.
This behaviour should be verified in the following scenarios:
- When the ToC is in the sidebar
- When the ToC is in the header
- When the ToC is in the sticky-header.
- When the ToC is pinned to the edge on narrow screens.
https://phabricator.wikimedia.org/T316032#8285267
QA Results - Prod
| AC | Status | Details |
|---|---|---|
| 1 | ✅ | T316032#8285267 |
| 2 | ⬜ | T316032#8285267 |
| 3 | ✅ | T316032#8285267 |
| 4 | ✅ | T316032#8285267 |
