From 507aa454620f234c97374f03bd853ab150c8f403 Mon Sep 17 00:00:00 2001 From: Lae <30905719+mlaetitia@users.noreply.github.com> Date: Wed, 28 Oct 2026 17:03:20 +0000 Subject: [PATCH] Bring the full-size logo back on an upward scroll on mobile #240 merged the mobile and desktop scroll paths into one absolute threshold, which dropped the behaviour production has below 785px: the full-size logo returns on any upward scroll rather than only at the top of the page. The partner asked for production's behaviour to be kept. Three cases could leave the logo stuck small. The handler runs once per animation frame, so a single frame can swallow a whole flick, and recording the turning point where the frame landed rather than at the peak it turned from made the restore unreachable after a back-to-top jump, a hard flick up from just below the fold, or iOS overscroll reporting a negative position. It now records the peak, clamps the position at zero, and clears the peak on the wide path so a rotation cannot carry a stale one. matchMedia replaces the innerWidth read, so crossing 784px re-decides instead of waiting for the next scroll event. No CSS changed. The bar keeps its height at every width, so the logo row and the menu button stay where they are. Co-Authored-By: Claude Opus 5 (1M context) Claude-Session: https://claude.ai/code/session_011rCHPCdbV5C5dDJjEmMDuy --- themes/osi/assets/js/build/theme.asset.php | 2 +- themes/osi/assets/js/build/theme.js | 2 +- .../osi/assets/js/src/theme/header-resize.js | 42 ++++++++++++++++--- 3 files changed, 39 insertions(+), 7 deletions(-) diff --git a/themes/osi/assets/js/build/theme.asset.php b/themes/osi/assets/js/build/theme.asset.php index 51e8c76..02eeb27 100644 --- a/themes/osi/assets/js/build/theme.asset.php +++ b/themes/osi/assets/js/build/theme.asset.php @@ -1 +1 @@ - array(), 'version' => '6cdacd840462a5c6d505'); + array(), 'version' => '1768336b7b2ec73f9a1a'); diff --git a/themes/osi/assets/js/build/theme.js b/themes/osi/assets/js/build/theme.js index a29a94a..ce9785b 100644 --- a/themes/osi/assets/js/build/theme.js +++ b/themes/osi/assets/js/build/theme.js @@ -1 +1 @@ -(()=>{var e={690:()=>{jQuery},838:()=>{document.addEventListener("DOMContentLoaded",(function(){const e=document.querySelector(".wpdc-join-discussion");if(e){const t=document.createElement("h3");t.classList.add("wp-block-heading"),t.textContent="Join the discussion on Discourse!",e.insertBefore(t,e.firstChild)}}))},706:()=>{const e=document.querySelector(".header-main");if(e){let t=!1;const a=()=>{t=!1;const a=window.scrollY>40;a!==e.classList.contains("header-main-small")&&e.classList.toggle("header-main-small",a)};window.addEventListener("scroll",(()=>{t||(t=!0,window.requestAnimationFrame(a))}),{passive:!0}),a()}},7:()=>{var e;e=jQuery,(()=>{const t=e(".license-categories"),a=["ls","categories"],n=e(".license-search input"),s=e(".category-filter-cb"),i=e("#clear-search"),r=e("#clear-categories"),o=e("#search-prompt"),l=e("#toggle-license-search"),c=e("#toggle-license-categories");let d=window.location.href,u={};const m=()=>{const s={};n.length&&(""!==n.val()?(s.ls=n.val(),o.removeClass("hide"),o.find("span").html(n.val()),l.removeClass("open").siblings().removeClass("open")):(delete s.ls,o.addClass("hide"),l.addClass("open").siblings().addClass("open")));const i=t.find("input:checked");i.length?(i.each(((t,a)=>{s.categories||(s.categories=[]),s.categories.push(e(a).val())})),s.categories=s.categories.join(","),r.removeClass("hide"),c.find("span").html("("+i.length+")")):(delete s.categories,r.addClass("hide"),c.find("span").html(""));const m=new URL(d),h=new URL(d);for(const e of h.searchParams.entries())m.searchParams.delete(e[0]);for(const e in s)m.searchParams.set(e,s[e]);window.history.pushState({path:m.toString()},"",m.toString()),d=m.toString();let p=!1;a.forEach((e=>{u[e]===s[e]&&typeof u[e]==typeof s[e]||(p=!0)})),u=s,p&&g()},h=()=>{e(".license-table .term-item").on("click",(function(a){a.preventDefault();const n=e(this).attr("data-term");t.find('[value="'+n+'"]').prop("checked",!0).parent("label").addClass("active"),m()}))},g=()=>{const t=e(".license-table tbody");t.html("Loading..."),e.post(OSI_LICENSE_DB.ajaxURL,{action:OSI_LICENSE_DB.action,...u},(e=>{e.success&&e.data?.html&&e.data.licenses.length?(t.html(e.data.html),h()):t.html("No licenses found! Please try widening your search.")})).fail((()=>{t.html("Something went wrong! Please refresh and try again.")}))};(()=>{const e=new URL(d);a.forEach((t=>{e.searchParams.has(t)&&(u[t]=e.searchParams.get(t))}))})(),u.s&&n.val(u.s),u.categories&&u.categories.trim().split(",").forEach((e=>{e=e.trim();const a=t.find(`#osi-filter-cb-${e}`);a.length&&a.prop("checked",!0)})),s.each((function(){e(this).is(":checked")&&e(this).parent("label").addClass("active")})),s.is(":checked")&&r.removeClass("hide"),s.on("change",(function(){e(this).parent("label").toggleClass("active"),m()})),e(".license-search form").on("submit",(function(e){e.preventDefault(),m()})),i.on("click",(function(){n.val(""),m()})),r.on("click",(function(){s.prop("checked",!1).parent("label").removeClass("active"),m()})),h()})()},386:()=>{!function(e){const t=jQuery(".single-license .license-meta > span");let a,n;for(let e=0;e{const e=window.matchMedia("(min-width: 1200px)"),t=document.querySelector(".header-main"),a=document.querySelectorAll(".nav-main--menu > .menu-item.megamenu");if(t&&a.length){const n=e=>e.querySelector(":scope > a"),s=()=>{t.classList.toggle("is-nav-open",Boolean(document.querySelector(".nav-main--menu > .menu-item.megamenu.is-open")))},i=e=>{r(e),e.classList.add("is-dismissed"),s()},r=e=>{e.classList.remove("is-open");const t=n(e);t&&t.setAttribute("aria-expanded","false")},o=()=>{a.forEach(r),s()};a.forEach((t=>{const o=n(t);let l=null,c=!1;o&&o.setAttribute("aria-expanded","false");const d=()=>{!c&&e.matches&&(t.classList.remove("is-dismissed"),window.clearTimeout(l),a.forEach((e=>{e!==t&&r(e)})),t.classList.add("is-open"),o&&o.setAttribute("aria-expanded","true"),s())},u=e=>{window.clearTimeout(l);const a=()=>{r(t),s()};e?a():l=window.setTimeout(a,120)};o&&"#"===o.getAttribute("href")&&o.addEventListener("click",(a=>{e.matches&&(a.preventDefault(),t.classList.contains("is-open")?u(!0):d())})),t.addEventListener("mouseenter",d),t.addEventListener("mouseleave",(()=>{t.classList.remove("is-dismissed"),u(!1)})),t.addEventListener("focusin",d),t.addEventListener("focusout",(e=>{t.contains(e.relatedTarget)||u(!1)})),t.addEventListener("keydown",(e=>{"Escape"===e.key&&t.classList.contains("is-open")&&(c=!0,i(t),o&&o.focus(),c=!1)}))})),document.addEventListener("pointerdown",(e=>{!e.target.closest(".nav-main--menu > .menu-item.megamenu")&&document.querySelector(".nav-main--menu > .menu-item.megamenu.is-open")&&o()})),document.addEventListener("keydown",(e=>{if("Escape"!==e.key)return;const t=document.querySelector(".nav-main--menu > .menu-item.megamenu.is-open");t&&i(t)})),e.addEventListener("change",(e=>{e.matches||o()}))}},876:()=>{!function(e){function t(a){var n=a.closest(".menu-item-has-children"),s=a.siblings(".sub-menu").first(),i=s.hasClass("menu-collapse");i&&n.siblings(".tab-active").each((function(){t(e(this).children(".menu-toggle").first())})),s.toggleClass("menu-collapse",!i),n.toggleClass("tab-active",i),n.parent().closest(".sub-menu").toggleClass("can-overflow",i),i||(n.find(".sub-menu").addClass("menu-collapse").removeClass("can-overflow"),n.find(".tab-active").removeClass("tab-active"),n.find(".menu-toggle").removeClass("menu-toggle-active").attr("aria-expanded","false"),n.find("a[aria-expanded]").attr("aria-expanded","false")),a.toggleClass("menu-toggle-active",i).attr("aria-expanded",String(i)),a.siblings("a[aria-expanded]").first().attr("aria-expanded",String(i))}e(".sub-menu").addClass("menu-collapse"),e(".menu-item-has-children > a").each((function(a){var n=e(this),s=n.siblings(".sub-menu").first();if(s.length){var i=s.attr("id")||"osi-submenu-"+a;s.attr("id",i);var r=e('').attr({"aria-label":"Toggle submenu for "+n.text().trim(),"aria-expanded":"false","aria-controls":i}).insertAfter(n);n.closest(".nav-mobile--menu").length&&(n.attr("aria-expanded","false"),r.attr({"aria-hidden":"true",tabindex:"-1"}),n.on("click",(function(e){e.preventDefault(),t(r)})))}})),e(".menu-toggle").on("click",(function(a){a.preventDefault(),a.stopPropagation(),t(e(this))}))}(jQuery)},151:()=>{var e;(e=jQuery)("#openSearch").click((function(){e(".header-search-wrapper").slideDown(),e(this).addClass("active"),e(".header-search-wrapper .search-field").focus()})),e("#closeSearch").click((function(){e(".header-search-wrapper").slideUp(),e("#openSearch").removeClass("active")}))},823:()=>{var e=document.getElementById("openMainMenu"),t=document.getElementById("closeSidebar"),a=document.getElementById("openSidebar");function n(){var e=document.querySelectorAll("html")[0],t=e.className;-1===t.indexOf("open-the-menu")?e.className=t+" open-the-menu":e.className=t.replace(" open-the-menu","")}function s(){var e=document.querySelectorAll("html")[0],t=e.className;-1===t.indexOf("open-the-sidebar")?e.className=t+" open-the-sidebar":e.className=t.replace(" open-the-sidebar","")}null!=e&&(e.attachEvent?(e.attachEvent("onclick",n),null!==a&&a.attachEvent("onclick",s)):(e.addEventListener("click",n),null!==a&&a.addEventListener("click",s))),null!=t&&(t.attachEvent?t.attachEvent("onclick",n):t.addEventListener("click",n))},103:()=>{/(trident|msie)/i.test(navigator.userAgent)&&document.getElementById&&window.addEventListener&&window.addEventListener("hashchange",(function(){var e,t=location.hash.substring(1);/^[A-z0-9_-]+$/.test(t)&&(e=document.getElementById(t))&&(/^(?:a|select|input|button|textarea)$/i.test(e.tagName)||(e.tabIndex=-1),e.focus())}),!1)},624:()=>{"use strict";class e{constructor(e){this.tableNode=e,this.columnHeaders=e.querySelectorAll("thead th"),this.sortColumns=[];for(var t=0;tn.value?-1:1}));n.firstChild;)n.removeChild(n.lastChild);for(var d=0;d{var e;(e=jQuery)(document).ready((function(){e(".toggle-header h2").click((function(){var t=e(this).parent().attr("id");e(this).parent().hasClass("open")?(e(this).parent().removeClass("open"),e('[data-toggle="'+t+'"]').removeClass("open")):(e(this).parent().addClass("open"),e('[data-toggle="'+t+'"]').addClass("open"))}))}))}},t={};function a(n){var s=t[n];if(void 0!==s)return s.exports;var i=t[n]={exports:{}};return e[n](i,i.exports,a),i.exports}a.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return a.d(t,{a:t}),t},a.d=(e,t)=>{for(var n in t)a.o(t,n)&&!a.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{"use strict";a(690),a(706),a(876),a(832),a(624),a(655),a(7),a(823),a(103),a(151),a(386),a(838)})()})(); \ No newline at end of file +(()=>{var e={690:()=>{jQuery},838:()=>{document.addEventListener("DOMContentLoaded",(function(){const e=document.querySelector(".wpdc-join-discussion");if(e){const t=document.createElement("h3");t.classList.add("wp-block-heading"),t.textContent="Join the discussion on Discourse!",e.insertBefore(t,e.firstChild)}}))},706:()=>{const e=document.querySelector(".header-main");if(e){const t=window.matchMedia("(max-width: 784px)");let a=!1,n=Math.max(0,window.scrollY),s=-1;const i=t=>e.classList.toggle("header-main-small",t),r=()=>{a=!1;const e=Math.max(0,window.scrollY);t.matches?e>120&&e>n?(s=-1,i(!0)):(-1===s&&(s=Math.max(n,e)),(e<=120||e40)),n=e};window.addEventListener("scroll",(()=>{a||(a=!0,window.requestAnimationFrame(r))}),{passive:!0}),t.addEventListener("change",r),r()}},7:()=>{var e;e=jQuery,(()=>{const t=e(".license-categories"),a=["ls","categories"],n=e(".license-search input"),s=e(".category-filter-cb"),i=e("#clear-search"),r=e("#clear-categories"),o=e("#search-prompt"),l=e("#toggle-license-search"),c=e("#toggle-license-categories");let d=window.location.href,u={};const m=()=>{const s={};n.length&&(""!==n.val()?(s.ls=n.val(),o.removeClass("hide"),o.find("span").html(n.val()),l.removeClass("open").siblings().removeClass("open")):(delete s.ls,o.addClass("hide"),l.addClass("open").siblings().addClass("open")));const i=t.find("input:checked");i.length?(i.each(((t,a)=>{s.categories||(s.categories=[]),s.categories.push(e(a).val())})),s.categories=s.categories.join(","),r.removeClass("hide"),c.find("span").html("("+i.length+")")):(delete s.categories,r.addClass("hide"),c.find("span").html(""));const m=new URL(d),h=new URL(d);for(const e of h.searchParams.entries())m.searchParams.delete(e[0]);for(const e in s)m.searchParams.set(e,s[e]);window.history.pushState({path:m.toString()},"",m.toString()),d=m.toString();let p=!1;a.forEach((e=>{u[e]===s[e]&&typeof u[e]==typeof s[e]||(p=!0)})),u=s,p&&g()},h=()=>{e(".license-table .term-item").on("click",(function(a){a.preventDefault();const n=e(this).attr("data-term");t.find('[value="'+n+'"]').prop("checked",!0).parent("label").addClass("active"),m()}))},g=()=>{const t=e(".license-table tbody");t.html("Loading..."),e.post(OSI_LICENSE_DB.ajaxURL,{action:OSI_LICENSE_DB.action,...u},(e=>{e.success&&e.data?.html&&e.data.licenses.length?(t.html(e.data.html),h()):t.html("No licenses found! Please try widening your search.")})).fail((()=>{t.html("Something went wrong! Please refresh and try again.")}))};(()=>{const e=new URL(d);a.forEach((t=>{e.searchParams.has(t)&&(u[t]=e.searchParams.get(t))}))})(),u.s&&n.val(u.s),u.categories&&u.categories.trim().split(",").forEach((e=>{e=e.trim();const a=t.find(`#osi-filter-cb-${e}`);a.length&&a.prop("checked",!0)})),s.each((function(){e(this).is(":checked")&&e(this).parent("label").addClass("active")})),s.is(":checked")&&r.removeClass("hide"),s.on("change",(function(){e(this).parent("label").toggleClass("active"),m()})),e(".license-search form").on("submit",(function(e){e.preventDefault(),m()})),i.on("click",(function(){n.val(""),m()})),r.on("click",(function(){s.prop("checked",!1).parent("label").removeClass("active"),m()})),h()})()},386:()=>{!function(e){const t=jQuery(".single-license .license-meta > span");let a,n;for(let e=0;e{const e=window.matchMedia("(min-width: 1200px)"),t=document.querySelector(".header-main"),a=document.querySelectorAll(".nav-main--menu > .menu-item.megamenu");if(t&&a.length){const n=e=>e.querySelector(":scope > a"),s=()=>{t.classList.toggle("is-nav-open",Boolean(document.querySelector(".nav-main--menu > .menu-item.megamenu.is-open")))},i=e=>{r(e),e.classList.add("is-dismissed"),s()},r=e=>{e.classList.remove("is-open");const t=n(e);t&&t.setAttribute("aria-expanded","false")},o=()=>{a.forEach(r),s()};a.forEach((t=>{const o=n(t);let l=null,c=!1;o&&o.setAttribute("aria-expanded","false");const d=()=>{!c&&e.matches&&(t.classList.remove("is-dismissed"),window.clearTimeout(l),a.forEach((e=>{e!==t&&r(e)})),t.classList.add("is-open"),o&&o.setAttribute("aria-expanded","true"),s())},u=e=>{window.clearTimeout(l);const a=()=>{r(t),s()};e?a():l=window.setTimeout(a,120)};o&&"#"===o.getAttribute("href")&&o.addEventListener("click",(a=>{e.matches&&(a.preventDefault(),t.classList.contains("is-open")?u(!0):d())})),t.addEventListener("mouseenter",d),t.addEventListener("mouseleave",(()=>{t.classList.remove("is-dismissed"),u(!1)})),t.addEventListener("focusin",d),t.addEventListener("focusout",(e=>{t.contains(e.relatedTarget)||u(!1)})),t.addEventListener("keydown",(e=>{"Escape"===e.key&&t.classList.contains("is-open")&&(c=!0,i(t),o&&o.focus(),c=!1)}))})),document.addEventListener("pointerdown",(e=>{!e.target.closest(".nav-main--menu > .menu-item.megamenu")&&document.querySelector(".nav-main--menu > .menu-item.megamenu.is-open")&&o()})),document.addEventListener("keydown",(e=>{if("Escape"!==e.key)return;const t=document.querySelector(".nav-main--menu > .menu-item.megamenu.is-open");t&&i(t)})),e.addEventListener("change",(e=>{e.matches||o()}))}},876:()=>{!function(e){function t(a){var n=a.closest(".menu-item-has-children"),s=a.siblings(".sub-menu").first(),i=s.hasClass("menu-collapse");i&&n.siblings(".tab-active").each((function(){t(e(this).children(".menu-toggle").first())})),s.toggleClass("menu-collapse",!i),n.toggleClass("tab-active",i),n.parent().closest(".sub-menu").toggleClass("can-overflow",i),i||(n.find(".sub-menu").addClass("menu-collapse").removeClass("can-overflow"),n.find(".tab-active").removeClass("tab-active"),n.find(".menu-toggle").removeClass("menu-toggle-active").attr("aria-expanded","false"),n.find("a[aria-expanded]").attr("aria-expanded","false")),a.toggleClass("menu-toggle-active",i).attr("aria-expanded",String(i)),a.siblings("a[aria-expanded]").first().attr("aria-expanded",String(i))}e(".sub-menu").addClass("menu-collapse"),e(".menu-item-has-children > a").each((function(a){var n=e(this),s=n.siblings(".sub-menu").first();if(s.length){var i=s.attr("id")||"osi-submenu-"+a;s.attr("id",i);var r=e('').attr({"aria-label":"Toggle submenu for "+n.text().trim(),"aria-expanded":"false","aria-controls":i}).insertAfter(n);n.closest(".nav-mobile--menu").length&&(n.attr("aria-expanded","false"),r.attr({"aria-hidden":"true",tabindex:"-1"}),n.on("click",(function(e){e.preventDefault(),t(r)})))}})),e(".menu-toggle").on("click",(function(a){a.preventDefault(),a.stopPropagation(),t(e(this))}))}(jQuery)},151:()=>{var e;(e=jQuery)("#openSearch").click((function(){e(".header-search-wrapper").slideDown(),e(this).addClass("active"),e(".header-search-wrapper .search-field").focus()})),e("#closeSearch").click((function(){e(".header-search-wrapper").slideUp(),e("#openSearch").removeClass("active")}))},823:()=>{var e=document.getElementById("openMainMenu"),t=document.getElementById("closeSidebar"),a=document.getElementById("openSidebar");function n(){var e=document.querySelectorAll("html")[0],t=e.className;-1===t.indexOf("open-the-menu")?e.className=t+" open-the-menu":e.className=t.replace(" open-the-menu","")}function s(){var e=document.querySelectorAll("html")[0],t=e.className;-1===t.indexOf("open-the-sidebar")?e.className=t+" open-the-sidebar":e.className=t.replace(" open-the-sidebar","")}null!=e&&(e.attachEvent?(e.attachEvent("onclick",n),null!==a&&a.attachEvent("onclick",s)):(e.addEventListener("click",n),null!==a&&a.addEventListener("click",s))),null!=t&&(t.attachEvent?t.attachEvent("onclick",n):t.addEventListener("click",n))},103:()=>{/(trident|msie)/i.test(navigator.userAgent)&&document.getElementById&&window.addEventListener&&window.addEventListener("hashchange",(function(){var e,t=location.hash.substring(1);/^[A-z0-9_-]+$/.test(t)&&(e=document.getElementById(t))&&(/^(?:a|select|input|button|textarea)$/i.test(e.tagName)||(e.tabIndex=-1),e.focus())}),!1)},624:()=>{"use strict";class e{constructor(e){this.tableNode=e,this.columnHeaders=e.querySelectorAll("thead th"),this.sortColumns=[];for(var t=0;tn.value?-1:1}));n.firstChild;)n.removeChild(n.lastChild);for(var d=0;d{var e;(e=jQuery)(document).ready((function(){e(".toggle-header h2").click((function(){var t=e(this).parent().attr("id");e(this).parent().hasClass("open")?(e(this).parent().removeClass("open"),e('[data-toggle="'+t+'"]').removeClass("open")):(e(this).parent().addClass("open"),e('[data-toggle="'+t+'"]').addClass("open"))}))}))}},t={};function a(n){var s=t[n];if(void 0!==s)return s.exports;var i=t[n]={exports:{}};return e[n](i,i.exports,a),i.exports}a.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return a.d(t,{a:t}),t},a.d=(e,t)=>{for(var n in t)a.o(t,n)&&!a.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{"use strict";a(690),a(706),a(876),a(832),a(624),a(655),a(7),a(823),a(103),a(151),a(386),a(838)})()})(); \ No newline at end of file diff --git a/themes/osi/assets/js/src/theme/header-resize.js b/themes/osi/assets/js/src/theme/header-resize.js index 4d1bce0..237908c 100644 --- a/themes/osi/assets/js/src/theme/header-resize.js +++ b/themes/osi/assets/js/src/theme/header-resize.js @@ -2,7 +2,7 @@ Name: Header Resize Author: Marktime Media Author URI: http://marktimemedia.com -Version: 0.3 +Version: 0.4 License: GPLv2 This program is free software; you can redistribute it and/or modify @@ -20,18 +20,47 @@ License: GPLv2 const header = document.querySelector( '.header-main' ); -const SHRINK_AT = 40; // px scrolled before the logo shrinks +const SHRINK_AT = 40; // px scrolled before the header shrinks +const MOBILE_SHRINK_AT = 120; // px scrolled before it shrinks on the direction-aware path +const MOBILE_RESTORE_BY = 100; // px scrolled back up before it returns to full height +const MOBILE_MAX_WIDTH = 784; // the width production switches paths at if ( header ) { + const narrow = window.matchMedia( `(max-width: ${ MOBILE_MAX_WIDTH }px)` ); + let ticking = false; + let lastY = Math.max( 0, window.scrollY ); + let turningPoint = -1; // top of the current upward scroll, -1 while scrolling down + + const setSmall = ( small ) => header.classList.toggle( 'header-main-small', small ); const update = () => { ticking = false; - const small = window.scrollY > SHRINK_AT; + const y = Math.max( 0, window.scrollY ); // rubber-band overscroll reports negative + + if ( narrow.matches ) { + // narrow screens follow the scroll direction, so the full header comes back part-way + // down the page rather than only at the top (@see T51ENG-2081) + if ( y > MOBILE_SHRINK_AT && y > lastY ) { + turningPoint = -1; + setSmall( true ); + } else { + if ( -1 === turningPoint ) { + // the peak, not where this frame landed: one frame can swallow a whole flick + turningPoint = Math.max( lastY, y ); + } - if ( small !== header.classList.contains( 'header-main-small' ) ) { - header.classList.toggle( 'header-main-small', small ); + if ( y <= MOBILE_SHRINK_AT || y < turningPoint - MOBILE_RESTORE_BY ) { + turningPoint = -1; + setSmall( false ); + } + } + } else { + turningPoint = -1; // or a peak latched while narrow outlives a rotation + setSmall( y > SHRINK_AT ); } + + lastY = y; }; window.addEventListener( 'scroll', () => { @@ -41,5 +70,8 @@ if ( header ) { } }, { passive: true } ); + // the two paths disagree, so crossing the width mid-page has to re-decide + narrow.addEventListener( 'change', update ); + update(); // reloads restore scroll position before this runs }