From 28fea6753c90be2b62f4405a0d85d431db6cf846 Mon Sep 17 00:00:00 2001
From: Ross Mackay <ross@mcky.me>
Date: Mon, 17 Mar 2025 22:56:39 +0000
Subject: [PATCH] Automatically close the sidebar when navigating sections on
mobile
---
assets/js/sidebar/sidebar-drawer.js | 12 ++++++++++++
1 file changed, 12 insertions(+)
diff --git a/assets/js/sidebar/sidebar-drawer.js b/assets/js/sidebar/sidebar-drawer.js
index b6f0022c8..f096c6a49 100644
--- a/assets/js/sidebar/sidebar-drawer.js
+++ b/assets/js/sidebar/sidebar-drawer.js
@@ -51,6 +51,8 @@ if (!isEmbedded) {
// We observe on mousedown because we only care about user resize.
sidebar.addEventListener('mousedown', () => resizeObserver.observe(sidebar))
sidebar.addEventListener('mouseup', () => resizeObserver.unobserve(sidebar))
+
+ window.addEventListener('hashchange', maybeCloseSidebarOnNavigate)
}
function setDefaultSidebarState () {
@@ -114,3 +116,13 @@ function transitionSidebar (open) {
export function openSidebar () {
return transitionSidebar(true)
}
+
+/**
+ * Closes the sidebar on small screens when navigating between sections
+ * on the page, for consistency with full page transitions
+ */
+function maybeCloseSidebarOnNavigate () {
+ if (smallScreenQuery.matches && isSidebarOpen()) {
+ transitionSidebar(false)
+ }
+}