rewrite active and disabled styles for navs

1 files changed, 13 insertions, 18 deletions

diff --git a/scss/_nav.scss b/scss/_nav.scss
index 813ac36ffe..aa8a01e481 100644
--- a/scss/_nav.scss
+++ b/scss/_nav.scss
@@ -17,7 +17,6 @@
   }
 
   // Disabled state lightens text and removes hover/tab effects
-  .disabled > &,
   &.disabled {
     color: $nav-disabled-link-color;
 
@@ -83,6 +82,7 @@
 
 .nav-tabs {
   border-bottom: 1px solid $nav-tabs-border-color;
+  @include clearfix();
 
   .nav-item {
     float: left;
@@ -103,27 +103,24 @@
     @include hover-focus {
       border-color: $nav-tabs-link-hover-border-color $nav-tabs-link-hover-border-color $nav-tabs-border-color;
     }
+
+    &.disabled {
+      @include plain-hover-focus {
+        color: $nav-disabled-link-color;
+        background-color: transparent;
+        border-color: transparent;
+      }
+    }
   }
 
-  .open > .nav-link,
-  .active > .nav-link,
-  .nav-link.open,
-  .nav-link.active {
+  .nav-link.active,
+  .nav-item.open .nav-link {
     @include plain-hover-focus {
       color: $nav-tabs-active-link-hover-color;
       background-color: $nav-tabs-active-link-hover-bg;
       border-color: $nav-tabs-active-link-hover-border-color $nav-tabs-active-link-hover-border-color transparent;
     }
   }
-
-  .disabled > .nav-link,
-  .nav-link.disabled {
-    @include plain-hover-focus {
-      color: $nav-disabled-link-color;
-      background-color: transparent;
-      border-color: transparent;
-    }
-  }
 }
 
 
@@ -146,10 +143,8 @@
     @include border-radius($nav-pills-border-radius);
   }
 
-  .open > .nav-link,
-  .active > .nav-link,
-  .nav-link.open,
-  .nav-link.active {
+  .nav-link.active,
+  .nav-item.open .nav-link {
     @include plain-hover-focus {
       color: $component-active-color;
       cursor: default;