Refactor the CSS-only solution for collapsed TOC once grid is merged. We want to maintain the existing absolute positioning based solution for grade C browsers
Although the current solution works with grid enabled, we want to update the CSS to work on larger screen sizes using grid, in order to unblock follow up work (T307901)
| Subject | Repo | Branch | Lines +/- | |
|---|---|---|---|---|
| Update CSS to allow TOC to be collapsed at larger viewports using grid | mediawiki/skins/Vector | master | +40 -19 |
| Status | Subtype | Assigned | Task | ||
|---|---|---|---|---|---|
| Resolved | ovasileva | T273473 [Epic] Improve the table of contents | |||
| Resolved | Jdlrobson | T309972 [Goal] prepare desktop improvements project for further deployment | |||
| Resolved | ovasileva | T306660 [Goal] Table of contents on narrow screens in vector-2022 | |||
| Resolved | bwang | T311447 Refactor collapsed TOC solution to use grid when supported |
Change 812371 had a related patch set uploaded (by Bernard Wang; author: Bernard Wang):
[mediawiki/skins/Vector@master] Update CSS to allow TOC to be collapsed at any viewport by adding .vector-toc-collapsed class
Originally this task was written to refactor the narrow screens TOC to use the grid, but since the grid is now disabled on lower screens for browsers that don't support CSS grid, this task was updated to only encompass updating the CSS to use the grid for collapsed TOC, essentially the prework to T307901.
This was simpler than expected, POC patch here: https://gerrit.wikimedia.org/r/c/mediawiki/skins/Vector/+/812371
From our discussion from SHDT today, we clarified that we can still use the grid for the collapsed TOC implementation so long as we maintain the existing implementation for grade c browsers.
Change 812371 merged by jenkins-bot:
[mediawiki/skins/Vector@master] Update CSS to allow TOC to be collapsed at larger viewports using grid