barebones/scss/objects/_scaffolding.scss

51 lines
1.1 KiB
SCSS
Raw Normal View History

2013-01-17 22:26:23 +01:00
.container {
2013-07-01 23:42:22 +02:00
margin: 0 auto;
max-width: ($container-max-width - $column-gutter) * 1px;
padding: 0 20px;
@extend .clearfix;
}
.container-fluid {
width: 100%;
@extend .clearfix;
2013-01-17 22:26:23 +01:00
}
.row {
2013-07-01 23:42:22 +02:00
margin-left: -($column-gutter / $container-max-width) * 100%;
_overflow: hidden;
@extend .clearfix;
@include breakpoint(mobile) {
margin-left: 0;
}
}
.column {
display: inline;
float: left;
margin-left: ($column-gutter / $container-max-width) * 100%;
vertical-align: top;
@include breakpoint(mobile) {
display: block;
float: none;
margin-left: 0;
width: auto !important;
}
}
@for $i from 1 through $column-count {
.column-span-#{$i} {
width: (((100 / $column-count) * $i) - (($column-gutter / $container-max-width) * 100)) * 1%;
*width: (((100 / $column-count) * $i) - (($column-gutter / $container-max-width) * 100)) - .02 * 1%;
}
2013-01-17 22:26:23 +01:00
}
2013-07-01 23:42:22 +02:00
.row-no-gutters .column {
margin-left: 0;
2013-01-17 22:26:23 +01:00
}
@for $i from 1 through $column-count {
2013-07-01 23:42:22 +02:00
.row-no-gutters .column-span-#{$i} {
width: ((100 / $column-count) * $i) * 1%;
*width: ((100 / $column-count) * $i) - .02 * 1%;
}
2013-01-17 22:26:23 +01:00
}