Permalink
Browse files

fix(scrollspy): Handle .nav-link inside .nav-item active state

Needed for adjacent sibling styling
  • Loading branch information...
tmorehouse committed Sep 19, 2017
1 parent 8b4bd29 commit 6db094d30ead62238b233aac127c2c772ce39f71
Showing with 7 additions and 1 deletion.
  1. +7 −1 lib/classes/scrollspy.js
@@ -397,6 +397,10 @@ class ScrollSpy {
} else {
// Set triggered link as active
this.setActiveState(link, true);
if (matches(link.parentElement, Selector.NAV_ITEMS)) {
// Handle nav-link inside nav-item, and set nav-item active
this.setActiveState(link.parentElement, true);
}
// Set triggered links parents as active
// With both <ul> and <nav> markup a parent is the previous sibling of any nav ancestor
let el = link;
@@ -409,6 +413,8 @@ class ScrollSpy {
// Handle special case where nav-link is inside a nav-item
if (matches(sibling, Selector.NAV_ITEMS)) {
this.setActiveState(select(Selector.NAV_LINKS, sibling), true);
// Add active state to nav-item as well
this.setActiveState(sibling, true);
}
}
}
@@ -421,7 +427,7 @@ class ScrollSpy {
}
clear() {
selectAll(this.$selector, this.$el)
selectAll(`${this.$selector}, ${Selector.NAV_ITEMS}`, this.$el)
.filter(el => hasClass(el, ClassName.ACTIVE))
.forEach(el => this.setActiveState(el, false));
}

0 comments on commit 6db094d

Please sign in to comment.