Restrict sticky heaader visibility

- Hide if javascript disabled.
- Hide at lower resolutions.

Bug: T289714
Change-Id: I0c669c7fc46fda7bf5055d20cc1cd54d472a9330
This commit is contained in:
Clare Ming 2021-09-03 09:55:50 -06:00
parent 7074d990a6
commit af317dbc58
2 changed files with 35 additions and 10 deletions

View file

@ -44,6 +44,22 @@ function enableCssAnimations( document ) {
* @return {void} * @return {void}
*/ */
function main( window ) { function main( window ) {
enableCssAnimations( window.document );
collapsibleTabs.init();
sidebar.init( window );
dropdownMenus();
vector.init();
initSearchLoader( document );
searchToggle();
languageButton();
stickyHeader();
}
/**
* @param {Window} window
* @return {void}
*/
function init( window ) {
var now = mw.now(); var now = mw.now();
// This is the earliest time we can run JS for users (and bucket anonymous // This is the earliest time we can run JS for users (and bucket anonymous
// users for A/B tests). // users for A/B tests).
@ -65,15 +81,15 @@ function main( window ) {
mw.track( 'timing.Vector.ready', now - window.performance.timing.navigationStart ); // milliseconds mw.track( 'timing.Vector.ready', now - window.performance.timing.navigationStart ); // milliseconds
} }
} ); } );
enableCssAnimations( window.document );
collapsibleTabs.init();
sidebar.init( window );
dropdownMenus();
$( vector.init );
initSearchLoader( document );
searchToggle();
languageButton();
stickyHeader();
} }
main( window ); init( window );
if ( document.readyState === 'interactive' || document.readyState === 'complete' ) {
main( window );
} else {
// This is needed when document.readyState === 'loading'.
document.addEventListener( 'DOMContentLoaded', function () {
main( window );
} );
}

View file

@ -26,6 +26,11 @@
padding: 6px 25px; padding: 6px 25px;
} }
// T289714 Hide the sticky header at lower resolutions.
@media ( max-width: @width-breakpoint-tablet ) {
display: none;
}
&-visible { &-visible {
transform: translateY( 0% ); transform: translateY( 0% );
} }
@ -71,3 +76,7 @@
} }
} }
} }
.client-nojs .vector-sticky-header {
display: none;
}