2012-06-29 00:46:45 -04:00
|
|
|
//
|
|
|
|
// Grid system
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
|
2012-08-28 16:33:06 -04:00
|
|
|
// Set the container width, and override it for fixed navbars in media queries
|
2012-11-30 15:42:37 -05:00
|
|
|
.container {
|
2012-11-30 19:18:40 -05:00
|
|
|
.container-fixed();
|
2012-11-30 15:42:37 -05:00
|
|
|
}
|
2012-01-29 16:06:57 -05:00
|
|
|
|
2013-01-15 20:55:14 -05:00
|
|
|
// Mobile-first defaults
|
|
|
|
.row {
|
2013-03-16 02:21:10 -04:00
|
|
|
.make-row();
|
2013-01-15 20:55:14 -05:00
|
|
|
}
|
2013-04-27 02:59:51 -04:00
|
|
|
|
|
|
|
|
|
|
|
// Common styles for small and large grid columns
|
|
|
|
.col {
|
2013-03-16 02:21:10 -04:00
|
|
|
position: relative;
|
2013-04-27 02:59:51 -04:00
|
|
|
// Float and set width: 100%; for easy stacking on mobile devices
|
|
|
|
float: left;
|
|
|
|
width: 100%;
|
|
|
|
// Prevent columns from collapsing when empty
|
2013-01-16 16:11:45 -05:00
|
|
|
min-height: 1px;
|
2013-04-27 02:59:51 -04:00
|
|
|
// Inner gutter via padding
|
2013-03-06 11:38:20 -05:00
|
|
|
padding-left: (@grid-gutter-width / 2);
|
|
|
|
padding-right: (@grid-gutter-width / 2);
|
2013-01-15 20:55:14 -05:00
|
|
|
}
|
|
|
|
|
2013-04-27 02:59:51 -04:00
|
|
|
// Generate small grid classes first
|
|
|
|
.generate-grid-columns(@grid-columns);
|
|
|
|
|
|
|
|
// Then generate the larger grid classes via media query
|
2013-05-03 20:38:58 -04:00
|
|
|
@media screen and (min-width: @screen-small) {
|
2013-04-27 02:59:51 -04:00
|
|
|
.generate-large-grid-columns(@grid-columns);
|
2013-04-02 22:40:43 -04:00
|
|
|
}
|
2013-04-27 02:59:51 -04:00
|
|
|
|
2013-04-02 22:40:43 -04:00
|
|
|
|
2013-01-17 03:42:31 -05:00
|
|
|
// Responsive: Tablets and up
|
2013-04-27 12:47:47 -04:00
|
|
|
@media screen and (min-width: @screen-tablet) {
|
2013-01-17 03:58:34 -05:00
|
|
|
.container {
|
|
|
|
max-width: 728px;
|
|
|
|
}
|
2013-04-30 22:35:52 -04:00
|
|
|
.row {
|
|
|
|
margin-left: (@grid-gutter-width / -2);
|
|
|
|
margin-right: (@grid-gutter-width / -2);
|
|
|
|
}
|
2013-01-17 03:42:31 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
// Responsive: Desktops and up
|
2013-04-27 12:47:47 -04:00
|
|
|
@media screen and (min-width: @screen-desktop) {
|
2013-01-17 03:42:31 -05:00
|
|
|
.container {
|
|
|
|
max-width: 940px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// Responsive: Large desktops and up
|
2013-04-27 12:47:47 -04:00
|
|
|
@media screen and (min-width: @screen-large-desktop) {
|
2013-01-17 03:42:31 -05:00
|
|
|
.container {
|
|
|
|
max-width: 1170px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2012-07-29 19:51:24 -04:00
|
|
|
// Reset utility classes due to specificity
|
2013-04-27 02:59:51 -04:00
|
|
|
/*[class*="col-span-"].pull-right {
|
2012-07-29 19:51:24 -04:00
|
|
|
float: right;
|
2013-04-27 02:59:51 -04:00
|
|
|
}*/
|