bootstrap-on-rails 0.0.1 → 0.0.2

data/app/assets/stylesheets/bootstrap/theme.less

@@ -31,8 +31,9 @@
 }
 
 // Mixin for generating new styles
-.btn-styles(@btn-color: #555;) {
+.btn-styles(@btn-color: #555) {
   #gradient > .vertical(@start-color: @btn-color; @end-color: darken(@btn-color, 12%));
+  .reset-filter(); // Disable gradients for IE9 because filter bleeds through rounded corners
   background-repeat: repeat-x;
   border-color: darken(@btn-color, 14%);
 
@@ -59,7 +60,7 @@
 }
 
 // Apply the mixin to the buttons
-.btn-default { .btn-styles(@btn-default-bg;); text-shadow: 0 1px 0 #fff; border-color: #ccc; }
+.btn-default { .btn-styles(@btn-default-bg); text-shadow: 0 1px 0 #fff; border-color: #ccc; }
 .btn-primary { .btn-styles(@btn-primary-bg); }
 .btn-success { .btn-styles(@btn-success-bg); }
 .btn-warning { .btn-styles(@btn-warning-bg); }
@@ -84,12 +85,15 @@
 // --------------------------------------------------
 
 .dropdown-menu > li > a:hover,
-.dropdown-menu > li > a:focus,
+.dropdown-menu > li > a:focus {
+  #gradient > .vertical(@start-color: @dropdown-link-hover-bg; @end-color: darken(@dropdown-link-hover-bg, 5%));
+  background-color: darken(@dropdown-link-hover-bg, 5%);
+}
 .dropdown-menu > .active > a,
 .dropdown-menu > .active > a:hover,
 .dropdown-menu > .active > a:focus {
-  #gradient > .vertical(@start-color: @dropdown-link-hover-bg; @end-color: darken(@dropdown-link-hover-bg, 5%));
-  background-color: darken(@dropdown-link-hover-bg, 5%);
+  #gradient > .vertical(@start-color: @dropdown-link-active-bg; @end-color: darken(@dropdown-link-active-bg, 5%));
+  background-color: darken(@dropdown-link-active-bg, 5%);
 }
 
 
@@ -100,13 +104,14 @@
 
 // Default navbar
 .navbar-default {
-  #gradient > .vertical(@start-color: lighten(@navbar-default-bg, 10%); @end-color: @navbar-default-bg;);
+  #gradient > .vertical(@start-color: lighten(@navbar-default-bg, 10%); @end-color: @navbar-default-bg);
+  .reset-filter(); // Remove gradient in IE<10 to fix bug where dropdowns don't get triggered
   border-radius: @navbar-border-radius;
   @shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 5px rgba(0,0,0,.075);
   .box-shadow(@shadow);
 
   .navbar-nav > .active > a {
-    #gradient > .vertical(@start-color: darken(@navbar-default-bg, 5%); @end-color: darken(@navbar-default-bg, 2%););
+    #gradient > .vertical(@start-color: darken(@navbar-default-bg, 5%); @end-color: darken(@navbar-default-bg, 2%));
     .box-shadow(inset 0 3px 9px rgba(0,0,0,.075));
   }
 }
@@ -117,10 +122,11 @@
 
 // Inverted navbar
 .navbar-inverse {
-  #gradient > .vertical(@start-color: lighten(@navbar-inverse-bg, 10%); @end-color: @navbar-inverse-bg;);
+  #gradient > .vertical(@start-color: lighten(@navbar-inverse-bg, 10%); @end-color: @navbar-inverse-bg);
+  .reset-filter(); // Remove gradient in IE<10 to fix bug where dropdowns don't get triggered
 
   .navbar-nav > .active > a {
-    #gradient > .vertical(@start-color: @navbar-inverse-bg; @end-color: lighten(@navbar-inverse-bg, 2.5%););
+    #gradient > .vertical(@start-color: @navbar-inverse-bg; @end-color: lighten(@navbar-inverse-bg, 2.5%));
     .box-shadow(inset 0 3px 9px rgba(0,0,0,.25));
   }
 
@@ -170,7 +176,7 @@
 
 // Give the progress background some depth
 .progress {
-  #gradient > .vertical(@start-color: darken(@progress-bg, 4%); @end-color: @progress-bg;)
+  #gradient > .vertical(@start-color: darken(@progress-bg, 4%); @end-color: @progress-bg)
 }
 
 // Mixin for generating new styles
@@ -234,7 +240,7 @@
 // --------------------------------------------------
 
 .well {
-  #gradient > .vertical(@start-color: darken(@well-bg, 5%); @end-color: @well-bg;);
+  #gradient > .vertical(@start-color: darken(@well-bg, 5%); @end-color: @well-bg);
   border-color: darken(@well-bg, 10%);
   @shadow: inset 0 1px 3px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1);
   .box-shadow(@shadow);

data/app/assets/stylesheets/bootstrap/thumbnails.less

@@ -7,25 +7,24 @@
 .thumbnail {
   .img-thumbnail();
   display: block; // Override the inline-block from `.img-thumbnail`
+  margin-bottom: @line-height-computed;
 
   > img {
     .img-responsive();
+    margin-left: auto;
+    margin-right: auto;
   }
-}
-
 
-// Add a hover state for linked versions only
-a.thumbnail:hover,
-a.thumbnail:focus {
-  border-color: @link-color;
-}
+  // Add a hover state for linked versions only
+  a&:hover,
+  a&:focus,
+  a&.active {
+    border-color: @link-color;
+  }
 
-// Images and captions
-.thumbnail > img {
-  margin-left: auto;
-  margin-right: auto;
-}
-.thumbnail .caption {
-  padding: @thumbnail-caption-padding;
-  color: @thumbnail-caption-color;
+  // Image captions
+  .caption {
+    padding: @thumbnail-caption-padding;
+    color: @thumbnail-caption-color;
+  }
 }

data/app/assets/stylesheets/bootstrap/tooltip.less

@@ -14,10 +14,10 @@
   .opacity(0);
 
   &.in     { .opacity(.9); }
-  &.top    { margin-top:  -3px; padding: 5px 0; }
-  &.right  { margin-left:  3px; padding: 0 5px; }
-  &.bottom { margin-top:   3px; padding: 5px 0; }
-  &.left   { margin-left: -3px; padding: 0 5px; }
+  &.top    { margin-top:  -3px; padding: @tooltip-arrow-width 0; }
+  &.right  { margin-left:  3px; padding: 0 @tooltip-arrow-width; }
+  &.bottom { margin-top:   3px; padding: @tooltip-arrow-width 0; }
+  &.left   { margin-left: -3px; padding: 0 @tooltip-arrow-width; }
 }
 
 // Wrapper for the tooltip content
@@ -49,13 +49,13 @@
   }
   &.top-left .tooltip-arrow {
     bottom: 0;
-    left: 5px;
+    left: @tooltip-arrow-width;
     border-width: @tooltip-arrow-width @tooltip-arrow-width 0;
     border-top-color: @tooltip-arrow-color;
   }
   &.top-right .tooltip-arrow {
     bottom: 0;
-    right: 5px;
+    right: @tooltip-arrow-width;
     border-width: @tooltip-arrow-width @tooltip-arrow-width 0;
     border-top-color: @tooltip-arrow-color;
   }
@@ -82,13 +82,13 @@
   }
   &.bottom-left .tooltip-arrow {
     top: 0;
-    left: 5px;
+    left: @tooltip-arrow-width;
     border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;
     border-bottom-color: @tooltip-arrow-color;
   }
   &.bottom-right .tooltip-arrow {
     top: 0;
-    right: 5px;
+    right: @tooltip-arrow-width;
     border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;
     border-bottom-color: @tooltip-arrow-color;
   }

data/app/assets/stylesheets/bootstrap/type.less

@@ -11,11 +11,11 @@ p {
 }
 .lead {
   margin-bottom: @line-height-computed;
-  font-size: (@font-size-base * 1.15);
+  font-size: floor(@font-size-base * 1.15);
   font-weight: 200;
   line-height: 1.4;
 
-  @media (min-width: 768px) {
+  @media (min-width: @screen-sm-min) {
     font-size: (@font-size-base * 1.5);
   }
 }
@@ -25,18 +25,46 @@ p {
 // -------------------------
 
 // Ex: 14px base font * 85% = about 12px
-small   { font-size: 85%; }
+small,
+.small  { font-size: 85%; }
 
 // Undo browser default styling
 cite    { font-style: normal; }
 
 // Contextual emphasis
-.text-muted          { color: @text-muted; }
-.text-primary        { color: @brand-primary; }
-.text-warning        { color: @state-warning-text; }
-.text-danger         { color: @state-danger-text; }
-.text-success        { color: @state-success-text; }
-.text-info           { color: @state-info-text; }
+.text-muted {
+  color: @text-muted;
+}
+.text-primary {
+  color: @brand-primary;
+  &:hover {
+    color: darken(@brand-primary, 10%);
+  }
+}
+.text-warning {
+  color: @state-warning-text;
+  &:hover {
+    color: darken(@state-warning-text, 10%);
+  }
+}
+.text-danger {
+  color: @state-danger-text;
+  &:hover {
+    color: darken(@state-danger-text, 10%);
+  }
+}
+.text-success {
+  color: @state-success-text;
+  &:hover {
+    color: darken(@state-success-text, 10%);
+  }
+}
+.text-info {
+  color: @state-info-text;
+  &:hover {
+    color: darken(@state-info-text, 10%);
+  }
+}
 
 // Alignment
 .text-left           { text-align: left; }
@@ -52,8 +80,10 @@ h1, h2, h3, h4, h5, h6,
   font-family: @headings-font-family;
   font-weight: @headings-font-weight;
   line-height: @headings-line-height;
+  color: @headings-color;
 
-  small {
+  small,
+  .small {
     font-weight: normal;
     line-height: 1;
     color: @headings-small-color;
@@ -66,7 +96,8 @@ h3 {
   margin-top: @line-height-computed;
   margin-bottom: (@line-height-computed / 2);
 
-  small {
+  small,
+  .small {
     font-size: 65%;
   }
 }
@@ -76,7 +107,8 @@ h6 {
   margin-top: (@line-height-computed / 2);
   margin-bottom: (@line-height-computed / 2);
 
-  small {
+  small,
+  .small {
     font-size: 75%;
   }
 }
@@ -109,7 +141,7 @@ ol {
   margin-top: 0;
   margin-bottom: (@line-height-computed / 2);
   ul,
-  ol{
+  ol {
     margin-bottom: 0;
   }
 }
@@ -121,13 +153,19 @@ ol {
   padding-left: 0;
   list-style: none;
 }
+
 // Inline turns list items into inline-block
 .list-inline {
   .list-unstyled();
+
   > li {
     display: inline-block;
     padding-left: 5px;
     padding-right: 5px;
+
+    &:first-child {
+      padding-left: 0;
+    }
   }
 }
 
@@ -172,7 +210,7 @@ dd {
 
 // Abbreviations and acronyms
 abbr[title],
-// Added data-* attribute to help out our tooltip plugin, per https://github.com/twbs/bootstrap/issues/5257
+// Add data-* attribute to help out our tooltip plugin, per https://github.com/twbs/bootstrap/issues/5257
 abbr[data-original-title] {
   cursor: help;
   border-bottom: 1px dotted @abbr-border-color;
@@ -200,7 +238,7 @@ blockquote {
     line-height: @line-height-base;
     color: @blockquote-small-color;
     &:before {
-      content: '\2014 \00A0';// EM DASH, NBSP
+      content: '\2014 \00A0'; // EM DASH, NBSP
     }
   }
 
@@ -211,23 +249,23 @@ blockquote {
     border-right: 5px solid @blockquote-border-color;
     border-left: 0;
     p,
-    small {
+    small,
+    .small {
       text-align: right;
     }
-    small {
+    small,
+    .small {
       &:before {
         content: '';
       }
       &:after {
-        content: '\00A0 \2014';// NBSP, EM DASH
+        content: '\00A0 \2014'; // NBSP, EM DASH
       }
     }
   }
 }
 
 // Quotes
-q:before,
-q:after,
 blockquote:before,
 blockquote:after {
   content: "";
@@ -235,7 +273,6 @@ blockquote:after {
 
 // Addresses
 address {
-  display: block;
   margin-bottom: @line-height-computed;
   font-style: normal;
   line-height: @line-height-base;

data/app/assets/stylesheets/bootstrap/utilities.less

@@ -9,6 +9,9 @@
 .clearfix {
   .clearfix();
 }
+.center-block {
+  .center-block();
+}
 .pull-right {
   float: right !important;
 }
@@ -20,6 +23,7 @@
 // Toggling content
 // -------------------------
 
+// Note: Deprecated .hide in favor of .hidden or .sr-only (as appropriate) in v3.0.1
 .hide {
   display: none !important;
 }
@@ -34,6 +38,16 @@
 }
 
 
+// Hide from screenreaders and browsers
+//
+// Credit: HTML5 Boilerplate
+
+.hidden {
+  display: none !important;
+  visibility: hidden !important;
+}
+
+
 // For Affix plugin
 // -------------------------
 

data/app/assets/stylesheets/bootstrap/variables.less

@@ -48,9 +48,9 @@
 @font-size-large:         ceil(@font-size-base * 1.25); // ~18px
 @font-size-small:         ceil(@font-size-base * 0.85); // ~12px
 
-@font-size-h1:            floor(@font-size-base * 2.60); // ~36px
+@font-size-h1:            floor(@font-size-base * 2.6); // ~36px
 @font-size-h2:            floor(@font-size-base * 2.15); // ~30px
-@font-size-h3:            ceil(@font-size-base * 1.70); // ~24px
+@font-size-h3:            ceil(@font-size-base * 1.7); // ~24px
 @font-size-h4:            ceil(@font-size-base * 1.25); // ~18px
 @font-size-h5:            @font-size-base;
 @font-size-h6:            ceil(@font-size-base * 0.85); // ~12px
@@ -61,6 +61,8 @@
 @headings-font-family:    @font-family-base;
 @headings-font-weight:    500;
 @headings-line-height:    1.1;
+@headings-color:          inherit;
+
 
 // Iconography
 // -------------------------
@@ -89,6 +91,7 @@
 @border-radius-large:            6px;
 @border-radius-small:            3px;
 
+@component-active-color:         #fff;
 @component-active-bg:            @brand-primary;
 
 @caret-width-base:               4px;
@@ -172,12 +175,12 @@
 @dropdown-fallback-border:       #ccc;
 @dropdown-divider-bg:            #e5e5e5;
 
-@dropdown-link-active-color:     #fff;
-@dropdown-link-active-bg:        @component-active-bg;
-
 @dropdown-link-color:            @gray-dark;
-@dropdown-link-hover-color:      #fff;
-@dropdown-link-hover-bg:         @dropdown-link-active-bg;
+@dropdown-link-hover-color:      darken(@gray-dark, 5%);
+@dropdown-link-hover-bg:         #f5f5f5;
+
+@dropdown-link-active-color:     @component-active-color;
+@dropdown-link-active-bg:        @component-active-bg;
 
 @dropdown-link-disabled-color:   @gray-light;
 
@@ -244,7 +247,7 @@
 // Padding, to be divided by two and applied to the left and right of all columns
 @grid-gutter-width:         30px;
 // Point at which the navbar stops collapsing
-@grid-float-breakpoint:     @screen-sm;
+@grid-float-breakpoint:     @screen-sm-min;
 
 
 // Navbar
@@ -253,13 +256,14 @@
 // Basics of a navbar
 @navbar-height:                    50px;
 @navbar-margin-bottom:             @line-height-computed;
-@navbar-default-color:             #777;
-@navbar-default-bg:                #f8f8f8;
-@navbar-default-border:            darken(@navbar-default-bg, 6.5%);
 @navbar-border-radius:             @border-radius-base;
 @navbar-padding-horizontal:        floor(@grid-gutter-width / 2);
 @navbar-padding-vertical:          ((@navbar-height - @line-height-computed) / 2);
 
+@navbar-default-color:             #777;
+@navbar-default-bg:                #f8f8f8;
+@navbar-default-border:            darken(@navbar-default-bg, 6.5%);
+
 // Navbar links
 @navbar-default-link-color:                #777;
 @navbar-default-link-hover-color:          #333;
@@ -271,7 +275,7 @@
 
 // Navbar brand label
 @navbar-default-brand-color:               @navbar-default-link-color;
-@navbar-default-brand-hover-color:         darken(@navbar-default-link-color, 10%);
+@navbar-default-brand-hover-color:         darken(@navbar-default-brand-color, 10%);
 @navbar-default-brand-hover-bg:            transparent;
 
 // Navbar toggle
@@ -301,13 +305,6 @@
 @navbar-inverse-brand-hover-color:          #fff;
 @navbar-inverse-brand-hover-bg:             transparent;
 
-// Inverted navbar search
-// Normal navbar needs no special styles or vars
-@navbar-inverse-search-bg:                  lighten(@navbar-inverse-bg, 25%);
-@navbar-inverse-search-bg-focus:            #fff;
-@navbar-inverse-search-border:              @navbar-inverse-bg;
-@navbar-inverse-search-placeholder-color:   #ccc;
-
 // Inverted navbar toggle
 @navbar-inverse-toggle-hover-bg:            #333;
 @navbar-inverse-toggle-icon-bar-bg:         #fff;
@@ -339,8 +336,9 @@
 @nav-tabs-justified-active-link-border-color:     @body-bg;
 
 // Pills
+@nav-pills-border-radius:                   @border-radius-base;
 @nav-pills-active-link-hover-bg:            @component-active-bg;
-@nav-pills-active-link-hover-color:         #fff;
+@nav-pills-active-link-hover-color:         @component-active-color;
 
 
 // Pagination
@@ -370,21 +368,13 @@
 @jumbotron-padding:              30px;
 @jumbotron-color:                inherit;
 @jumbotron-bg:                   @gray-lighter;
-
 @jumbotron-heading-color:        inherit;
+@jumbotron-font-size:            ceil(@font-size-base * 1.5);
 
 
 // Form states and alerts
 // -------------------------
 
-@state-warning-text:             #c09853;
-@state-warning-bg:               #fcf8e3;
-@state-warning-border:           darken(spin(@state-warning-bg, -10), 3%);
-
-@state-danger-text:              #b94a48;
-@state-danger-bg:                #f2dede;
-@state-danger-border:            darken(spin(@state-danger-bg, -10), 3%);
-
 @state-success-text:             #468847;
 @state-success-bg:               #dff0d8;
 @state-success-border:           darken(spin(@state-success-bg, -10), 5%);
@@ -393,6 +383,14 @@
 @state-info-bg:                  #d9edf7;
 @state-info-border:              darken(spin(@state-info-bg, -10), 7%);
 
+@state-warning-text:             #c09853;
+@state-warning-bg:               #fcf8e3;
+@state-warning-border:           darken(spin(@state-warning-bg, -10), 5%);
+
+@state-danger-text:              #b94a48;
+@state-danger-bg:                #f2dede;
+@state-danger-border:            darken(spin(@state-danger-bg, -10), 5%);
+
 
 // Tooltips
 // -------------------------
@@ -493,7 +491,7 @@
 @list-group-border-radius:    @border-radius-base;
 
 @list-group-hover-bg:         #f5f5f5;
-@list-group-active-color:     #fff;
+@list-group-active-color:     @component-active-color;
 @list-group-active-bg:        @component-active-bg;
 @list-group-active-border:    @list-group-active-bg;
 
@@ -568,6 +566,7 @@
 @breadcrumb-bg:               #f5f5f5;
 @breadcrumb-color:            #ccc;
 @breadcrumb-active-color:     @gray-light;
+@breadcrumb-separator:        "/";
 
 
 // Carousel
@@ -588,8 +587,8 @@
 
 // Close
 // ------------------------
-@close-color:                 #000;
 @close-font-weight:           bold;
+@close-color:                 #000;
 @close-text-shadow:           0 1px 0 #fff;
 
 
@@ -626,10 +625,13 @@
 // --------------------------------------------------
 
 // Small screen / tablet
-@container-tablet:            ((720px + @grid-gutter-width));
+@container-tablet:             ((720px + @grid-gutter-width));
+@container-sm:                 @container-tablet;
 
 // Medium screen / desktop
-@container-desktop:           ((940px + @grid-gutter-width));
+@container-desktop:            ((940px + @grid-gutter-width));
+@container-md:                 @container-desktop;
 
 // Large screen / wide desktop
-@container-lg-desktop:        ((1140px + @grid-gutter-width));
+@container-large-desktop:      ((1140px + @grid-gutter-width));
+@container-lg:                 @container-large-desktop;