RubyGems - compass_twitter_bootstrap - Versions diffs - 2.2.2.2 → 2.3.1 - Mend

compass_twitter_bootstrap 2.2.2.2 → 2.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (83) hide show

data/stylesheets_sass/compass_twitter_bootstrap/_labels-badges.sass CHANGED

@@ -34,10 +34,12 @@
   &:empty
     display: none
-// Hover state, but only for links
+// Hover/focus state, but only for links
 a
   &.label:hover,
-  &.badge:hover
+  &.label:focus,
+  &.badge:hover,
+  &.badge:focus
     color: $white
     text-decoration: none
     cursor: pointer

data/stylesheets_sass/compass_twitter_bootstrap/_media.sass CHANGED

@@ -33,10 +33,10 @@
 // Media image alignment
 // -------------------------
-.media .pull-left
+.media > .pull-left
   margin-right: 10px
-.media .pull-right
+.media > .pull-right
   margin-left: 10px
 // Media list variation

data/stylesheets_sass/compass_twitter_bootstrap/_mixins.sass CHANGED

@@ -24,7 +24,7 @@
 // ------------------
 =ctb-tab-focus
   // Default
-  outline: thin dotted #333
+  outline: thin dotted #333333
   // Webkit
   outline: 5px auto -webkit-focus-ring-color
   outline-offset: -2px
@@ -130,15 +130,15 @@
 =ctb-input-block-level
   display: block
   width: 100%
-  min-height: 30px
-  // Make inputs at least the height of their button counterpart
+  min-height: $inputHeight
+  // Make inputs at least the height of their button counterpart (base line-height + padding + border)
   +ctb-box-sizing(border-box)
   // Makes inputs behave like true block-level elements
 // Mixin for form field states
 =ctb-formFieldState($textColor: #555555, $borderColor: #cccccc, $backgroundColor: whitesmoke)
   // Set the text color
-  > label,
+  .control-label,
   .help-block,
   .help-inline
     color: $textColor
@@ -149,6 +149,9 @@
   select,
   textarea
     color: $textColor
+  input,
+  select,
+  textarea
     border-color: $borderColor
     +ctb-box-shadow(inset 0 1px 1px rgba(0, 0, 0, 0.075))
     // Redeclare so transitions work
@@ -225,6 +228,18 @@
   -o-transition: $transition
   transition: $transition
+=ctb-transition-delay($transition-delay)
+  -webkit-transition-delay: $transition-delay
+  -moz-transition-delay: $transition-delay
+  -o-transition-delay: $transition-delay
+  transition-delay: $transition-delay
+=ctb-transition-duration($transition-duration)
+  -webkit-transition-duration: $transition-duration
+  -moz-transition-duration: $transition-duration
+  -o-transition-duration: $transition-duration
+  transition-duration: $transition-duration
 // Transformations
 =ctb-rotate($degrees)
   -webkit-transform: rotate($degrees)
@@ -250,9 +265,12 @@
 =ctb-skew($x, $y)
   -webkit-transform: skew($x, $y)
   -moz-transform: skew($x, $y)
-  -ms-transform: skew($x, $y)
+  -ms-transform: skewX($x) skewY($y)
+  // See https://github.com/twitter/bootstrap/issues/4885
   -o-transform: skew($x, $y)
   transform: skew($x, $y)
+  -webkit-backface-visibility: hidden
+  // See https://github.com/twitter/bootstrap/issues/5319
 =ctb-translate3d($x, $y, $z)
   -webkit-transform: translate3d($x, $y, $z)
@@ -392,6 +410,17 @@
   background-image: linear-gradient($deg, $startColor, $endColor)
   // Standard, IE10
+=ctb-gradient-horizontal-three-colors($startColor: #00b3ee, $midColor: #7a43b6, $colorStop: 50%, $endColor: #c3325f)
+  background-color: mix($midColor, $endColor, 80%)
+  background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from($startColor), color-stop($colorStop, $midColor), to($endColor))
+  background-image: -webkit-linear-gradient(left, $startColor, $midColor $colorStop, $endColor)
+  background-image: -moz-linear-gradient(left, $startColor, $midColor $colorStop * 100%, $endColor)
+  background-image: -o-linear-gradient(left, $startColor, $midColor $colorStop, $endColor)
+  background-image: linear-gradient(to right, $startColor, $midColor $colorStop, $endColor)
+  background-repeat: no-repeat
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{darken($startColor, 1%)}', endColorstr='#{darken($endColor, 1%)}', GradientType=0)
+  // IE9 and down, gets no color-stop at all for proper fallback
 =ctb-gradient-vertical-three-colors($startColor: #00b3ee, $midColor: #7a43b6, $colorStop: 50%, $endColor: #c3325f)
   background-color: mix($midColor, $endColor, 80%)
   background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), color-stop($colorStop, $midColor), to($endColor))
@@ -411,7 +440,7 @@
   background-image: -o-radial-gradient(circle, $innerColor, $outerColor)
   background-repeat: no-repeat
-=ctb-gradient-striped($color, $angle: 45deg)
+=ctb-gradient-striped($color: #555555, $angle: 45deg)
   background-color: $color
   background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent))
   background-image: -webkit-linear-gradient($angle, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
@@ -452,7 +481,7 @@
   /* Darken IE7 buttons by default so they stand out more given they won't have borders
   +ctb-gradient-reset-filter
   // in these cases the gradient won't cover the background, so we override
-  &:hover, &:active, &.active, &.disabled, &[disabled]
+  &:hover, &:focus, &:active, &.active, &.disabled, &[disabled]
     color: $textColor
     background-color: $endColor
     *background-color: darken($endColor, 5%)
@@ -510,6 +539,8 @@
     +ctb-clearfix
   [class*="span"]
     float: left
+    min-height: 1px
+    // prevent collapsing columns
     margin-left: $gutterWidth
   // Set the container width, and override it for fixed navbars in media queries
   .container,
@@ -552,6 +583,9 @@
       *margin-left: $gutterWidth - 0.5 / $gridRowWidth * 100px * 1%
     [class*="span"]:first-child
       margin-left: 0
+    // Space grid-sized controls properly if multiple per line
+    .controls-row [class*="span"] + [class*="span"]
+      margin-left: $gutterWidth
     // generate .spanX and .offsetX
     $i: $gridColumns
     @while $i > 0

data/stylesheets_sass/compass_twitter_bootstrap/_modals.sass CHANGED

@@ -28,9 +28,9 @@
   width: 560px
   margin-left: -280px
   background-color: $white
-  border: 1px solid #999
+  border: 1px solid #999999
   border: 1px solid rgba(0, 0, 0, 0.3)
-  *border: 1px solid #999
+  *border: 1px solid #999999
   /* IE6-7
   +ctb-border-radius(6px)
   +ctb-box-shadow(0 3px 7px rgba(0, 0, 0, 0.3))
@@ -45,7 +45,7 @@
 .modal-header
   padding: 9px 15px
-  border-bottom: 1px solid #eee
+  border-bottom: 1px solid #eeeeee
   // Close icon
   .close
     margin-top: 2px
@@ -72,7 +72,7 @@
   text-align: right
   // right align buttons
   background-color: #f5f5f5
-  border-top: 1px solid #ddd
+  border-top: 1px solid #dddddd
   +ctb-border-radius(0 0 6px 6px)
   +ctb-box-shadow(inset 0 1px 0 $white)
   +ctb-clearfix

data/stylesheets_sass/compass_twitter_bootstrap/_navbar.sass CHANGED

@@ -49,7 +49,8 @@
   font-weight: 200
   color: $navbarBrandColor
   text-shadow: 0 1px 0 $navbarBackgroundHighlight
-  &:hover
+  &:hover,
+  &:focus
     text-decoration: none
 // Plain text in topbar
@@ -63,7 +64,8 @@
 // -------------------------
 .navbar-link
   color: $navbarLinkColor
-  &:hover
+  &:hover,
+  &:focus
     color: $navbarLinkColorHover
 // Dividers in navbar
@@ -84,7 +86,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
@@ -224,12 +228,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
+  // "transparent" is default to differentiate :hover/:focus from .active
   color: $navbarLinkColorHover
   text-decoration: none
@@ -275,7 +279,7 @@
     display: inline-block
     border-left: 7px solid transparent
     border-right: 7px solid transparent
-    border-bottom: 7px solid #ccc
+    border-bottom: 7px solid #cccccc
     border-bottom-color: $dropdownBorder
     position: absolute
     top: -7px
@@ -293,7 +297,7 @@
 // Menu position and menu caret support for dropups via extra dropup class
 .navbar-fixed-bottom .nav > li > .dropdown-menu
   &:before
-    border-top: 7px solid #ccc
+    border-top: 7px solid #cccccc
     border-top-color: $dropdownBorder
     border-bottom: 0
     bottom: -7px
@@ -304,10 +308,12 @@
     bottom: -6px
     top: auto
-// 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
@@ -357,7 +363,8 @@
   .nav > li > a
     color: $navbarInverseLinkColor
     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25)
-    &:hover
+    &:hover,
+    &:focus
       color: $navbarInverseLinkColorHover
   .brand
     color: $navbarInverseBrandColor
@@ -375,7 +382,8 @@
   // Inline text links
   .navbar-link
     color: $navbarInverseLinkColor
-    &:hover
+    &:hover,
+    &:focus
       color: $navbarInverseLinkColorHover
   // Dividers in navbar
   .divider-vertical
@@ -387,7 +395,8 @@
   .nav li.dropdown.open.active > .dropdown-toggle
     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
   .nav li.dropdown > .dropdown-toggle .caret

data/stylesheets_sass/compass_twitter_bootstrap/_navs.sass CHANGED

@@ -14,7 +14,8 @@
 .nav > li > a
   display: block
-.nav > li > a:hover
+.nav > li > a:hover,
+.nav > li > a:focus
   text-decoration: none
   background-color: $grayLighter
@@ -60,7 +61,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, 0.2)
   background-color: $linkColor
@@ -99,7 +101,7 @@
 // Give the tabs something to sit on
 .nav-tabs
-  border-bottom: 1px solid #ddd
+  border-bottom: 1px solid #dddddd
 // Make the list-items overlay the bottom border
 .nav-tabs > li
@@ -112,16 +114,18 @@
   line-height: $baseLineHeight
   border: 1px solid transparent
   +ctb-border-radius(4px 4px 0 0)
-  &:hover
+  &:hover,
+  &:focus
     border-color: $grayLighter $grayLighter #dddddd
-// 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
+  border: 1px solid #dddddd
   border-bottom-color: transparent
   cursor: default
@@ -139,7 +143,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
@@ -159,7 +164,7 @@
   border-bottom: 0
 .nav-tabs.nav-stacked > li > a
-  border: 1px solid #ddd
+  border: 1px solid #dddddd
   +ctb-border-radius(0)
 .nav-tabs.nav-stacked > li:first-child > a
@@ -168,7 +173,8 @@
 .nav-tabs.nav-stacked > li:last-child > a
   +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
@@ -199,7 +205,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
@@ -217,9 +224,11 @@
   border-top-color: $gray
   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
 // Open dropdowns
@@ -227,20 +236,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
   +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
 // TABBABLE
@@ -278,7 +291,7 @@
 // ------
 .tabs-below > .nav-tabs
-  border-top: 1px solid #ddd
+  border-top: 1px solid #dddddd
 .tabs-below > .nav-tabs > li
   margin-top: -1px
@@ -286,13 +299,15 @@
 .tabs-below > .nav-tabs > li > a
   +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
-  border-color: transparent #ddd #ddd #ddd
+.tabs-below > .nav-tabs > .active > a:hover,
+.tabs-below > .nav-tabs > .active > a:focus
+  border-color: transparent #dddddd #dddddd #dddddd
 // LEFT & RIGHT
 // ------------
@@ -313,36 +328,40 @@
 .tabs-left > .nav-tabs
   float: left
   margin-right: 19px
-  border-right: 1px solid #ddd
+  border-right: 1px solid #dddddd
 .tabs-left > .nav-tabs > li > a
   margin-right: -1px
   +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 #dddddd $grayLighter $grayLighter
 .tabs-left > .nav-tabs .active > a,
-.tabs-left > .nav-tabs .active > a:hover
-  border-color: #ddd transparent #ddd #ddd
+.tabs-left > .nav-tabs .active > a:hover,
+.tabs-left > .nav-tabs .active > a:focus
+  border-color: #dddddd transparent #dddddd #dddddd
   *border-right-color: $white
 // Tabs on the right
 .tabs-right > .nav-tabs
   float: right
   margin-left: 19px
-  border-left: 1px solid #ddd
+  border-left: 1px solid #dddddd
 .tabs-right > .nav-tabs > li > a
   margin-left: -1px
   +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 #dddddd
 .tabs-right > .nav-tabs .active > a,
-.tabs-right > .nav-tabs .active > a:hover
-  border-color: #ddd #ddd #ddd transparent
+.tabs-right > .nav-tabs .active > a:hover,
+.tabs-right > .nav-tabs .active > a:focus
+  border-color: #dddddd #dddddd #dddddd transparent
   *border-left-color: $white
 // DISABLED STATES
@@ -352,8 +371,10 @@
 .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