99 lines
3.7 KiB
CSS
99 lines
3.7 KiB
CSS
/*
|
|
Responsive: Large desktop and up
|
|
========================================
|
|
*/
|
|
|
|
@media (min-width: 1200px) {
|
|
/* Fixed grid */
|
|
.row {
|
|
margin-left: calc(var(--grid-gutter-width-1200) * -1);
|
|
}
|
|
|
|
[class*="span"] {
|
|
float: left;
|
|
min-height: 1px;
|
|
margin-left: var(--grid-gutter-width-1200);
|
|
}
|
|
|
|
.container,
|
|
.navbar-static-top .container,
|
|
.navbar-fixed-top .container,
|
|
.navbar-fixed-bottom .container {
|
|
width: var(--grid-row-width-1200);
|
|
}
|
|
|
|
.span12 { width: var(--grid-row-width-1200); }
|
|
.span11 { width: calc(var(--grid-column-width-1200) * 11 + var(--grid-gutter-width-1200) * 10); }
|
|
.span10 { width: calc(var(--grid-column-width-1200) * 10 + var(--grid-gutter-width-1200) * 9); }
|
|
.span9 { width: calc(var(--grid-column-width-1200) * 9 + var(--grid-gutter-width-1200) * 8); }
|
|
.span8 { width: calc(var(--grid-column-width-1200) * 8 + var(--grid-gutter-width-1200) * 7); }
|
|
.span7 { width: calc(var(--grid-column-width-1200) * 7 + var(--grid-gutter-width-1200) * 6); }
|
|
.span6 { width: calc(var(--grid-column-width-1200) * 6 + var(--grid-gutter-width-1200) * 5); }
|
|
.span5 { width: calc(var(--grid-column-width-1200) * 5 + var(--grid-gutter-width-1200) * 4); }
|
|
.span4 { width: calc(var(--grid-column-width-1200) * 4 + var(--grid-gutter-width-1200) * 3); }
|
|
.span3 { width: calc(var(--grid-column-width-1200) * 3 + var(--grid-gutter-width-1200) * 2); }
|
|
.span2 { width: calc(var(--grid-column-width-1200) * 2 + var(--grid-gutter-width-1200)); }
|
|
.span1 { width: var(--grid-column-width-1200); }
|
|
|
|
/* Fluid grid */
|
|
.row-fluid {
|
|
width: 100%;
|
|
}
|
|
|
|
.row-fluid [class*="span"] {
|
|
display: block;
|
|
float: left;
|
|
width: 100%;
|
|
min-height: 30px;
|
|
margin-left: var(--fluid-grid-gutter-width-1200);
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.row-fluid [class*="span"]:first-child {
|
|
margin-left: 0;
|
|
}
|
|
|
|
.row-fluid .span12 { width: 100%; }
|
|
.row-fluid .span11 { width: calc(100% - var(--fluid-grid-column-width-1200) - var(--fluid-grid-gutter-width-1200)); }
|
|
.row-fluid .span10 { width: calc(100% - var(--fluid-grid-column-width-1200) * 2 - var(--fluid-grid-gutter-width-1200)); }
|
|
.row-fluid .span9 { width: calc(100% - var(--fluid-grid-column-width-1200) * 3 - var(--fluid-grid-gutter-width-1200)); }
|
|
.row-fluid .span8 { width: calc(100% - var(--fluid-grid-column-width-1200) * 4 - var(--fluid-grid-gutter-width-1200)); }
|
|
.row-fluid .span7 { width: calc(100% - var(--fluid-grid-column-width-1200) * 5 - var(--fluid-grid-gutter-width-1200)); }
|
|
.row-fluid .span6 { width: calc(100% - var(--fluid-grid-column-width-1200) * 6 - var(--fluid-grid-gutter-width-1200)); }
|
|
.row-fluid .span5 { width: calc(100% - var(--fluid-grid-column-width-1200) * 7 - var(--fluid-grid-gutter-width-1200)); }
|
|
.row-fluid .span4 { width: calc(100% - var(--fluid-grid-column-width-1200) * 8 - var(--fluid-grid-gutter-width-1200)); }
|
|
.row-fluid .span3 { width: calc(100% - var(--fluid-grid-column-width-1200) * 9 - var(--fluid-grid-gutter-width-1200)); }
|
|
.row-fluid .span2 { width: calc(100% - var(--fluid-grid-column-width-1200) * 10 - var(--fluid-grid-gutter-width-1200)); }
|
|
.row-fluid .span1 { width: calc(100% - var(--fluid-grid-column-width-1200) * 11 - var(--fluid-grid-gutter-width-1200)); }
|
|
|
|
/* Input grid */
|
|
input,
|
|
textarea,
|
|
.uneditable-input {
|
|
margin-left: 0;
|
|
}
|
|
|
|
input.span12,
|
|
textarea.span12,
|
|
.uneditable-input.span12 { width: var(--grid-row-width-1200); }
|
|
|
|
input.span11,
|
|
textarea.span11,
|
|
.uneditable-input.span11 { width: calc(var(--grid-column-width-1200) * 11 + var(--grid-gutter-width-1200) * 10); }
|
|
|
|
/* Continue for other spans... */
|
|
|
|
/* Thumbnails */
|
|
.thumbnails {
|
|
margin-left: calc(var(--grid-gutter-width-1200) * -1);
|
|
}
|
|
|
|
.thumbnails > li {
|
|
margin-left: var(--grid-gutter-width-1200);
|
|
}
|
|
|
|
.row-fluid .thumbnails {
|
|
margin-left: 0;
|
|
}
|
|
}
|