From b55fa5579b409be76f551cbb3c1e46e1ad71bdfd Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Fri, 14 Jul 2017 17:49:30 +0300 Subject: tabs: make the `active` selector more restrictive again. When one uses say a carousel inside a tab, the `.active` selector previously matches the carousel ones too leading to broken tabs. It's not the perfect solution but should the job for now. --- js/src/tab.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/src') diff --git a/js/src/tab.js b/js/src/tab.js index 1613bbb7d..4fd69c507 100644 --- a/js/src/tab.js +++ b/js/src/tab.js @@ -44,7 +44,7 @@ const Tab = (($) => { const Selector = { DROPDOWN : '.dropdown', NAV_LIST_GROUP : '.nav, .list-group', - ACTIVE : '.active', + ACTIVE : '> .nav-item > .active, > .active', DATA_TOGGLE : '[data-toggle="tab"], [data-toggle="pill"], [data-toggle="list"]', DROPDOWN_TOGGLE : '.dropdown-toggle', DROPDOWN_ACTIVE_CHILD : '> .dropdown-menu .active' -- cgit v1.2.3 From 640c13062ce80b0b94aef9444050d4d3820fb2d8 Mon Sep 17 00:00:00 2001 From: Johann-S Date: Sun, 16 Jul 2017 16:04:37 +0200 Subject: When we show our tabs element use children to be more restrictive --- js/src/tab.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'js/src') diff --git a/js/src/tab.js b/js/src/tab.js index 4fd69c507..5e5a83118 100644 --- a/js/src/tab.js +++ b/js/src/tab.js @@ -44,7 +44,7 @@ const Tab = (($) => { const Selector = { DROPDOWN : '.dropdown', NAV_LIST_GROUP : '.nav, .list-group', - ACTIVE : '> .nav-item > .active, > .active', + ACTIVE : '.active', DATA_TOGGLE : '[data-toggle="tab"], [data-toggle="pill"], [data-toggle="list"]', DROPDOWN_TOGGLE : '.dropdown-toggle', DROPDOWN_ACTIVE_CHILD : '> .dropdown-menu .active' @@ -148,7 +148,8 @@ const Tab = (($) => { // private _activate(element, container, callback) { - const active = $(container).find(Selector.ACTIVE)[0] + const activeElements = callback ? $(container).children(Selector.ACTIVE) : $(container).find(Selector.ACTIVE) + const active = activeElements[0] const isTransitioning = callback && Util.supportsTransitionEnd() && (active && $(active).hasClass(ClassName.FADE)) -- cgit v1.2.3 From 2eb1e687bd74d147145000b3971821cc890d7652 Mon Sep 17 00:00:00 2001 From: Johann-S Date: Tue, 18 Jul 2017 14:22:39 +0200 Subject: Improve previous selector for nested tabs --- js/src/tab.js | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) (limited to 'js/src') diff --git a/js/src/tab.js b/js/src/tab.js index 5e5a83118..4c3091495 100644 --- a/js/src/tab.js +++ b/js/src/tab.js @@ -45,6 +45,7 @@ const Tab = (($) => { DROPDOWN : '.dropdown', NAV_LIST_GROUP : '.nav, .list-group', ACTIVE : '.active', + ACTIVE_UL : '> li > .active', DATA_TOGGLE : '[data-toggle="tab"], [data-toggle="pill"], [data-toggle="list"]', DROPDOWN_TOGGLE : '.dropdown-toggle', DROPDOWN_ACTIVE_CHILD : '> .dropdown-menu .active' @@ -87,7 +88,8 @@ const Tab = (($) => { const selector = Util.getSelectorFromElement(this._element) if (listElement) { - previous = $.makeArray($(listElement).find(Selector.ACTIVE)) + const itemSelector = listElement.nodeName === 'UL' ? Selector.ACTIVE_UL : Selector.ACTIVE + previous = $.makeArray($(listElement).find(itemSelector)) previous = previous[previous.length - 1] } @@ -148,7 +150,13 @@ const Tab = (($) => { // private _activate(element, container, callback) { - const activeElements = callback ? $(container).children(Selector.ACTIVE) : $(container).find(Selector.ACTIVE) + let activeElements + if (container.nodeName === 'UL') { + activeElements = $(container).find(Selector.ACTIVE_UL) + } else { + activeElements = $(container).children(Selector.ACTIVE) + } + const active = activeElements[0] const isTransitioning = callback && Util.supportsTransitionEnd() -- cgit v1.2.3