jonny
/
Vector-Local
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Layout: restore sticky toc behavior by adding additional TOC container 

Fix sticky behavior changed by impacted by e23fc1f

Change-Id: I7ead5e1d5954f772a533e1116f8c55d2d9cfd143
This commit is contained in:
bwang 2022-06-30 14:00:50 -05:00 committed by Jdlrobson
parent 615181154c
commit 3a26cc220c
2 changed files with 16 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
includes/templates/TableOfContentsContainer.mustache
View File

@ -1,3 +1,8 @@
<div class="mw-table-of-contents-container mw-sticky-header-element">
{{#data-toc}}{{>TableOfContents}}{{/data-toc}}
{{! Grid element, spans full height }}
<div class="mw-table-of-contents-container">
{{! Sticky element, aligned with top of viewport }}
<div class="sticky-toc-container mw-sticky-header-element">
{{! TOC element, applies additional margins for spacing }}
{{#data-toc}}{{>TableOfContents}}{{/data-toc}}
</div>
</div>

13
resources/skins.vector.styles/layouts/screen.less
View File

@ -195,7 +195,7 @@ body {
}
}
.mw-table-of-contents-container {
.mixin-sticky-toc() {
// stylelint-disable-next-line plugin/no-unsupported-browser-features
position: sticky;
float: left;
@ -203,13 +203,18 @@ body {
// ensuring the TOC is 1.5em (24px) from the top of the viewport
// unless .mw-sticky-header-element overrides it.
top: ~'calc( 1.5em - @{top-margin-sidebar-toc_title_inline} )';
}
.vector-layout-legacy .mw-table-of-contents-container {
.mixin-sticky-toc();
clear: both;
@{selector-workspace-container-sidebar-open} & {
top: 0;
}
}
.vector-layout-legacy & {
clear: both;
}
.sticky-toc-container {
.mixin-sticky-toc();
}
.parsoid-body {