forms.less in bootstrap-on-rails-0.0.2

- old
+ new

@@ -90,19 +90,11 @@
   line-height: @line-height-base;
   color: @input-color;
   vertical-align: middle;
 }
 
-// Placeholder
-//
-// Placeholder text gets special styles because when browsers invalidate entire
-// lines if it doesn't understand a selector/
-.form-control {
-  .placeholder();
-}
 
-
 // Common form controls
 //
 // Shared size and type resets for form controls. Apply `.form-control` to any
 // of the following form controls:
 //
@@ -131,18 +123,25 @@
   font-size: @font-size-base;
   line-height: @line-height-base;
   color: @input-color;
   vertical-align: middle;
   background-color: @input-bg;
+  background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
   border: 1px solid @input-border;
   border-radius: @input-border-radius;
   .box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
   .transition(~"border-color ease-in-out .15s, box-shadow ease-in-out .15s");
 
   // Customize the `:focus` state to imitate native WebKit styles.
   .form-control-focus();
 
+  // Placeholder
+  //
+  // Placeholder text gets special styles because when browsers invalidate entire
+  // lines if it doesn't understand a selector/
+  .placeholder();
+
   // Disabled and read-only inputs
   // Note: HTML5 says that controls under a fieldset > legend:first-child won't
   // be disabled if the fieldset is disabled. Due to implementation difficulty,
   // we don't honor that edge case; we style them as disabled anyway.
   &[disabled],
@@ -264,11 +263,10 @@
 // Apply class to a `p` element to make any string of text align with labels in
 // a horizontal form layout.
 
 .form-control-static {
   margin-bottom: 0; // Remove default margin from `p`
-  padding-top: (@padding-base-vertical + 1);
 }
 
 
 // Help text
 //
@@ -351,11 +349,15 @@
   // Make form groups behave like rows
   .form-group {
     .make-row();
   }
 
+  .form-control-static {
+    padding-top: (@padding-base-vertical + 1);
+  }
+
   // Only right align form labels here when the columns stop stacking
-  @media (min-width: @screen-sm) {
+  @media (min-width: @screen-sm-min) {
     .control-label {
       text-align: right;
     }
   }
 }