feat(nav): show active secondary module name on More button
When navigating to a secondary module (Budget, Recipes, Contacts, Settings), the More button now displays the module's label and icon instead of "More". This provides clearer navigation feedback to the user. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
+14
-1
@@ -706,9 +706,22 @@ function updateNav(path) {
|
|||||||
|
|
||||||
const moreBtn = document.querySelector('#more-btn');
|
const moreBtn = document.querySelector('#more-btn');
|
||||||
if (moreBtn) {
|
if (moreBtn) {
|
||||||
const inMoreSheet = navItems().slice(PRIMARY_NAV).some((n) => n.path === path);
|
const secondaryItems = navItems().slice(PRIMARY_NAV);
|
||||||
|
const activeSecondary = secondaryItems.find((n) => n.path === path);
|
||||||
|
const inMoreSheet = !!activeSecondary;
|
||||||
|
|
||||||
moreBtn.classList.toggle('nav-item--active', inMoreSheet);
|
moreBtn.classList.toggle('nav-item--active', inMoreSheet);
|
||||||
moreBtn.toggleAttribute('aria-current', inMoreSheet);
|
moreBtn.toggleAttribute('aria-current', inMoreSheet);
|
||||||
|
|
||||||
|
const moreBtnLabel = moreBtn.querySelector('.nav-item__label');
|
||||||
|
const moreBtnIcon = moreBtn.querySelector('.nav-item__icon');
|
||||||
|
|
||||||
|
if (moreBtnLabel) {
|
||||||
|
moreBtnLabel.textContent = activeSecondary ? activeSecondary.label : t('nav.more');
|
||||||
|
}
|
||||||
|
if (moreBtnIcon) {
|
||||||
|
moreBtnIcon.dataset.lucide = activeSecondary ? activeSecondary.icon : 'grid-2x2';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (window.lucide) {
|
if (window.lucide) {
|
||||||
|
|||||||
Reference in New Issue
Block a user