Fix tab highlight: exact category URL match instead of substring
/categories/dark-fantasy/ was also activating the Fantasy tab
because path.includes('fantasy') matched. Now compares the full
/categories/{slug}/ path.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
+3
-2
@@ -91,8 +91,9 @@
|
|||||||
const path = location.pathname;
|
const path = location.pathname;
|
||||||
tabs.forEach(btn => {
|
tabs.forEach(btn => {
|
||||||
const cat = btn.dataset.cat;
|
const cat = btn.dataset.cat;
|
||||||
const active = (cat === 'All' && (path === '/' || path.startsWith('/issue') || path === '/posts/'))
|
const slug = cat.toLowerCase().replace(/\s+/g, '-').replace(/[^a-z0-9-]/g, '');
|
||||||
|| (cat !== 'All' && path.toLowerCase().includes(cat.toLowerCase().replace(/\s+/g, '-').replace(/[^a-z0-9-]/g, '')));
|
const active = (cat === 'All' && (path === '/' || path.startsWith('/issues') || path === '/posts/'))
|
||||||
|
|| (cat !== 'All' && path === `/categories/${slug}/`);
|
||||||
btn.setAttribute('aria-pressed', active ? 'true' : 'false');
|
btn.setAttribute('aria-pressed', active ? 'true' : 'false');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
+3
-2
@@ -91,8 +91,9 @@
|
|||||||
const path = location.pathname;
|
const path = location.pathname;
|
||||||
tabs.forEach(btn => {
|
tabs.forEach(btn => {
|
||||||
const cat = btn.dataset.cat;
|
const cat = btn.dataset.cat;
|
||||||
const active = (cat === 'All' && (path === '/' || path.startsWith('/issue') || path === '/posts/'))
|
const slug = cat.toLowerCase().replace(/\s+/g, '-').replace(/[^a-z0-9-]/g, '');
|
||||||
|| (cat !== 'All' && path.toLowerCase().includes(cat.toLowerCase().replace(/\s+/g, '-').replace(/[^a-z0-9-]/g, '')));
|
const active = (cat === 'All' && (path === '/' || path.startsWith('/issues') || path === '/posts/'))
|
||||||
|
|| (cat !== 'All' && path === `/categories/${slug}/`);
|
||||||
btn.setAttribute('aria-pressed', active ? 'true' : 'false');
|
btn.setAttribute('aria-pressed', active ? 'true' : 'false');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user