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

Follow-up: Align sticky header with header and update collapsed TOC in page title padding 

Visual changes:
- Sticky header padding will increase on desktop and desktop-wide viewports to match the header
- Padding on collapsed TOC button in page title is 2px wider on each side

Bug: T315261
Change-Id: I9d0df4f4d399fe120a4c1a5d2df610942cc70f02
This commit is contained in:
bwang 2022-09-02 10:57:43 -05:00 committed by Bernard Wang
parent 9ac7a23234
commit d538835b5a
2 changed files with 5 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
resources/skins.vector.styles/components/StickyHeader.less
View File

@ -18,18 +18,13 @@
background: @background-color-base;
background-color: #fffffff7;
border-bottom: @border-width-base @border-style-base @colorGray14;
// FIXME: Should this adapt to different thresholds? Ask Alex!
padding: 6px 8px 6px 10px;
justify-content: space-between;
box-sizing: border-box;
@media ( min-width: @min-width-desktop ) {
padding: 6px 25px;
max-width: @max-width-page-container + ( @padding-horizontal-page-container-desktop * 2 );
}
padding: 6px @padding-horizontal-page-container-desktop;
max-width: @max-width-page-container + ( @padding-horizontal-page-container-desktop * 2 );
@media ( min-width: @min-width-desktop-wide ) {
padding: 6px 25px;
padding: 6px @padding-horizontal-page-container-desktop-wide;
max-width: @max-width-page-container + ( @padding-horizontal-page-container-desktop-wide * 2 );
}

4
resources/skins.vector.styles/components/TableOfContentsCollapsed.less
View File

@ -9,8 +9,8 @@
float: left;
margin-right: 4px;
margin-left: -@icon-padding-md;
// Reduce padding to fit with page title
padding: 7px 10px 7px 10px;
// Reduce vertical padding to fit with page title
padding: 7px @icon-padding-md;
// Override background color for when the TOC is overlaps content
// as a sticky element when the page is scrolled down.
background-color: @background-color-base;