From c3b0870ec00adf551a052828d7b0e129984f08c2 Mon Sep 17 00:00:00 2001
From: Mark Otto <otto@github.com>
Date: Tue, 8 Jul 2014 03:38:23 -0700
Subject: [PATCH] Overhaul semantic grid mixins

- Drops all the `.make-**-column` mixins for a single set to be used
within (or outside) media queries.
- Renames `.container-fixed` to `.make-container` for consistency.
- Updates built-in grid system to use new setup.

See http://jsbin.com/qiqet/2/ for an example of it in action.
---
 dist/css/bootstrap.css.map      | Bin 313938 -> 311710 bytes
 docs/dist/css/bootstrap.css.map | Bin 313938 -> 311710 bytes
 less/grid.less                  |   4 +-
 less/mixins/grid.less           | 102 ++++----------------------------
 4 files changed, 12 insertions(+), 94 deletions(-)

diff --git a/dist/css/bootstrap.css.map b/dist/css/bootstrap.css.map
index 39633de2d6c4e28740c123e0298535cc6d11d059..673afe0e370d290aa620f5c07467f766c448b500 100644
GIT binary patch
delta 210
zcmcaKMR;Dba6=2@7AEBv{JDwQsk+Jec_oRNd8tJj(;t3hGMc{j1(VSB@)t}#jC`o_
z+b_Lj@?@Sa^_D3cL#O?FCZ*}~-!ZXo-}jcuiIGbWsx?PrI#9}Uy32Q_5XIV<yqG+=
zjBas3VxERWa(+%}ZeFpbLUl~u^uJ$#4#@q$#K{a4p04nLDGbc0|G?x6VSHv1o&M?r
RlX3gXpG@0V{$yTx0RTl(RNMdn

delta 1028
zcmb7?JxBs!7{|HiPA&(rFZx31s-ey>wY4RhbcmJ+f})N*%ep(mQ;=MOf@ZnsX=-n1
z2m*sLqNyQBoEsWzC|?2zf}qRdJkK*|d_R8A^Sr<Jf3(w4+V9xjrOsgJ$-R<LQbJr2
zlm1vdBS!O~C&*C^yTxaS(Af6^>((ROdIcYP+kidrFwXql3yf39uykuc%%qY6r^<pP
zaVrTaEi3ARGA0WfqCcbhe|APDe@`Yj%)Y`P`pPhjw`B<8Od00gmg~q6m~$F5E)tkF
zEl&u95m>sNx9zIRe{}8EmL3O@=;Pz;72Si^VY&+s3sk$dTw-zb9bEWO1`mF|gR{T-
z2&0@o5sRr}%6JQpRG#7SK1{P(<jsY_4>Rnwz?*4x%?`yRfk3rgBOyt)#0}BC=>xXl
z(g!$@WoegB7NhaBZ2bT^`VSSsbH<Ii0@d48g;B0i#pxx(Yg2EXwiarf#lkn`$Sx=x
zhnoaKCJkn!PJ;=#Ci*Ydd*CG@xhh&UNUQ(QpeKSw?m~C*XDp1GjV|<93{)#LjYSQ%
Z2r*D=EX+imj~ZdbVy{9VUm^5y@e3_ljllo_

diff --git a/docs/dist/css/bootstrap.css.map b/docs/dist/css/bootstrap.css.map
index 39633de2d6c4e28740c123e0298535cc6d11d059..673afe0e370d290aa620f5c07467f766c448b500 100644
GIT binary patch
delta 210
zcmcaKMR;Dba6=2@7AEBv{JDwQsk+Jec_oRNd8tJj(;t3hGMc{j1(VSB@)t}#jC`o_
z+b_Lj@?@Sa^_D3cL#O?FCZ*}~-!ZXo-}jcuiIGbWsx?PrI#9}Uy32Q_5XIV<yqG+=
zjBas3VxERWa(+%}ZeFpbLUl~u^uJ$#4#@q$#K{a4p04nLDGbc0|G?x6VSHv1o&M?r
RlX3gXpG@0V{$yTx0RTl(RNMdn

delta 1028
zcmb7?JxBs!7{|HiPA&(rFZx31s-ey>wY4RhbcmJ+f})N*%ep(mQ;=MOf@ZnsX=-n1
z2m*sLqNyQBoEsWzC|?2zf}qRdJkK*|d_R8A^Sr<Jf3(w4+V9xjrOsgJ$-R<LQbJr2
zlm1vdBS!O~C&*C^yTxaS(Af6^>((ROdIcYP+kidrFwXql3yf39uykuc%%qY6r^<pP
zaVrTaEi3ARGA0WfqCcbhe|APDe@`Yj%)Y`P`pPhjw`B<8Od00gmg~q6m~$F5E)tkF
zEl&u95m>sNx9zIRe{}8EmL3O@=;Pz;72Si^VY&+s3sk$dTw-zb9bEWO1`mF|gR{T-
z2&0@o5sRr}%6JQpRG#7SK1{P(<jsY_4>Rnwz?*4x%?`yRfk3rgBOyt)#0}BC=>xXl
z(g!$@WoegB7NhaBZ2bT^`VSSsbH<Ii0@d48g;B0i#pxx(Yg2EXwiarf#lkn`$Sx=x
zhnoaKCJkn!PJ;=#Ci*Ydd*CG@xhh&UNUQ(QpeKSw?m~C*XDp1GjV|<93{)#LjYSQ%
Z2r*D=EX+imj~ZdbVy{9VUm^5y@e3_ljllo_

diff --git a/less/grid.less b/less/grid.less
index e100655b7..9957a44af 100644
--- a/less/grid.less
+++ b/less/grid.less
@@ -8,7 +8,7 @@
 // Set the container width, and override it for fixed navbars in media queries.
 
 .container {
-  .container-fixed();
+  .make-container();
 
   @media (min-width: @screen-sm-min) {
     width: @container-sm;
@@ -28,7 +28,7 @@
 // width for fluid, full width layouts.
 
 .container-fluid {
-  .container-fixed();
+  .make-container();
 }
 
 
diff --git a/less/mixins/grid.less b/less/mixins/grid.less
index cae5eaff9..1353a7354 100644
--- a/less/mixins/grid.less
+++ b/less/mixins/grid.less
@@ -1,9 +1,9 @@
-// Grid system
+/// Grid system
 //
 // Generate semantic grid columns with these mixins.
 
 // Centered container element
-.container-fixed(@gutter: @grid-gutter-width) {
+.make-container(@gutter: @grid-gutter-width) {
   margin-right: auto;
   margin-left: auto;
   padding-left:  (@gutter / 2);
@@ -18,105 +18,23 @@
   &:extend(.clearfix all);
 }
 
-// Generate the extra small columns
-.make-xs-column(@columns; @gutter: @grid-gutter-width) {
+.make-col(@gutter: @grid-gutter-width) {
   position: relative;
   float: left;
-  width: percentage((@columns / @grid-columns));
   min-height: 1px;
   padding-left:  (@gutter / 2);
   padding-right: (@gutter / 2);
 }
-.make-xs-column-offset(@columns) {
+
+.make-col-span(@columns) {
+  width: percentage((@columns / @grid-columns));
+}
+.make-col-offset(@columns) {
   margin-left: percentage((@columns / @grid-columns));
 }
-.make-xs-column-push(@columns) {
+.make-col-push(@columns) {
   left: percentage((@columns / @grid-columns));
 }
-.make-xs-column-pull(@columns) {
+.make-col-pull(@columns) {
   right: percentage((@columns / @grid-columns));
 }
-
-// Generate the small columns
-.make-sm-column(@columns; @gutter: @grid-gutter-width) {
-  position: relative;
-  min-height: 1px;
-  padding-left:  (@gutter / 2);
-  padding-right: (@gutter / 2);
-
-  @media (min-width: @screen-sm-min) {
-    float: left;
-    width: percentage((@columns / @grid-columns));
-  }
-}
-.make-sm-column-offset(@columns) {
-  @media (min-width: @screen-sm-min) {
-    margin-left: percentage((@columns / @grid-columns));
-  }
-}
-.make-sm-column-push(@columns) {
-  @media (min-width: @screen-sm-min) {
-    left: percentage((@columns / @grid-columns));
-  }
-}
-.make-sm-column-pull(@columns) {
-  @media (min-width: @screen-sm-min) {
-    right: percentage((@columns / @grid-columns));
-  }
-}
-
-// Generate the medium columns
-.make-md-column(@columns; @gutter: @grid-gutter-width) {
-  position: relative;
-  min-height: 1px;
-  padding-left:  (@gutter / 2);
-  padding-right: (@gutter / 2);
-
-  @media (min-width: @screen-md-min) {
-    float: left;
-    width: percentage((@columns / @grid-columns));
-  }
-}
-.make-md-column-offset(@columns) {
-  @media (min-width: @screen-md-min) {
-    margin-left: percentage((@columns / @grid-columns));
-  }
-}
-.make-md-column-push(@columns) {
-  @media (min-width: @screen-md-min) {
-    left: percentage((@columns / @grid-columns));
-  }
-}
-.make-md-column-pull(@columns) {
-  @media (min-width: @screen-md-min) {
-    right: percentage((@columns / @grid-columns));
-  }
-}
-
-// Generate the large columns
-.make-lg-column(@columns; @gutter: @grid-gutter-width) {
-  position: relative;
-  min-height: 1px;
-  padding-left:  (@gutter / 2);
-  padding-right: (@gutter / 2);
-
-  @media (min-width: @screen-lg-min) {
-    float: left;
-    width: percentage((@columns / @grid-columns));
-  }
-}
-.make-lg-column-offset(@columns) {
-  @media (min-width: @screen-lg-min) {
-    margin-left: percentage((@columns / @grid-columns));
-  }
-}
-.make-lg-column-push(@columns) {
-  @media (min-width: @screen-lg-min) {
-    left: percentage((@columns / @grid-columns));
-  }
-}
-.make-lg-column-pull(@columns) {
-  @media (min-width: @screen-lg-min) {
-    right: percentage((@columns / @grid-columns));
-  }
-}