feature request: support collapsible vertical menu items in tabs plugin

[vkhoroz]

Currently a tabs.js plugin supports a "dropdown" toggle class. This is suitable for horizontal tabs sub-menu, but for vertical tabs sub-menu a "collapse" toggle class is much more convenient.

This is an easy to introduce feature and I have a patch provided in a comment.
An example vertical menu where collapsible sub-menu is used to activate tabs is presented in an attachment.

[vkhoroz]

[vkhoroz]

Patch file, so that you can play with it (please, let me know if I should make a pull request):

--- site/lib/bootstrap.3.2.0/js/bootstrap.js    2014-10-25 02:44:17.299181656 +0300
+++ site/lib/bootstrap.3.2.0/js/bootstrap.js.new        2014-10-25 02:44:02.459368217 +0300
@@ -1864,7 +1864,7 @@

   Tab.prototype.show = function () {
     var $this    = this.element
-    var $ul      = $this.closest('ul:not(.dropdown-menu)')
+    var $ul      = $this.closest('ul:not(.dropdown-menu):not(.collapse)')
     var selector = $this.data('target')

     if (!selector) {
@@ -1903,7 +1903,7 @@
     function next() {
       $active
         .removeClass('active')
-        .find('> .dropdown-menu > .active')
+        .find('> .dropdown-menu > .active, > .collapse > .active')
         .removeClass('active')

       element.addClass('active')
@@ -1915,7 +1915,7 @@
         element.removeClass('fade')
       }

-      if (element.parent('.dropdown-menu')) {
+      if (element.parent('.dropdown-menu') || element.parent('.collapse')) {
         element.closest('li.dropdown').addClass('active')
       }

[ghost]

+1

[hnrch02]

Why not just restyle the dropdown menu to look like you want it to? That's what the responsive navbar does for small viewports.

[vkhoroz]

@hnrch02, because restyling means a lot of custom CSS to make "dropdown" look like "collapse", moreover, this will be not less than 90% CSS copied from Bootstrap.

I don't think this is a good practice and is hard to maintain as this CSS will have to be updated with every new version of Bootstrap.

[hnrch02]

Yeah, but that's the drawback of working with stuff the framework doesn't support. We don't have any horizontal tab menus in v3 and therefore adding this doesn't make much sense other than to support your specific use case.

Edit: I forgot about stackable pills. Still my point about restyling dropdowns stands. I got an acceptable style with less than 10 lines of code.

[cvrebert]

Somewhat relevant: https://github.com/dbtek/bootstrap-vertical-tabs
But yeah, @mdo specifically removed Bootstrap v2's vertical tab variations in v3.

[mdo]

Punting for now, but i could see making some changes to either tabs or collapse in v4 to account for something like this.