diff --git a/pages/testdata/featurelist_test/test_html_rendering.html b/pages/testdata/featurelist_test/test_html_rendering.html index 8cd828f8fcc..5500100d187 100644 --- a/pages/testdata/featurelist_test/test_html_rendering.html +++ b/pages/testdata/featurelist_test/test_html_rendering.html @@ -177,6 +177,26 @@

Features:

}; loadFeatureLegendViews(VIEWS); })(); + + // Since we don't use chromedash-app on this page, re-implement a little + // logic for the main menu shifting the page content on desktop. + const isMobile = window.screen.width < 701; + if (!isMobile) { + const header = document.querySelector('chromedash-header'); + const drawer = document.querySelector('chromedash-drawer'); + const flexWrapper = document.querySelector('#content-flex-wrapper'); + const shiftedStyle = 'margin-left: 210px; justify-content: start'; + drawer.defaultOpen = true; + flexWrapper.style = shiftedStyle; + + function shiftPage() { + const slDrawer = drawer.shadowRoot.querySelector('sl-drawer'); + const isOpening = !slDrawer.open; + flexWrapper.style = isOpening ? shiftedStyle : ''; + } + header.addEventListener('drawer-clicked', shiftPage); + } + diff --git a/templates/features.html b/templates/features.html index 79f3cb4f90c..076fb4410d2 100644 --- a/templates/features.html +++ b/templates/features.html @@ -56,5 +56,25 @@

Features:

}; loadFeatureLegendViews(VIEWS); })(); + + // Since we don't use chromedash-app on this page, re-implement a little + // logic for the main menu shifting the page content on desktop. + const isMobile = window.screen.width < 701; + if (!isMobile) { + const header = document.querySelector('chromedash-header'); + const drawer = document.querySelector('chromedash-drawer'); + const flexWrapper = document.querySelector('#content-flex-wrapper'); + const shiftedStyle = 'margin-left: 210px; justify-content: start'; + drawer.defaultOpen = true; + flexWrapper.style = shiftedStyle; + + function shiftPage() { + const slDrawer = drawer.shadowRoot.querySelector('sl-drawer'); + const isOpening = !slDrawer.open; + flexWrapper.style = isOpening ? shiftedStyle : ''; + } + header.addEventListener('drawer-clicked', shiftPage); + } + {% endblock %}