Mercurial > wikked
diff static/bootstrap/less/grid.less @ 149:d29e2f337b00
Updated to Bootstrap 3.0.
author | Ludovic Chabant <ludovic@chabant.com> |
---|---|
date | Thu, 12 Dec 2013 21:54:04 -0800 |
parents | 130eccd396d8 |
children |
line wrap: on
line diff
--- a/static/bootstrap/less/grid.less Wed Dec 11 21:51:51 2013 -0800 +++ b/static/bootstrap/less/grid.less Thu Dec 12 21:54:04 2013 -0800 @@ -2,20 +2,78 @@ // Grid system // -------------------------------------------------- - -// Fixed (940px) -#grid > .core(@gridColumnWidth, @gridGutterWidth); +// Set the container width, and override it for fixed navbars in media queries +.container { + .container-fixed(); -// Fluid (940px) -#grid > .fluid(@fluidGridColumnWidth, @fluidGridGutterWidth); + @media (min-width: @screen-sm) { + width: @container-sm; + } + @media (min-width: @screen-md) { + width: @container-md; + } + @media (min-width: @screen-lg-min) { + width: @container-lg; + } +} -// Reset utility classes due to specificity -[class*="span"].hide, -.row-fluid [class*="span"].hide { - display: none; +// mobile first defaults +.row { + .make-row(); } -[class*="span"].pull-right, -.row-fluid [class*="span"].pull-right { - float: right; +// Common styles for small and large grid columns +.make-grid-columns(); + + +// Extra small grid +// +// Columns, offsets, pushes, and pulls for extra small devices like +// smartphones. + +.make-grid-columns-float(xs); +.make-grid(@grid-columns, xs, width); +.make-grid(@grid-columns, xs, pull); +.make-grid(@grid-columns, xs, push); +.make-grid(@grid-columns, xs, offset); + + +// Small grid +// +// Columns, offsets, pushes, and pulls for the small device range, from phones +// to tablets. + +@media (min-width: @screen-sm-min) { + .make-grid-columns-float(sm); + .make-grid(@grid-columns, sm, width); + .make-grid(@grid-columns, sm, pull); + .make-grid(@grid-columns, sm, push); + .make-grid(@grid-columns, sm, offset); } + + +// Medium grid +// +// Columns, offsets, pushes, and pulls for the desktop device range. + +@media (min-width: @screen-md-min) { + .make-grid-columns-float(md); + .make-grid(@grid-columns, md, width); + .make-grid(@grid-columns, md, pull); + .make-grid(@grid-columns, md, push); + .make-grid(@grid-columns, md, offset); +} + + +// Large grid +// +// Columns, offsets, pushes, and pulls for the large desktop device range. + +@media (min-width: @screen-lg-min) { + .make-grid-columns-float(lg); + .make-grid(@grid-columns, lg, width); + .make-grid(@grid-columns, lg, pull); + .make-grid(@grid-columns, lg, push); + .make-grid(@grid-columns, lg, offset); +} +