_navs.scss in bootstrap-sass-3.0.1.0.rc

- old
+ new

@@ -46,19 +46,29 @@
     &,
     &:hover,
     &:focus {
       background-color: $nav-link-hover-bg;
       border-color: $link-color;
+
+      .caret {
+        border-top-color: $link-hover-color;
+        border-bottom-color: $link-hover-color;
+      }
     }
   }
 
-  // Dividers (basically an hr) within the dropdown
+  // Nav dividers (deprecated with v3.0.1)
+  //
+  // This should have been removed in v3 with the dropping of `.nav-list`, but
+  // we missed it. We don't currently support this anywhere, but in the interest
+  // of maintaining backward compatibility in case you use it, it's deprecated.
   .nav-divider {
     @include nav-divider();
   }
 
   // Prevent IE8 from misplacing imgs
+  //
   // See https://github.com/h5bp/html5-boilerplate/issues/984#issuecomment-3985989
   > li > a > img {
     max-width: none;
   }
 }
@@ -113,11 +123,11 @@
   > li {
     float: left;
 
     // Links rendered as pills
     > a {
-      border-radius: 5px;
+      border-radius: $nav-pills-border-radius;
     }
     + li {
       margin-left: 2px;
     }
 
@@ -126,10 +136,15 @@
       &,
       &:hover,
       &:focus {
         color: $nav-pills-active-link-hover-color;
         background-color: $nav-pills-active-link-hover-bg;
+
+        .caret {
+          border-top-color: $nav-pills-active-link-hover-color;
+          border-bottom-color: $nav-pills-active-link-hover-color;
+        }
       }
     }
   }
 }
 
@@ -157,55 +172,73 @@
 
   > li {
     float: none;
      > a {
       text-align: center;
+      margin-bottom: 5px;
     }
   }
 
-  @media (min-width: $screen-sm) {
+  > .dropdown .dropdown-menu {
+    top: auto;
+    left: auto;
+  }
+
+  @media (min-width: $screen-sm-min) {
     > li {
       display: table-cell;
       width: 1%;
+      > a {
+        margin-bottom: 0;
+      }
     }
   }
 }
 
 // Move borders to anchors instead of bottom of list
+//
+// Mixin for adding on top the shared `.nav-justified` styles for our tabs
 .nav-tabs-justified {
   border-bottom: 0;
-  > li > a {
-    border-bottom: 1px solid $nav-tabs-justified-link-border-color;
 
+  > li > a {
     // Override margin from .nav-tabs
     margin-right: 0;
+    border-radius: $border-radius-base;
   }
-  > .active > a {
-    border-bottom-color: $nav-tabs-justified-active-link-border-color;
+
+  > .active > a,
+  > .active > a:hover,
+  > .active > a:focus {
+    border: 1px solid $nav-tabs-justified-link-border-color;
   }
+
+  @media (min-width: $screen-sm-min) {
+    > li > a {
+      border-bottom: 1px solid $nav-tabs-justified-link-border-color;
+      border-radius: $border-radius-base $border-radius-base 0 0;
+    }
+    > .active > a,
+    > .active > a:hover,
+    > .active > a:focus {
+      border-bottom-color: $nav-tabs-justified-active-link-border-color;
+    }
+  }
 }
 
 
 // Tabbable tabs
 // -------------------------
 
-// Clear any floats
-.tabbable {
-  @include clearfix();
-}
-
-// Show/hide tabbable areas
-.tab-content > .tab-pane,
-.pill-content > .pill-pane {
-  display: none;
-}
-.tab-content,
-.pill-content {
+// Hide tabbable panes to start, show them when `.active`
+.tab-content {
+  > .tab-pane {
+    display: none;
+  }
   > .active {
     display: block;
   }
 }
-
 
 
 // Dropdowns
 // -------------------------
 