bootstrap-sass-rails 3.0.0.0.rc2 → 3.0.0.0

data/app/assets/stylesheets/twitter/bootstrap/_grid.scss

@@ -8,7 +8,7 @@
   @include container-fixed();
 }
 
-// Mobile-first defaults
+// mobile first defaults
 .row {
   @include make-row();
 }
@@ -223,6 +223,7 @@
   .col-md-12 { width: 100%; }
 
   // Push and pull columns for source order changes
+  .col-md-push-0  { left: auto; }
   .col-md-push-1  { left: percentage((1 / $grid-columns)); }
   .col-md-push-2  { left: percentage((2 / $grid-columns)); }
   .col-md-push-3  { left: percentage((3 / $grid-columns)); }
@@ -235,6 +236,7 @@
   .col-md-push-10 { left: percentage((10/ $grid-columns)); }
   .col-md-push-11 { left: percentage((11/ $grid-columns)); }
 
+  .col-md-pull-0  { right: auto; }
   .col-md-pull-1  { right: percentage((1 / $grid-columns)); }
   .col-md-pull-2  { right: percentage((2 / $grid-columns)); }
   .col-md-pull-3  { right: percentage((3 / $grid-columns)); }
@@ -248,6 +250,7 @@
   .col-md-pull-11 { right: percentage((11/ $grid-columns)); }
 
   // Offsets
+  .col-md-offset-0  { margin-left: 0; }
   .col-md-offset-1  { margin-left: percentage((1 / $grid-columns)); }
   .col-md-offset-2  { margin-left: percentage((2 / $grid-columns)); }
   .col-md-offset-3  { margin-left: percentage((3 / $grid-columns)); }
@@ -269,9 +272,9 @@
 // Note that `.col-lg-12` doesn't get floated on purpose—there's no need since
 // it's full-width.
 
-@media (min-width: $screen-large-desktop) {
+@media (min-width: $screen-lg-desktop) {
   .container {
-    max-width: $container-large-desktop;
+    max-width: $container-lg-desktop;
   }
 
   .col-lg-1,
@@ -301,6 +304,7 @@
   .col-lg-12 { width: 100%; }
 
   // Push and pull columns for source order changes
+  .col-lg-push-0  { left: auto; }
   .col-lg-push-1  { left: percentage((1 / $grid-columns)); }
   .col-lg-push-2  { left: percentage((2 / $grid-columns)); }
   .col-lg-push-3  { left: percentage((3 / $grid-columns)); }
@@ -313,6 +317,7 @@
   .col-lg-push-10 { left: percentage((10/ $grid-columns)); }
   .col-lg-push-11 { left: percentage((11/ $grid-columns)); }
 
+  .col-lg-pull-0  { right: auto; }
   .col-lg-pull-1  { right: percentage((1 / $grid-columns)); }
   .col-lg-pull-2  { right: percentage((2 / $grid-columns)); }
   .col-lg-pull-3  { right: percentage((3 / $grid-columns)); }
@@ -326,6 +331,7 @@
   .col-lg-pull-11 { right: percentage((11/ $grid-columns)); }
 
   // Offsets
+  .col-lg-offset-0  { margin-left: 0; }
   .col-lg-offset-1  { margin-left: percentage((1 / $grid-columns)); }
   .col-lg-offset-2  { margin-left: percentage((2 / $grid-columns)); }
   .col-lg-offset-3  { margin-left: percentage((3 / $grid-columns)); }

data/app/assets/stylesheets/twitter/bootstrap/_input-groups.scss

@@ -32,7 +32,7 @@
 .input-group-lg > .input-group-btn > .btn { @extend .input-lg; }
 .input-group-sm > .form-control,
 .input-group-sm > .input-group-addon,
-.input-group-lg > .input-group-btn > .btn { @extend .input-sm; }
+.input-group-sm > .input-group-btn > .btn { @extend .input-sm; }
 
 
 // Display as table-cell

data/app/assets/stylesheets/twitter/bootstrap/_jumbotron.scss

@@ -4,13 +4,14 @@
 
 
 .jumbotron {
-  padding: 30px;
-  margin-bottom: 30px;
+  padding: $jumbotron-padding;
+  margin-bottom: $jumbotron-padding;
   font-size: ($font-size-base * 1.5);
   font-weight: 200;
   line-height: ($line-height-base * 1.5);
-  color: $jumbotron-lead-color;
+  color: $jumbotron-color;
   background-color: $jumbotron-bg;
+
   h1 {
     line-height: 1;
     color: $jumbotron-heading-color;
@@ -19,9 +20,19 @@
     line-height: 1.4;
   }
 
+  .container & {
+    border-radius: $border-radius-large; // Only round corners at higher resolutions if contained in a container
+  }
+
   @media screen and (min-width: $screen-tablet) {
-    padding: 50px 60px;
-    border-radius: $border-radius-large; // Only round corners at higher resolutions
+    padding-top:    ($jumbotron-padding * 1.6);
+    padding-bottom: ($jumbotron-padding * 1.6);
+
+    .container & {
+      padding-left:  ($jumbotron-padding * 2);
+      padding-right: ($jumbotron-padding * 2);
+    }
+
     h1 {
       font-size: ($font-size-base * 4.5);
     }

data/app/assets/stylesheets/twitter/bootstrap/_labels.scss

@@ -4,7 +4,7 @@
 
 .label {
   display: inline;
-  padding: .25em .6em;
+  padding: .2em .6em .3em;
   font-size: 75%;
   font-weight: bold;
   line-height: 1;
@@ -37,18 +37,22 @@
   @include label-variant($label-default-bg);
 }
 
-.label-danger {
-  @include label-variant($label-danger-bg);
+.label-primary {
+  @include label-variant($label-primary-bg);
 }
 
 .label-success {
   @include label-variant($label-success-bg);
 }
 
+.label-info {
+  @include label-variant($label-info-bg);
+}
+
 .label-warning {
   @include label-variant($label-warning-bg);
 }
 
-.label-info {
-  @include label-variant($label-info-bg);
+.label-danger {
+  @include label-variant($label-danger-bg);
 }

data/app/assets/stylesheets/twitter/bootstrap/_list-group.scss

@@ -55,6 +55,11 @@
     .list-group-item-heading {
       color: inherit;
     }
+    .list-group-item-text {
+      color: lighten($list-group-active-bg, 40%);
+    }
+  }
+}
 // Linked list items
 a.list-group-item {
   color: $list-group-link-color;
@@ -70,11 +75,6 @@ a.list-group-item {
     background-color: $list-group-hover-bg;
   }
 }
-    .list-group-item-text {
-      color: lighten($list-group-active-bg, 40%);
-    }
-  }
-}
 
 // Custom content options
 // -------------------------

data/app/assets/stylesheets/twitter/bootstrap/_mixins.scss

@@ -286,7 +286,7 @@
 
 // Reset filters for IE
 //
-// When you need to remove a gradient background, don't forget to use this to reset
+// When you need to remove a gradient background, do not forget to use this to reset
 // the IE filter for IE9 and below.
 @mixin reset-filter() {
   filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
@@ -294,10 +294,10 @@
 
 
 
-// RETINA IMAGE SUPPORT
-// --------------------------------------------------
-
+// Retina images
+//
 // Short retina mixin for setting background-image and -size
+
 @mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
   background-image: url("$file-1x");
 
@@ -314,6 +314,17 @@
 }
 
 
+// Responsive image
+//
+// Keep images from scaling beyond the width of their parents.
+
+@mixin img-responsive($display: block) {
+  display: $display;
+  max-width: 100%; // Part 1: Set a maximum relative to the parent
+  height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
+}
+
+
 // COMPONENT MIXINS
 // --------------------------------------------------
 
@@ -331,7 +342,7 @@
 // -------------------------
 @mixin panel-variant($border, $heading-text-color, $heading-bg-color, $heading-border) {
   border-color: $border;
-  .panel-heading {
+  & > .panel-heading {
     color: $heading-text-color;
     background-color: $heading-bg-color;
     border-color: $heading-border;
@@ -339,7 +350,7 @@
       border-top-color: $border;
     }
   }
-  .panel-footer {
+  & > .panel-footer {
     + .panel-collapse .panel-body {
       border-bottom-color: $border;
     }
@@ -360,27 +371,62 @@
   }
 }
 
+// Tables
+// -------------------------
+@mixin table-row-variant($state, $background, $border) {
+  // Exact selectors below required to override `.table-striped` and prevent
+  // inheritance to nested tables.
+  .table > thead > tr,
+  .table > tbody > tr,
+  .table > tfoot > tr {
+    > td.#{$state},
+    > th.#{$state},
+    &.#{$state} > td,
+    &.#{$state} > th {
+      background-color: $background;
+      border-color: $border;
+    }
+  }
+
+  // Hover states for `.table-hover`
+  // Note: this is not available for cells or rows within `thead` or `tfoot`.
+  .table-hover > tbody > tr {
+    > td.#{$state}:hover,
+    > th.#{$state}:hover,
+    &.#{$state}:hover > td {
+      background-color: darken($background, 5%);
+      border-color: darken($border, 5%);
+    }
+  }
+}
+
 // Button variants
 // -------------------------
 // Easily pump out default styles, as well as :hover, :focus, :active,
 // and disabled options for all buttons
-@mixin button-variant($color, $background, $border) {
-  color: $color;
-  background-color: $background;
-  border-color: $border;
-
-  &:hover,
-  &:focus,
-  &:active,
-  &.active {
+@mixin button-variant($parent, $color, $background, $border) {
+  #{$parent} {
+    color: $color;
+    background-color: $background;
+    border-color: $border;
+  }
+  #{$parent}:hover,
+  #{$parent}:focus,
+  #{$parent}:active,
+  #{$parent}.active,
+  .open .dropdown-toggle#{$parent} {
     color: $color;
     background-color: darken($background, 8%);
         border-color: darken($border, 12%);
   }
-
-  &.disabled,
-  &[disabled],
-  fieldset[disabled] & {
+  #{$parent}:active,
+  #{$parent}.active,
+  .open .dropdown-toggle#{$parent} {
+    background-image: none;
+  }
+  #{$parent}.disabled,
+  #{$parent}[disabled],
+  fieldset[disabled] #{$parent} {
     &,
     &:hover,
     &:focus,
@@ -459,18 +505,14 @@
 // -------------------------
 // More easily include all the states for responsive-utilities.less.
 @mixin responsive-visibility($parent) {
-  #{$parent} { 
-    display: block !important;
-  }
+  #{$parent} { display: block !important; }
   tr#{$parent} { display: table-row !important; }
   th#{$parent},
   td#{$parent} { display: table-cell !important; }
 }
 
 @mixin responsive-invisibility($parent) {
-  #{$parent} { 
-    display: none !important;
-  }
+  #{$parent} { display: none !important; }
   tr#{$parent} { display: none !important; }
   th#{$parent},
   td#{$parent} { display: none !important; }
@@ -483,43 +525,28 @@
 @mixin container-fixed() {
   margin-right: auto;
   margin-left: auto;
+  padding-left:  ($grid-gutter-width / 2);
+  padding-right: ($grid-gutter-width / 2);
   @include clearfix();
 }
 
 // Creates a wrapper for a series of columns
 @mixin make-row($gutter: $grid-gutter-width) {
-  // Then clear the floated columns
+  margin-left:  ($gutter / -2);
+  margin-right: ($gutter / -2);
   @include clearfix();
-
-  .container & {
-    @media (min-width: $screen-small) {
-      margin-left:  ($gutter / -2);
-      margin-right: ($gutter / -2);
-    }
-  }
-
-  // Negative margin nested rows out to align the content of columns
-  .row {
-    margin-left:  ($gutter / -2);
-    margin-right: ($gutter / -2);
-  }
 }
 
 // Generate the extra small columns
 @mixin make-xs-column($columns, $gutter: $grid-gutter-width) {
   position: relative;
   float: left;
+  width: percentage(($columns / $grid-columns));
   // Prevent columns from collapsing when empty
   min-height: 1px;
   // Inner gutter via padding
   padding-left:  ($gutter / 2);
   padding-right: ($gutter / 2);
-  $max-width: ($screen-small - 1);
-
-  // Calculate width based on number of columns available
-  @media (max-width: $max-width) {
-    width: percentage(($columns / $grid-columns));
-  }
 }
 
 // Generate the small columns
@@ -532,7 +559,7 @@
   padding-right: ($gutter / 2);
 
   // Calculate width based on number of columns available
-  @media (min-width: $screen-small) {
+  @media (min-width: $screen-sm) {
     float: left;
     width: percentage(($columns / $grid-columns));
   }
@@ -540,17 +567,17 @@
 
 // Generate the small column offsets
 @mixin make-sm-column-offset($columns) {
-  @media (min-width: $screen-small) {
+  @media (min-width: $screen-sm) {
     margin-left: percentage(($columns / $grid-columns));
   }
 }
 @mixin make-sm-column-push($columns) {
-  @media (min-width: $screen-small) {
+  @media (min-width: $screen-sm) {
     left: percentage(($columns / $grid-columns));
   }
 }
 @mixin make-sm-column-pull($columns) {
-  @media (min-width: $screen-small) {
+  @media (min-width: $screen-sm) {
     right: percentage(($columns / $grid-columns));
   }
 }
@@ -565,7 +592,7 @@
   padding-right: ($gutter / 2);
 
   // Calculate width based on number of columns available
-  @media (min-width: $screen-medium) {
+  @media (min-width: $screen-md) {
     float: left;
     width: percentage(($columns / $grid-columns));
   }
@@ -573,17 +600,17 @@
 
 // Generate the large column offsets
 @mixin make-md-column-offset($columns) {
-  @media (min-width: $screen-medium) {
+  @media (min-width: $screen-md) {
     margin-left: percentage(($columns / $grid-columns));
   }
 }
 @mixin make-md-column-push($columns) {
-  @media (min-width: $screen-medium) {
+  @media (min-width: $screen-md) {
     left: percentage(($columns / $grid-columns));
   }
 }
 @mixin make-md-column-pull($columns) {
-  @media (min-width: $screen-medium) {
+  @media (min-width: $screen-md) {
     right: percentage(($columns / $grid-columns));
   }
 }
@@ -598,7 +625,7 @@
   padding-right: ($gutter / 2);
 
   // Calculate width based on number of columns available
-  @media (min-width: $screen-large) {
+  @media (min-width: $screen-lg) {
     float: left;
     width: percentage(($columns / $grid-columns));
   }
@@ -606,17 +633,17 @@
 
 // Generate the large column offsets
 @mixin make-lg-column-offset($columns) {
-  @media (min-width: $screen-large) {
+  @media (min-width: $screen-lg) {
     margin-left: percentage(($columns / $grid-columns));
   }
 }
 @mixin make-lg-column-push($columns) {
-  @media (min-width: $screen-large) {
+  @media (min-width: $screen-lg) {
     left: percentage(($columns / $grid-columns));
   }
 }
 @mixin make-lg-column-pull($columns) {
-  @media (min-width: $screen-large) {
+  @media (min-width: $screen-lg) {
     right: percentage(($columns / $grid-columns));
   }
 }
@@ -680,7 +707,7 @@
 // element gets special love because it's special, and that's a fact!
 
 @mixin input-size($parent, $input-height, $padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
-  #{$parent} { 
+  #{$parent} {
     height: $input-height;
     padding: $padding-vertical $padding-horizontal;
     font-size: $font-size;
@@ -691,7 +718,7 @@
     height: $input-height;
     line-height: $input-height;
   }
-  
+
   textarea#{$parent} {
     height: auto;
   }