mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-17 19:21:23 +03:00
Code Activity

Grid updates

Browse Source 
- Removed mixins for generating grid classes
- Thus, we manually declare every grid class, from 1-11 (12th unit is
excluded as that's the same as no grid columns)
- No more need for `.col` base class (yay!)
- Negative indent the rows at tablets and above once again (ugh, still
working through this part)
- Add support for `.col-md` for tablet-specific grid columns
- Still need to figure out offsets, pushes, and pulls on other
devices—right now only available on desktop
This commit is contained in:
Mark Otto
2013-06-02 13:38:45 -07:00
parent b62fa23d9a
commit 19d0726609
3 changed files with 274 additions and 209 deletions
Download Patch File Download Diff File Expand all files Collapse all files
less/mixins.less
+5 -73
View File
@@ -419,6 +419,11 @@
// Then clear the floated columns
.clearfix();
@media (min-width: @screen-small) {
margin-left: (@grid-gutter-width / -2);
margin-right: (@grid-gutter-width / -2);
}
// Negative margin nested rows out to align the content of columns
.row {
margin-left: (@grid-gutter-width / -2);
@@ -459,79 +464,6 @@
}
}
// Small grid columns
.generate-grid-columns(@grid-columns) {
.col-sm-X (@index) when (@index > 0) {
.col-sm-@{index} { .col-sm-(@index); }
.col-sm-X((@index - 1));
}
.col-sm-X (0) {}
// Generate columns
.col-sm-X(@grid-columns);
// Apply the styles
.col-sm-(@columns) {
width: percentage((@columns / @grid-columns));
}
}
// Large grid columns
.generate-large-grid-columns(@grid-columns) {
.col-lg-X (@index) when (@index > 0) {
.col-lg-@{index} { .col-lg-(@index); }
.col-lg-X((@index - 1));
}
.col-lg-X (0) {}
// Generate the columns
.col-lg-X(@grid-columns);
// Apply the styles
.col-lg-(@columns) {
width: percentage((@columns / @grid-columns));
}
// Offsets (gaps between columns)
.col-offset-X (@index) when (@index > 0) {
.col-offset-@{index} { .col-offset-(@index); }
.col-offset-X((@index - 1));
}
.col-offset-X (0) {}
// Source ordering
.col-push-X (@index) when (@index > 0) {
.col-push-@{index} { .col-push-(@index); }
.col-push-X((@index - 1));
}
.col-push-X (0) {}
// Source ordering
.col-pull-X (@index) when (@index > 0) {
.col-pull-@{index} { .col-pull-(@index); }
.col-pull-X((@index - 1));
}
.col-pull-X (0) {}
// Apply the styles
.col-offset-(@columns) {
margin-left: percentage((@columns / @grid-columns));
}
.col-push-(@columns) {
left: percentage((@columns / @grid-columns));
}
.col-pull-(@columns) {
right: percentage((@columns / @grid-columns));
}
// Generate .spanX and .offsetX
.col-offset-X(@grid-columns);
.col-push-X(@grid-columns);
.col-pull-X(@grid-columns);
}
// Framework mixins