compass_twitter_bootstrap 2.2.2.2 → 2.3.1

data/stylesheets/compass_twitter_bootstrap/_navbar.scss

@@ -56,7 +56,8 @@
   font-weight: 200;
   color: $navbarBrandColor;
   text-shadow: 0 1px 0 $navbarBackgroundHighlight;
-  &:hover {
+  &:hover,
+  &:focus {
     text-decoration: none;
   }
 }
@@ -73,7 +74,8 @@
 // -------------------------
 .navbar-link {
   color: $navbarLinkColor;
-  &:hover {
+  &:hover,
+  &:focus {
     color: $navbarLinkColorHover;
   }
 }
@@ -95,7 +97,9 @@
 }
 .navbar .btn-group .btn,
 .navbar .input-prepend .btn,
-.navbar .input-append .btn {
+.navbar .input-append .btn,
+.navbar .input-prepend .btn-group,
+.navbar .input-append .btn-group {
   margin-top: 0; // then undo the margin here so we don't accidentally double it
 }
 
@@ -245,13 +249,12 @@
 }
 .navbar .nav .dropdown-toggle .caret {
   margin-top: 8px;
-
 }
 
-// Hover
+// Hover/focus
 .navbar .nav > li > a:focus,
 .navbar .nav > li > a:hover {
-  background-color: $navbarLinkBackgroundHover; // "transparent" is default to differentiate :hover from .active
+  background-color: $navbarLinkBackgroundHover; // "transparent" is default to differentiate :hover/:focus from .active
   color: $navbarLinkColorHover;
   text-decoration: none;
 }
@@ -335,10 +338,11 @@
   }
 }
 
-// Caret should match text color on hover
-.navbar .nav li.dropdown > a:hover .caret {
-  border-top-color: $navbarLinkColorActive;
-  border-bottom-color: $navbarLinkColorActive;
+// Caret should match text color on hover/focus
+.navbar .nav li.dropdown > a:hover .caret,
+.navbar .nav li.dropdown > a:focus .caret {
+  border-top-color: $navbarLinkColorHover;
+  border-bottom-color: $navbarLinkColorHover;
 }
 
 // Remove background color from open dropdown
@@ -396,7 +400,8 @@
   .nav > li > a {
     color: $navbarInverseLinkColor;
     text-shadow: 0 -1px 0 rgba(0,0,0,.25);
-    &:hover {
+    &:hover,
+    &:focus {
       color: $navbarInverseLinkColorHover;
     }
   }
@@ -425,7 +430,8 @@
   // Inline text links
   .navbar-link {
     color: $navbarInverseLinkColor;
-    &:hover {
+    &:hover,
+    &:focus {
       color: $navbarInverseLinkColorHover;
     }
   }
@@ -443,7 +449,8 @@
     background-color: $navbarInverseLinkBackgroundActive;
     color: $navbarInverseLinkColorActive;
   }
-  .nav li.dropdown > a:hover .caret {
+  .nav li.dropdown > a:hover .caret,
+  .nav li.dropdown > a:focus .caret {
     border-top-color: $navbarInverseLinkColorActive;
     border-bottom-color: $navbarInverseLinkColorActive;
   }

data/stylesheets/compass_twitter_bootstrap/_navs.scss

@@ -16,7 +16,8 @@
 .nav > li > a {
   display: block;
 }
-.nav > li > a:hover {
+.nav > li > a:hover,
+.nav > li > a:focus {
   text-decoration: none;
   background-color: $grayLighter;
 }
@@ -68,7 +69,8 @@
   padding: 3px 15px;
 }
 .nav-list > .active > a,
-.nav-list > .active > a:hover {
+.nav-list > .active > a:hover,
+.nav-list > .active > a:focus {
   color: $white;
   text-shadow: 0 -1px 0 rgba(0,0,0,.2);
   background-color: $linkColor;
@@ -122,13 +124,15 @@
   line-height: $baseLineHeight;
   border: 1px solid transparent;
   @include ctb-border-radius(4px 4px 0 0);
-  &:hover {
+  &:hover,
+  &:focus {
     border-color: $grayLighter $grayLighter #ddd;
   }
 }
-// Active state, and it's :hover to override normal :hover
+// Active state, and it's :hover/:focus to override normal :hover/:focus
 .nav-tabs > .active > a,
-.nav-tabs > .active > a:hover {
+.nav-tabs > .active > a:hover,
+.nav-tabs > .active > a:focus {
   color: $gray;
   background-color: $bodyBackground;
   border: 1px solid #ddd;
@@ -151,7 +155,8 @@
 
 // Active state
 .nav-pills > .active > a,
-.nav-pills > .active > a:hover {
+.nav-pills > .active > a:hover,
+.nav-pills > .active > a:focus {
   color: $white;
   background-color: $linkColor;
 }
@@ -183,7 +188,8 @@
 .nav-tabs.nav-stacked > li:last-child > a {
   @include ctb-border-bottom-radius(4px);
 }
-.nav-tabs.nav-stacked > li > a:hover {
+.nav-tabs.nav-stacked > li > a:hover,
+.nav-tabs.nav-stacked > li > a:focus {
   border-color: #ddd;
   z-index: 2;
 }
@@ -216,7 +222,8 @@
   border-bottom-color: $linkColor;
   margin-top: 6px;
 }
-.nav .dropdown-toggle:hover .caret {
+.nav .dropdown-toggle:hover .caret,
+.nav .dropdown-toggle:focus .caret {
   border-top-color: $linkColorHover;
   border-bottom-color: $linkColorHover;
 }
@@ -236,9 +243,10 @@
   border-bottom-color: $gray;
 }
 
-// Active:hover dropdown links
+// Active:hover/:focus dropdown links
 // -------------------------
-.nav > .dropdown.active > a:hover {
+.nav > .dropdown.active > a:hover,
+.nav > .dropdown.active > a:focus {
   cursor: pointer;
 }
 
@@ -246,21 +254,24 @@
 // -------------------------
 .nav-tabs .open .dropdown-toggle,
 .nav-pills .open .dropdown-toggle,
-.nav > li.dropdown.open.active > a:hover {
+.nav > li.dropdown.open.active > a:hover,
+.nav > li.dropdown.open.active > a:focus {
   color: $white;
   background-color: $grayLight;
   border-color: $grayLight;
 }
 .nav li.dropdown.open .caret,
 .nav li.dropdown.open.active .caret,
-.nav li.dropdown.open a:hover .caret {
+.nav li.dropdown.open a:hover .caret,
+.nav li.dropdown.open a:focus .caret {
   border-top-color: $white;
   border-bottom-color: $white;
   @include ctb-opacity(1);
 }
 
 // Dropdowns in stacked tabs
-.tabs-stacked .open > a:hover {
+.tabs-stacked .open > a:hover,
+.tabs-stacked .open > a:focus {
   border-color: $grayLight;
 }
 
@@ -311,13 +322,15 @@
 }
 .tabs-below > .nav-tabs > li > a {
   @include ctb-border-radius(0 0 4px 4px);
-  &:hover {
+  &:hover,
+  &:focus {
     border-bottom-color: transparent;
     border-top-color: #ddd;
   }
 }
 .tabs-below > .nav-tabs > .active > a,
-.tabs-below > .nav-tabs > .active > a:hover {
+.tabs-below > .nav-tabs > .active > a:hover,
+.tabs-below > .nav-tabs > .active > a:focus {
   border-color: transparent #ddd #ddd #ddd;
 }
 
@@ -346,11 +359,13 @@
   margin-right: -1px;
   @include ctb-border-radius(4px 0 0 4px);
 }
-.tabs-left > .nav-tabs > li > a:hover {
+.tabs-left > .nav-tabs > li > a:hover,
+.tabs-left > .nav-tabs > li > a:focus {
   border-color: $grayLighter #ddd $grayLighter $grayLighter;
 }
 .tabs-left > .nav-tabs .active > a,
-.tabs-left > .nav-tabs .active > a:hover {
+.tabs-left > .nav-tabs .active > a:hover,
+.tabs-left > .nav-tabs .active > a:focus {
   border-color: #ddd transparent #ddd #ddd;
   *border-right-color: $white;
 }
@@ -365,11 +380,13 @@
   margin-left: -1px;
   @include ctb-border-radius(0 4px 4px 0);
 }
-.tabs-right > .nav-tabs > li > a:hover {
+.tabs-right > .nav-tabs > li > a:hover,
+.tabs-right > .nav-tabs > li > a:focus {
   border-color: $grayLighter $grayLighter $grayLighter #ddd;
 }
 .tabs-right > .nav-tabs .active > a,
-.tabs-right > .nav-tabs .active > a:hover {
+.tabs-right > .nav-tabs .active > a:hover,
+.tabs-right > .nav-tabs .active > a:focus {
   border-color: #ddd #ddd #ddd transparent;
   *border-left-color: $white;
 }
@@ -383,8 +400,9 @@
 .nav > .disabled > a {
   color: $grayLight;
 }
-// Nuke hover effects
-.nav > .disabled > a:hover {
+// Nuke hover/focus effects
+.nav > .disabled > a:hover,
+.nav > .disabled > a:focus {
   text-decoration: none;
   background-color: transparent;
   cursor: default;

data/stylesheets/compass_twitter_bootstrap/_pager.scss

@@ -20,7 +20,8 @@
   border: 1px solid #ddd;
   @include ctb-border-radius(15px);
 }
-.pager li > a:hover {
+.pager li > a:hover,
+.pager li > a:focus {
   text-decoration: none;
   background-color: #f5f5f5;
 }
@@ -34,6 +35,7 @@
 }
 .pager .disabled > a,
 .pager .disabled > a:hover,
+.pager .disabled > a:focus,
 .pager .disabled > span {
   color: $grayLight;
   background-color: #fff;

data/stylesheets/compass_twitter_bootstrap/_pagination.scss

@@ -32,6 +32,7 @@
   border-left-width: 0;
 }
 .pagination ul > li > a:hover,
+.pagination ul > li > a:focus,
 .pagination ul > .active > a,
 .pagination ul > .active > span {
   background-color: $paginationActiveBackground;
@@ -43,7 +44,8 @@
 }
 .pagination ul > .disabled > span,
 .pagination ul > .disabled > a,
-.pagination ul > .disabled > a:hover {
+.pagination ul > .disabled > a:hover,
+.pagination ul > .disabled > a:focus {
   color: $grayLight;
   background-color: transparent;
   cursor: default;

data/stylesheets/compass_twitter_bootstrap/_popovers.scss

@@ -9,7 +9,7 @@
   left: 0;
   z-index: $zindexPopover;
   display: none;
-  width: 236px;
+  max-width: 276px;
   padding: 1px;
   text-align: left; // Reset given new insertion method
   background-color: $popoverBackground;
@@ -40,6 +40,10 @@
   background-color: $popoverTitleBackground;
   border-bottom: 1px solid darken($popoverTitleBackground, 5%);
   @include ctb-border-radius(5px 5px 0 0);
+
+  &:empty {
+    display: none;
+  }
 }
 
 .popover-content {

data/stylesheets/compass_twitter_bootstrap/_responsive-767px-max.scss

@@ -72,8 +72,8 @@
     @include ctb-box-sizing(border-box);
   }
   .row-fluid [class*="offset"]:first-child {
-		margin-left: 0;
-	}
+    margin-left: 0;
+  }
 
   // FORM FIELDS
   // -----------

data/stylesheets/compass_twitter_bootstrap/_responsive-navbar.scss

@@ -81,7 +81,9 @@
     margin-bottom: 2px;
   }
   .nav-collapse .nav > li > a:hover,
-  .nav-collapse .dropdown-menu a:hover {
+  .nav-collapse .nav > li > a:focus,
+  .nav-collapse .dropdown-menu a:hover,
+  .nav-collapse .dropdown-menu a:focus {
     background-color: $navbarBackground;
   }
   .navbar-inverse .nav-collapse .nav > li > a,
@@ -89,7 +91,9 @@
     color: $navbarInverseLinkColor;
   }
   .navbar-inverse .nav-collapse .nav > li > a:hover,
-  .navbar-inverse .nav-collapse .dropdown-menu a:hover {
+  .navbar-inverse .nav-collapse .nav > li > a:focus,
+  .navbar-inverse .nav-collapse .dropdown-menu a:hover,
+  .navbar-inverse .nav-collapse .dropdown-menu a:focus {
     background-color: $navbarInverseBackground;
   }
   // Buttons in the navbar

data/stylesheets/compass_twitter_bootstrap/_responsive-utilities.scss

@@ -3,6 +3,13 @@
 // --------------------------------------------------
 
 
+// IE10 Metro responsive
+// Required for Windows 8 Metro split-screen snapping with IE10
+// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/
+@-ms-viewport{
+  width: device-width;
+}
+
 // Hide from screenreaders and browsers
 // Credit: HTML5 Boilerplate
 .hidden {
@@ -41,3 +48,12 @@
   // Hide
   .hidden-phone      { display: none !important; }
 }
+
+// Print utilities
+.visible-print    { display: none !important; }
+.hidden-print     { }
+
+@media print {
+  .visible-print  { display: inherit !important; }
+  .hidden-print   { display: none !important; }
+}

data/stylesheets/compass_twitter_bootstrap/_scaffolding.scss

@@ -23,7 +23,8 @@ a {
   color: $linkColor;
   text-decoration: none;
 }
-a:hover {
+a:hover,
+a:focus {
   color: $linkColorHover;
   text-decoration: underline;
 }

data/stylesheets/compass_twitter_bootstrap/_sprites.scss

@@ -28,7 +28,7 @@
   margin-top: 1px;
 }
 
-/* White icons with optional class, or on hover/active states of certain elements */
+/* White icons with optional class, or on hover/focus/active states of certain elements */
 .icon-white,
 .nav-pills > .active > a > [class^="icon-"],
 .nav-pills > .active > a > [class*=" icon-"],
@@ -37,11 +37,15 @@
 .navbar-inverse .nav > .active > a > [class^="icon-"],
 .navbar-inverse .nav > .active > a > [class*=" icon-"],
 .dropdown-menu > li > a:hover > [class^="icon-"],
+.dropdown-menu > li > a:focus > [class^="icon-"],
 .dropdown-menu > li > a:hover > [class*=" icon-"],
+.dropdown-menu > li > a:focus > [class*=" icon-"],
 .dropdown-menu > .active > a > [class^="icon-"],
 .dropdown-menu > .active > a > [class*=" icon-"],
 .dropdown-submenu:hover > a > [class^="icon-"],
-.dropdown-submenu:hover > a > [class*=" icon-"] {
+.dropdown-submenu:focus > a > [class^="icon-"],
+.dropdown-submenu:hover > a > [class*=" icon-"],
+.dropdown-submenu:focus > a > [class*=" icon-"] {
   background-image: image-url("#{$iconWhiteSpritePath}");
 }
 
@@ -166,7 +170,7 @@
 .icon-chevron-down       { background-position: -313px -119px; } // 1px, 1px off
 .icon-retweet            { background-position: -336px -120px; }
 .icon-shopping-cart      { background-position: -360px -120px; }
-.icon-folder-close       { background-position: -384px -120px; }
+.icon-folder-close       { background-position: -384px -120px; width: 16px; }
 .icon-folder-open        { background-position: -408px -120px; width: 16px; }
 .icon-resize-vertical    { background-position: -432px -119px; } // 1px, 1px off
 .icon-resize-horizontal  { background-position: -456px -118px; } // 1px, 2px off

data/stylesheets/compass_twitter_bootstrap/_tables.scss

@@ -93,24 +93,32 @@ table {
   tbody:first-child tr:first-child td {
     border-top: 0;
   }
-  // For first th or td in the first row in the first thead or tbody
+  // For first th/td in the first row in the first thead or tbody
   thead:first-child tr:first-child > th:first-child,
-  tbody:first-child tr:first-child > td:first-child {
+  tbody:first-child tr:first-child > td:first-child,
+  tbody:first-child tr:first-child > th:first-child {
     @include ctb-border-top-left-radius($baseBorderRadius);
   }
+  // For last th/td in the first row in the first thead or tbody
   thead:first-child tr:first-child > th:last-child,
-  tbody:first-child tr:first-child > td:last-child {
+  tbody:first-child tr:first-child > td:last-child,
+  tbody:first-child tr:first-child > th:last-child {
     @include ctb-border-top-right-radius($baseBorderRadius);
   }
-  // For first th or td in the last row in the last thead or tbody
+  // For first th/td (can be either) in the last row in the last thead, tbody, and tfoot
   thead:last-child tr:last-child > th:first-child,
   tbody:last-child tr:last-child > td:first-child,
-  tfoot:last-child tr:last-child > td:first-child {
+  tbody:last-child tr:last-child > th:first-child,
+  tfoot:last-child tr:last-child > td:first-child,
+  tfoot:last-child tr:last-child > th:first-child {
     @include ctb-border-bottom-left-radius($baseBorderRadius);
   }
+  // For last th/td (can be either) in the last row in the last thead, tbody, and tfoot
   thead:last-child tr:last-child > th:last-child,
   tbody:last-child tr:last-child > td:last-child,
-  tfoot:last-child tr:last-child > td:last-child {
+  tbody:last-child tr:last-child > th:last-child,
+  tfoot:last-child tr:last-child > td:last-child,
+  tfoot:last-child tr:last-child > th:last-child {
     @include ctb-border-bottom-right-radius($baseBorderRadius);
   }
 
@@ -122,7 +130,6 @@ table {
     @include ctb-border-bottom-right-radius(0);
   }
 
-
   // Special fixes to round the left border on the first td/th
   caption + thead tr:first-child th:first-child,
   caption + tbody tr:first-child td:first-child,
@@ -161,8 +168,8 @@ table {
 // Placed here since it has to come after the potential zebra striping
 .table-hover {
   tbody {
-    tr:hover td,
-    tr:hover th {
+    tr:hover > td,
+    tr:hover > th {
       background-color: $tableBackgroundHover;
     }
   }
@@ -206,32 +213,32 @@ table th[class*="span"],
 // Exact selectors below required to override .table-striped
 
 .table tbody tr {
-  &.success td {
+  &.success > td {
     background-color: $successBackground;
   }
-  &.error td {
+  &.error > td {
     background-color: $errorBackground;
   }
-  &.warning td {
+  &.warning > td {
     background-color: $warningBackground;
   }
-  &.info td {
+  &.info > td {
     background-color: $infoBackground;
   }
 }
 
 // Hover states for .table-hover
 .table-hover tbody tr {
-  &.success:hover td {
+  &.success:hover > td {
     background-color: darken($successBackground, 5%);
   }
-  &.error:hover td {
+  &.error:hover > td {
     background-color: darken($errorBackground, 5%);
   }
-  &.warning:hover td {
+  &.warning:hover > td {
     background-color: darken($warningBackground, 5%);
   }
-  &.info:hover td {
+  &.info:hover > td {
     background-color: darken($infoBackground, 5%);
   }
 }