Compare commits

...

2 Commits

Author SHA1 Message Date
piensaenpixel
ccda2c463c fix grid 2016-01-27 11:52:51 +01:00
piensaenpixel
0e151d2b1a add first proposal #23 2016-01-27 10:54:59 +01:00

View File

@ -0,0 +1,36 @@
// Grid layout
// ----------------------------------------------
/* SG
# Grid/gaps
```
<div class="Grid">
<div class="Gap CDB-Width CDB-Width--1" style="background: green; height: 100px;">&nbsp;</div>
<div class="Gap CDB-Width CDB-Width--2" style="background: orange">&nbsp;</div>
<div class="Gap CDB-Width CDB-Width--3" style="background: red">&nbsp;</div>
<div class="Gap CDB-Width CDB-Width--20" style="background: blue">&nbsp;</div>
</div>
<div class="CDB-Width--120" style="margin: 20px 0; background: blue">&nbsp;</div>
```
*/
@import '../cdb-variables/sizes';
.Grid {
display: flex;
}
.CDB-Width {
width: $baseSize;
flex: 0 0 $baseSize;
max-width: $baseSize;
}
@for $i from 1 through 180 {
.CDB-Width--#{$i} {
width: $baseSize * $i;
flex: 0 0 $baseSize * $i;
max-width: $baseSize * $i;
}
}