diff --git a/hugo/data/navigation.yaml b/hugo/data/navigation.yaml index c235aed0c..19fadbc90 100644 --- a/hugo/data/navigation.yaml +++ b/hugo/data/navigation.yaml @@ -29,6 +29,11 @@ groups: - id: learn label: Learn items: + - id: nav-tutorial-navigator + label: Tutorial Navigator + href: /tutorial-navigator/ + icon: course-book + keywords: [tutorial, navigator, catalog, browse tutorials, learn] - id: explore-learn label: Learn href: /learn/ @@ -74,11 +79,6 @@ groups: paletteLabel: Connect — events, advocates, community paletteIcon: group keywords: [connect, community, events, advocates, codejam, devtoberfest, verb] - - id: nav-tutorial-navigator - label: Tutorial Navigator - href: /tutorial-navigator/ - icon: course-book - keywords: [tutorial, navigator, catalog, browse tutorials, learn] - id: explore label: Explore items: diff --git a/hugo/layouts/channels/list.html b/hugo/layouts/channels/list.html index 7597ce95d..dc54a1d30 100644 --- a/hugo/layouts/channels/list.html +++ b/hugo/layouts/channels/list.html @@ -6,7 +6,7 @@

{{ .Title }}

{{ .Description }}

diff --git a/hugo/layouts/partials/header.html b/hugo/layouts/partials/header.html index 0b0e9a533..d90f63674 100644 --- a/hugo/layouts/partials/header.html +++ b/hugo/layouts/partials/header.html @@ -57,7 +57,7 @@ - +
@@ -245,17 +245,32 @@ // Two-level accordion: clicking a group header opens its list and closes the // others (single-open keeps the menu compact on mobile). The first group ships // expanded (aria-expanded="true" in the template) so the verb spine stays - // visible at a glance on desktop. + // visible at a glance on desktop. The last-open group is remembered in + // localStorage and restored on the next load so navigation can continue where + // it left off (empty string = user collapsed everything). + const NAV_OPEN_KEY = 'sb-nav-open-group'; + const setOpenGroup = (groupId) => { + navPopover.querySelectorAll('.nav-group__header').forEach(b => b.setAttribute('aria-expanded', 'false')); + navPopover.querySelectorAll('.nav-group__items').forEach(l => l.setAttribute('hidden', '')); + if (!groupId) return; + const header = navPopover.querySelector('.nav-group__header[data-nav-group="' + groupId + '"]'); + const list = navPopover.querySelector('.nav-group__items[data-nav-items="' + groupId + '"]'); + if (header && list) { + header.setAttribute('aria-expanded', 'true'); + list.removeAttribute('hidden'); + } + }; + // Restore the remembered group (null = untouched, keep the template default). + try { + const stored = localStorage.getItem(NAV_OPEN_KEY); + if (stored !== null) setOpenGroup(stored); + } catch (e) { /* storage blocked; keep template default */ } document.querySelectorAll('#sb-nav-popover .nav-group__header').forEach(btn => { btn.addEventListener('click', () => { const wasOpen = btn.getAttribute('aria-expanded') === 'true'; - navPopover.querySelectorAll('.nav-group__header').forEach(b => b.setAttribute('aria-expanded', 'false')); - navPopover.querySelectorAll('.nav-group__items').forEach(l => l.setAttribute('hidden', '')); - if (!wasOpen) { - btn.setAttribute('aria-expanded', 'true'); - const list = navPopover.querySelector('.nav-group__items[data-nav-items="' + btn.getAttribute('data-nav-group') + '"]'); - if (list) list.removeAttribute('hidden'); - } + const groupId = wasOpen ? '' : btn.getAttribute('data-nav-group'); + setOpenGroup(groupId); + try { localStorage.setItem(NAV_OPEN_KEY, groupId); } catch (e) { /* storage blocked */ } }); });