Merge branch '2.0.2-wip' of github.com:twitter/bootstrap into 2.0.2-wip

Conflicts:
	docs/assets/bootstrap.zip

less/mixins.less

@@ -283,7 +283,7 @@
 // Opacity
 .opacity(@opacity: 100) {
   opacity: @opacity / 100;
-   filter: e(%("alpha(opacity=%d)", @opacity));
+   filter: ~"alpha(opacity=@{opacity})";
 }
 
 
@@ -320,7 +320,7 @@
     background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10
     background-image: linear-gradient(left, @startColor, @endColor); // Le standard
     background-repeat: repeat-x;
-    filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor)); // IE9 and down
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=@startColor, endColorstr=@endColor, GradientType=1); // IE9 and down
   }
   .vertical(@startColor: #555, @endColor: #333) {
     background-color: mix(@startColor, @endColor, 60%);
@@ -331,7 +331,7 @@
     background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
     background-image: linear-gradient(top, @startColor, @endColor); // The standard
     background-repeat: repeat-x;
-    filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=@startColor, endColorstr=@endColor, GradientType=0); // IE9 and down
   }
   .directional(@startColor: #555, @endColor: #333, @deg: 45deg) {
     background-color: @endColor;
@@ -351,7 +351,7 @@
     background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
     background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
     background-repeat: no-repeat;
-    filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down, gets no color-stop at all for proper fallback
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=@startColor, endColorstr=@endColor, GradientType=0); // IE9 and down, gets no color-stop at all for proper fallback
   }
   .radial(@innerColor: #555, @outerColor: #333)  {
     background-color: @outerColor;
@@ -374,7 +374,7 @@
 }
 // Reset filters for IE
 .reset-filter() {
-  filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)"));
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
 }
 
 
@@ -484,14 +484,26 @@
 
   .core (@gridColumnWidth, @gridGutterWidth) {
 
-    .span (@columns) {
-      width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
+    .spanX (@index) when (@index > 0) {
+      (~".span@{index}") { .span(@index); }
+      .spanX(@index - 1);
+    }
+    .spanX (0) {}
+
+    .offsetX (@index) when (@index > 0) {
+      (~".offset@{index}") { .offset(@index); }
+      .offsetX(@index - 1);
     }
+    .offsetX (0) {}
 
     .offset (@columns) {
       margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) + (@gridGutterWidth * 2);
     }
 
+    .span (@columns) {
+      width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
+    }
+
     .row {
       margin-left: @gridGutterWidth * -1;
       .clearfix();
@@ -505,38 +517,22 @@
     // Set the container width, and override it for fixed navbars in media queries
     .container,
     .navbar-fixed-top .container,
-    .navbar-fixed-bottom .container { .span(12); }
-
-    .span1 { .span(1); }
-    .span2 { .span(2); }
-    .span3 { .span(3); }
-    .span4 { .span(4); }
-    .span5 { .span(5); }
-    .span6 { .span(6); }
-    .span7 { .span(7); }
-    .span8 { .span(8); }
-    .span9 { .span(9); }
-    .span10 { .span(10); }
-    .span11 { .span(11); }
-    .span12 { .span(12); }
-
-    .offset1 { .offset(1); }
-    .offset2 { .offset(2); }
-    .offset3 { .offset(3); }
-    .offset4 { .offset(4); }
-    .offset5 { .offset(5); }
-    .offset6 { .offset(6); }
-    .offset7 { .offset(7); }
-    .offset8 { .offset(8); }
-    .offset9 { .offset(9); }
-    .offset10 { .offset(10); }
-    .offset11 { .offset(11); }
-    .offset12 { .offset(12); }
+    .navbar-fixed-bottom .container { .span(@gridColumns); }
+
+    // generate .spanX and .offsetX
+    .spanX (@gridColumns);
+    .offsetX (@gridColumns);
 
   }
 
   .fluid (@fluidGridColumnWidth, @fluidGridGutterWidth) {
 
+    .spanX (@index) when (@index > 0) {
+      (~"> .span@{index}") { .span(@index); }
+      .spanX(@index - 1);
+    }
+    .spanX (0) {}
+
     .span (@columns) {
       width: 1% * (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
     }
@@ -551,24 +547,21 @@
       > [class*="span"]:first-child {
         margin-left: 0;
       }
-      > .span1 { .span(1); }
-      > .span2 { .span(2); }
-      > .span3 { .span(3); }
-      > .span4 { .span(4); }
-      > .span5 { .span(5); }
-      > .span6 { .span(6); }
-      > .span7 { .span(7); }
-      > .span8 { .span(8); }
-      > .span9 { .span(9); }
-      > .span10 { .span(10); }
-      > .span11 { .span(11); }
-      > .span12 { .span(12); }
+
+      // generate .spanX
+      .spanX (@gridColumns);
     }
 
   }
 
   .input(@gridColumnWidth, @gridGutterWidth) {
 
+    .spanX (@index) when (@index > 0) {
+      (~"input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index}") { .span(@index); }
+      .spanX(@index - 1);
+    }
+    .spanX (0) {}
+
     .span(@columns) {
       width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 10;
     }
@@ -577,20 +570,11 @@
     textarea,
     .uneditable-input {
       margin-left: 0; // override margin-left from core grid system
-      &.span1 { .span(1); }
-      &.span2 { .span(2); }
-      &.span3 { .span(3); }
-      &.span4 { .span(4); }
-      &.span5 { .span(5); }
-      &.span6 { .span(6); }
-      &.span7 { .span(7); }
-      &.span8 { .span(8); }
-      &.span9 { .span(9); }
-      &.span10 { .span(10); }
-      &.span11 { .span(11); }
-      &.span12 { .span(12); }
     }
 
+    // generate .spanX
+    .spanX (@gridColumns);
+
   }
 
 }