Fixed custom tabs issue #378

build/less/dropdown.less

@@ -5,7 +5,7 @@
 
 /*Dropdowns in general*/
 .dropdown-menu {
-  box-shadow: @box-boxshadow;
+  box-shadow: none;
   border-color: #eee;
   > li > a {
     color: #777;

build/less/navs.less

@@ -7,7 +7,7 @@
 .nav-pills {
   > li > a {
     .border-radius(0);
-    border-top: 3px solid transparent;    
+    border-top: 3px solid transparent;
     color: #444;
     > .fa,
     > .glyphicon,
@@ -17,7 +17,7 @@
   }
   > li.active > a,
   > li.active > a:hover,
-  > li.active > a:focus {
+    > li.active > a:focus {
     background-color: #f4f4f4;
     border-top-color: @light-blue;
     color: #444;
@@ -34,7 +34,7 @@
   > li > a {
     .border-radius(0);
     border-top: 0;
-    border-left: 3px solid transparent;    
+    border-left: 3px solid transparent;
     color: #444;
   }
   > li.active > a,
@@ -68,12 +68,16 @@
       border-top: 3px solid transparent;
       margin-bottom: -2px;
       > a {
+        color: #444;
         .border-radius(0)!important;
         &,
         &:hover {
           background: transparent;
           margin: 0;
         }
+        &:hover {
+          color: #999;
+        }
       }
       &:not(.active) {
         > a:hover,
@@ -90,10 +94,10 @@
       & > a,
       &:hover > a {
         background-color: #fff;
-
+        color: #444;
       }
       > a {
-        border-top: 0;
+        border-top-color: transparent;
         border-left-color: #f4f4f4;
         border-right-color: #f4f4f4;
       }
@@ -104,7 +108,7 @@
       margin-left: 0;
       &.active {
         > a {
-          border-left-width: 0;
+          border-left-color: transparent;
         }
       }
     }
@@ -117,10 +121,13 @@
       }
       > li:first-of-type {
         margin-right: 0;
+        > a {
+          border-left-width: 1px;
+        }
         &.active {
           > a {
-            border-left-width: 1px;
-            border-right-width: 0;
+            border-left-color: #f4f4f4;
+            border-right-color: transparent;
           }
         }
       }
@@ -144,6 +151,14 @@
     padding: 10px;
     .border-bottom-radius(@box-border-radius);
   }
+
+  .dropdown.open > a {
+    &:active,
+      &:focus {
+      background: transparent;
+      color: #999;
+    }
+  }
 }
 
 /* Nav tabs bottom */

dist/css/AdminLTE.css

@@ -889,7 +889,7 @@ a:focus {
  */
 /*Dropdowns in general*/
 .dropdown-menu {
-  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
+  box-shadow: none;
   border-color: #eee;
 }
 .dropdown-menu > li > a {
@@ -2385,6 +2385,7 @@ a:focus {
   margin-right: 5px;
 }
 .nav-tabs-custom > .nav-tabs > li > a {
+  color: #444;
   border-radius: 0 !important;
 }
 .nav-tabs-custom > .nav-tabs > li > a,
@@ -2392,6 +2393,9 @@ a:focus {
   background: transparent;
   margin: 0;
 }
+.nav-tabs-custom > .nav-tabs > li > a:hover {
+  color: #999;
+}
 .nav-tabs-custom > .nav-tabs > li:not(.active) > a:hover,
 .nav-tabs-custom > .nav-tabs > li:not(.active) > a:focus,
 .nav-tabs-custom > .nav-tabs > li:not(.active) > a:active {
@@ -2403,9 +2407,10 @@ a:focus {
 .nav-tabs-custom > .nav-tabs > li.active > a,
 .nav-tabs-custom > .nav-tabs > li.active:hover > a {
   background-color: #fff;
+  color: #444;
 }
 .nav-tabs-custom > .nav-tabs > li.active > a {
-  border-top: 0;
+  border-top-color: transparent;
   border-left-color: #f4f4f4;
   border-right-color: #f4f4f4;
 }
@@ -2413,7 +2418,7 @@ a:focus {
   margin-left: 0;
 }
 .nav-tabs-custom > .nav-tabs > li:first-of-type.active > a {
-  border-left-width: 0;
+  border-left-color: transparent;
 }
 .nav-tabs-custom > .nav-tabs.pull-right {
   float: none!important;
@@ -2424,9 +2429,12 @@ a:focus {
 .nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type {
   margin-right: 0;
 }
-.nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type.active > a {
+.nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type > a {
   border-left-width: 1px;
-  border-right-width: 0;
+}
+.nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type.active > a {
+  border-left-color: #f4f4f4;
+  border-right-color: transparent;
 }
 .nav-tabs-custom > .nav-tabs > li.header {
   line-height: 35px;
@@ -2445,6 +2453,11 @@ a:focus {
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
 }
+.nav-tabs-custom .dropdown.open > a:active,
+.nav-tabs-custom .dropdown.open > a:focus {
+  background: transparent;
+  color: #999;
+}
 /* Nav tabs bottom */
 .tabs-bottom.nav-3 li a {
   width: 3333.33333333% !important;

pages/UI/general.html

@@ -667,6 +667,7 @@
                 <ul class="nav nav-tabs">
                   <li class="active"><a href="#tab_1" data-toggle="tab">Tab 1</a></li>
                   <li><a href="#tab_2" data-toggle="tab">Tab 2</a></li>
+                  <li><a href="#tab_3" data-toggle="tab">Tab 3</a></li>
                   <li class="dropdown">
                     <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                       Dropdown <span class="caret"></span>
@@ -703,6 +704,15 @@
                     words. If several languages coalesce, the grammar of the resulting language is more simple
                     and regular than that of the individual languages.
                   </div><!-- /.tab-pane -->
+                  <div class="tab-pane" id="tab_3">
+                    Lorem Ipsum is simply dummy text of the printing and typesetting industry.
+                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
+                    when an unknown printer took a galley of type and scrambled it to make a type specimen book.
+                    It has survived not only five centuries, but also the leap into electronic typesetting,
+                    remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset
+                    sheets containing Lorem Ipsum passages, and more recently with desktop publishing software
+                    like Aldus PageMaker including versions of Lorem Ipsum.
+                  </div><!-- /.tab-pane -->
                 </div><!-- /.tab-content -->
               </div><!-- nav-tabs-custom -->
             </div><!-- /.col -->
@@ -713,6 +723,7 @@
                 <ul class="nav nav-tabs pull-right">
                   <li class="active"><a href="#tab_1-1" data-toggle="tab">Tab 1</a></li>
                   <li><a href="#tab_2-2" data-toggle="tab">Tab 2</a></li>
+                  <li><a href="#tab_3-2" data-toggle="tab">Tab 3</a></li>
                   <li class="dropdown">
                     <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                       Dropdown <span class="caret"></span>
@@ -749,6 +760,15 @@
                     words. If several languages coalesce, the grammar of the resulting language is more simple
                     and regular than that of the individual languages.
                   </div><!-- /.tab-pane -->
+                  <div class="tab-pane" id="tab_3-2">
+                    Lorem Ipsum is simply dummy text of the printing and typesetting industry.
+                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
+                    when an unknown printer took a galley of type and scrambled it to make a type specimen book.
+                    It has survived not only five centuries, but also the leap into electronic typesetting,
+                    remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset
+                    sheets containing Lorem Ipsum passages, and more recently with desktop publishing software
+                    like Aldus PageMaker including versions of Lorem Ipsum.
+                  </div><!-- /.tab-pane -->
                 </div><!-- /.tab-content -->
               </div><!-- nav-tabs-custom -->
             </div><!-- /.col -->