compass_twitter_bootstrap 2.2.2.2 → 2.3.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 56d45b4741f66c2252235a7542edaacc2aaca9cb
+  data.tar.gz: 50baf78a0965f4d8d5550eb111041f7ec0fb7c5e
+SHA512:
+  metadata.gz: e03ab05de06c1a8f4ced872b5556ed82e243e94b60b4ddf8f20fb559c3ce3351aa748818e8eed838909714d38c40b87f467d5739554d3803ca93359bb1c9cf83
+  data.tar.gz: 28190d17cc07cfff5303df73f19e4622a5c5ea1f5705686bbfbe66a2a307e15312de57bb0f4ebe54905bf89909604ea1d32a186a2c7a527d80d57944894333bc

data/CHANGELOG.md

@@ -1,5 +1,8 @@
 # Overview
 
+## 2.3.1
+* Upgrade Twitter Bootstrap to 2.3.1 (@szinya)
+
 ## 2.2.2.2
 Fix cb-opacity mixin to correctly calculate opacity (@mindmelting)
 Added in clearfix utils class as per bootstrap docs (@mindmelting)

data/README.md

@@ -115,14 +115,15 @@ There is a Rake-task that will help you to fetch all recent changes from the Twi
 When that is done
 
 * update the assets
-* replace `$media ` with @media `, `$page ` with @page `, `$-ms-keyframes ` with @-ms-keyframes `, `$-o-keyframes ` with @-o-keyframes `, see https://github.com/vwall/compass-twitter-bootstrap/issues/100.
-* replace `ctb-reset-filter(` with `ctb-gradient-reset-filter(`
+* replace `$media` with `@media` , `$page` with `@page` , `$-ms-keyframes` with `@-ms-keyframes` , `$-o-keyframes` with `@-o-keyframes` , `$-ms-viewport` with `@-ms-viewport`, see https://github.com/vwall/compass-twitter-bootstrap/issues/100.
+* replace `ctb-reset-filter` with `ctb-gradient-reset-filter`
 * replace `ctb-span(` with `ctb-core-span(`
 * replace `@include ctb-opacity(100)` with `@include ctb-opacity(1)` as seen in https://github.com/vwall/compass-twitter-bootstrap/commit/b80ea1bc20f031a4abad7906ba14590bccadc74e
 * search for `(e(` and fix it
 * search for `&-` and fix it, see https://github.com/vwall/compass-twitter-bootstrap/issues/101
-* search fo `.navbar-fixed-bottom .container {` and fix it
+* search for `.navbar-fixed-bottom .container {` and fix it
 * readd the imports into _buttons.scss as seen in https://github.com/vwall/compass-twitter-bootstrap/commit/18d2d061235d5477c3a30beab9f02c7e9387f0c4
+* add utility classes defined in mixins.scss to stylesheets/_compass_twitter_bootstrap*.scss (right after importing mixins)
 
 @remark: if some Ruby-genius wants to automate this feel free
 
@@ -148,7 +149,7 @@ To get started -- checkout http://twitter.github.com/bootstrap!
 
 ##Copyright and License
 
-Copyright 2011 Twitter, Inc.
+Copyright 2012 Twitter, Inc.
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this work except in compliance with the License.

data/lib/compass_twitter_bootstrap/version.rb

@@ -1,3 +1,3 @@
 module CompassTwitterBootstrap
-  VERSION = "2.2.2.2"
+  VERSION = '2.3.1'
 end

data/stylesheets/_compass_twitter_bootstrap.scss

@@ -1,5 +1,5 @@
 /*!
- * Bootstrap v2.2.2
+ * Bootstrap v2.3.1
  *
  * Copyright 2012 Twitter, Inc
  * Licensed under the Apache License v2.0
@@ -10,14 +10,24 @@
 
 @import "compass";
 
+// Core variables and mixins
+@import "compass_twitter_bootstrap/variables"; // Modify this for custom colors, font-sizes, etc
 @import "compass_twitter_bootstrap/mixins";
 
-// CSS Reset
-@import "compass_twitter_bootstrap/reset";
+.clearfix {
+  @include ctb-clearfix();
+}
 
-// Core variables and mixins
-@import "compass_twitter_bootstrap/variables"; // Modify this for custom colors, font-sizes, etc
+.hide-text {
+  @include ctb-hide-text();
+}
+
+.input-block-level {
+  @include ctb-input-block-level();
+}
 
+// CSS Reset
+@import "compass_twitter_bootstrap/reset";
 
 // Grid system and page structure
 @import "compass_twitter_bootstrap/scaffolding";

data/stylesheets/_compass_twitter_bootstrap_awesome.scss

@@ -1,5 +1,5 @@
-/*
- * Bootstrap v2.2.2
+/*!
+ * Bootstrap v2.3.1
  *
  * Copyright 2012 Twitter, Inc
  * Licensed under the Apache License v2.0
@@ -10,14 +10,24 @@
 
 @import "compass";
 
+// Core variables and mixins
+@import "compass_twitter_bootstrap/variables"; // Modify this for custom colors, font-sizes, etc
 @import "compass_twitter_bootstrap/mixins";
 
-// CSS Reset
-@import "compass_twitter_bootstrap/reset";
+.clearfix {
+  @include ctb-clearfix();
+}
 
-// Core variables and mixins
-@import "compass_twitter_bootstrap/variables"; // Modify this for custom colors, font-sizes, etc
+.hide-text {
+  @include ctb-hide-text();
+}
+
+.input-block-level {
+  @include ctb-input-block-level();
+}
 
+// CSS Reset
+@import "compass_twitter_bootstrap/reset";
 
 // Grid system and page structure
 @import "compass_twitter_bootstrap/scaffolding";
@@ -56,6 +66,7 @@
 
 // Components: Misc
 @import "compass_twitter_bootstrap/thumbnails";
+@import "compass_twitter_bootstrap/media";
 @import "compass_twitter_bootstrap/labels-badges";
 @import "compass_twitter_bootstrap/progress-bars";
 @import "compass_twitter_bootstrap/accordion";

data/stylesheets/_compass_twitter_bootstrap_responsive.scss

@@ -1,5 +1,5 @@
 /*!
- * Bootstrap Responsive v2.1.0
+ * Bootstrap Responsive v2.3.1
  *
  * Copyright 2012 Twitter, Inc
  * Licensed under the Apache License v2.0
@@ -21,6 +21,18 @@
 @import "compass_twitter_bootstrap/variables"; // Modify this for custom colors, font-sizes, etc
 @import "compass_twitter_bootstrap/mixins";
 
+.clearfix {
+  @include ctb-clearfix();
+}
+
+.hide-text {
+  @include ctb-hide-text();
+}
+
+.input-block-level {
+  @include ctb-input-block-level();
+}
+
 
 // RESPONSIVE CLASSES
 // ------------------
@@ -31,14 +43,14 @@
 // MEDIA QUERIES
 // ------------------
 
-// Phones to portrait tablets and narrow desktops
-@import "compass_twitter_bootstrap/responsive-767px-max";
+// Large desktops
+@import "compass_twitter_bootstrap/responsive-1200px-min";
 
 // Tablets to regular desktops
 @import "compass_twitter_bootstrap/responsive-768px-979px";
 
-// Large desktops
-@import "compass_twitter_bootstrap/responsive-1200px-min";
+// Phones to portrait tablets and narrow desktops
+@import "compass_twitter_bootstrap/responsive-767px-max";
 
 
 // RESPONSIVE NAVBAR

data/stylesheets/compass_twitter_bootstrap/_button-groups.scss

@@ -164,8 +164,6 @@
   margin-left: 0;
 }
 // Carets in other button sizes
-.btn-mini .caret,
-.btn-small .caret,
 .btn-large .caret {
   margin-top: 6px;
 }
@@ -174,6 +172,10 @@
   border-right-width: 5px;
   border-top-width:   5px;
 }
+.btn-mini .caret,
+.btn-small .caret {
+  margin-top: 8px;
+}
 // Upside down carets for .dropup
 .dropup .btn-large .caret {
   border-bottom-width: 5px;

data/stylesheets/compass_twitter_bootstrap/_buttons.scss

@@ -1,5 +1,5 @@
-@import "compass_twitter_bootstrap/mixins";
 @import "compass_twitter_bootstrap/variables";
+@import "compass_twitter_bootstrap/mixins";
 
 //
 // Buttons
@@ -28,13 +28,14 @@
   @include ctb-ie7-restore-left-whitespace(); // Give IE7 some love
   @include ctb-box-shadow(#{inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)});
 
-  // Hover state
-  &:hover {
+  // Hover/focus state
+  &:hover,
+  &:focus {
     color: $grayDark;
     text-decoration: none;
     background-position: 0 -15px;
 
-    // transition is only when going to hover, otherwise the background
+    // transition is only when going to hover/focus, otherwise the background
     // behind the gradient (there for IE<=9 fallback) gets mismatched
     @include ctb-transition(background-position .1s linear);
   }
@@ -144,11 +145,6 @@ input[type="button"] {
 
 // Set the backgrounds
 // -------------------------
-.btn {
-  // reset here as of 2.0.3 due to Recess property order
-  border-color: #c5c5c5;
-  border-color: rgba(0,0,0,.15) rgba(0,0,0,.15) rgba(0,0,0,.25);
-}
 .btn-primary {
   @include ctb-buttonBackground($btnPrimaryBackground, $btnPrimaryBackgroundHighlight);
 }
@@ -222,12 +218,14 @@ input[type="submit"].btn {
   color: $linkColor;
   @include ctb-border-radius(0);
 }
-.btn-link:hover {
+.btn-link:hover,
+.btn-link:focus {
   color: $linkColorHover;
   text-decoration: underline;
   background-color: transparent;
 }
-.btn-link[disabled]:hover {
+.btn-link[disabled]:hover,
+.btn-link[disabled]:focus {
   color: $grayDark;
   text-decoration: none;
 }

data/stylesheets/compass_twitter_bootstrap/_carousel.scss

@@ -21,12 +21,13 @@
     display: none;
     position: relative;
     @include ctb-transition(.6s ease-in-out left);
-  }
 
-  // Account for jankitude on images
-  > .item > img {
-    display: block;
-    line-height: 1;
+    // Account for jankitude on images
+    > img,
+    > a > img {
+      display: block;
+      line-height: 1;
+    }
   }
 
   > .active,
@@ -97,14 +98,40 @@
     right: 15px;
   }
 
-  // Hover state
-  &:hover {
+  // Hover/focus state
+  &:hover,
+  &:focus {
     color: $white;
     text-decoration: none;
     @include ctb-opacity(90);
   }
 }
 
+// Carousel indicator pips
+// -----------------------------
+.carousel-indicators {
+  position: absolute;
+  top: 15px;
+  right: 15px;
+  z-index: 5;
+  margin: 0;
+  list-style: none;
+
+  li {
+    display: block;
+    float: left;
+    width: 10px;
+    height: 10px;
+    margin-left: 5px;
+    text-indent: -999px;
+    background-color: #ccc;
+    background-color: rgba(255,255,255,.25);
+    border-radius: 5px;
+  }
+  .active {
+    background-color: #fff;
+  }
+}
 
 // Caption for text below images
 // -----------------------------

data/stylesheets/compass_twitter_bootstrap/_close.scss

@@ -11,7 +11,8 @@
   color: $black;
   text-shadow: 0 1px 0 rgba(255,255,255,1);
   @include ctb-opacity(20);
-  &:hover {
+  &:hover,
+  &:focus {
     color: $black;
     text-decoration: none;
     cursor: pointer;

data/stylesheets/compass_twitter_bootstrap/_dropdowns.scss

@@ -72,7 +72,7 @@
   }
 
   // Links within the dropdown menu
-  li > a {
+  > li > a {
     display: block;
     padding: 3px 20px;
     clear: both;
@@ -83,11 +83,12 @@
   }
 }
 
-// Hover state
+// Hover/Focus state
 // -----------
-.dropdown-menu li > a:hover,
-.dropdown-menu li > a:focus,
-.dropdown-submenu:hover > a {
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus,
+.dropdown-submenu:hover > a,
+.dropdown-submenu:focus > a {
   text-decoration: none;
   color: $dropdownLinkColorHover;
   @include ctb-gradient-vertical($dropdownLinkBackgroundHover, darken($dropdownLinkBackgroundHover, 5%));
@@ -95,8 +96,9 @@
 
 // Active state
 // ------------
-.dropdown-menu .active > a,
-.dropdown-menu .active > a:hover {
+.dropdown-menu > .active > a,
+.dropdown-menu > .active > a:hover,
+.dropdown-menu > .active > a:focus {
   color: $dropdownLinkColorActive;
   text-decoration: none;
   outline: 0;
@@ -105,13 +107,15 @@
 
 // Disabled state
 // --------------
-// Gray out text and ensure the hover state remains gray
-.dropdown-menu .disabled > a,
-.dropdown-menu .disabled > a:hover {
+// Gray out text and ensure the hover/focus state remains gray
+.dropdown-menu > .disabled > a,
+.dropdown-menu > .disabled > a:hover,
+.dropdown-menu > .disabled > a:focus {
   color: $grayLight;
 }
-// Nuke hover effects
-.dropdown-menu .disabled > a:hover {
+// Nuke hover/focus effects
+.dropdown-menu > .disabled > a:hover,
+.dropdown-menu > .disabled > a:focus {
   text-decoration: none;
   background-color: transparent;
   background-image: none; // Remove CSS gradient

data/stylesheets/compass_twitter_bootstrap/_forms.scss

@@ -422,7 +422,9 @@ select:focus:invalid {
 // Allow us to put symbols and text within the input field for a cleaner look
 .input-append,
 .input-prepend {
-  margin-bottom: 5px;
+  display: inline-block;
+  margin-bottom: $baseLineHeight / 2;
+  vertical-align: middle;
   font-size: 0; // white space collapse hack
   white-space: nowrap; // Prevent span and input from separating
 
@@ -430,7 +432,8 @@ select:focus:invalid {
   input,
   select,
   .uneditable-input,
-  .dropdown-menu {
+  .dropdown-menu,
+  .popover {
     font-size: $baseFontSize;
   }
 

data/stylesheets/compass_twitter_bootstrap/_labels-badges.scss

@@ -35,10 +35,12 @@
   }
 }
 
-// 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/compass_twitter_bootstrap/_media.scss

@@ -37,10 +37,10 @@
 // Media image alignment
 // -------------------------
 
-.media .pull-left {
+.media > .pull-left {
   margin-right: 10px;
 }
-.media .pull-right {
+.media > .pull-right {
   margin-left: 10px;
 }
 

data/stylesheets/compass_twitter_bootstrap/_mixins.scss

@@ -111,6 +111,7 @@
   border: 0;
 }
 
+
 // FONTS
 // --------------------------------------------------
 
@@ -149,7 +150,7 @@
 @mixin 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)
   @include ctb-box-sizing(border-box); // Makes inputs behave like true block-level elements
 }
 
@@ -158,7 +159,7 @@
 // Mixin for form field states
 @mixin ctb-formFieldState($textColor: #555, $borderColor: #ccc, $backgroundColor: #f5f5f5) {
   // Set the text color
-  > label,
+  .control-label,
   .help-block,
   .help-inline {
     color: $textColor;
@@ -170,6 +171,10 @@
   select,
   textarea {
     color: $textColor;
+  }
+  input,
+  select,
+  textarea {
     border-color: $borderColor;
     @include ctb-box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
     &:focus {
@@ -255,6 +260,18 @@
        -o-transition: $transition;
           transition: $transition;
 }
+@mixin ctb-transition-delay($transition-delay) {
+  -webkit-transition-delay: $transition-delay;
+     -moz-transition-delay: $transition-delay;
+       -o-transition-delay: $transition-delay;
+          transition-delay: $transition-delay;
+}
+@mixin 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
 @mixin ctb-rotate($degrees) {
@@ -278,15 +295,14 @@
        -o-transform: translate($x, $y);
           transform: translate($x, $y);
 }
-
 @mixin 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
 }
-
 @mixin ctb-translate3d($x, $y, $z) {
   -webkit-transform: translate3d($x, $y, $z);
      -moz-transform: translate3d($x, $y, $z);
@@ -423,6 +439,16 @@
   background-image: -o-linear-gradient($deg, $startColor, $endColor); // Opera 11.10
   background-image: linear-gradient($deg, $startColor, $endColor); // Standard, IE10
 }
+@mixin 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
+}
 @mixin 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));
@@ -441,7 +467,7 @@
   background-image: -o-radial-gradient(circle, $innerColor, $outerColor);
   background-repeat: no-repeat;
 }
-@mixin ctb-gradient-striped($color, $angle: 45deg) {
+@mixin ctb-gradient-striped($color: #555, $angle: 45deg) {
   background-color: $color;
   background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
   background-image: -webkit-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
@@ -486,7 +512,7 @@
   @include 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%);
@@ -509,7 +535,6 @@
 
 
 
-
 // Grid System
 // -----------
 
@@ -556,6 +581,7 @@
 
   [class*="span"] {
     float: left;
+    min-height: 1px; // prevent collapsing columns
     margin-left: $gutterWidth;
   }
 
@@ -610,6 +636,11 @@
       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 {