v6.1.2 (21 juin 2017)
This commit is contained in:
parent
679a936f5b
commit
689c3d32f7
14 changed files with 54 additions and 39 deletions
|
@ -7,7 +7,7 @@ $grid-gutters: ( '': 1rem, '-l': 2rem, '-xl': 4rem );
|
|||
// IEfixing, see
|
||||
// https://github.com/alsacreations/KNACSS/issues/133;
|
||||
$iefix: 0.01px;
|
||||
@media (min-width: ($tiny + 1)) {
|
||||
@media (min-width: $small) {
|
||||
[class*=" grid-"],
|
||||
[class^="grid-"] {
|
||||
display: flex;
|
||||
|
@ -51,7 +51,7 @@ $iefix: 0.01px;
|
|||
}
|
||||
}
|
||||
// Mono-line grid constructor (.grid)
|
||||
@media (min-width: ($tiny + 1)) {
|
||||
@media (min-width: $small) {
|
||||
.grid,
|
||||
.grid--reverse {
|
||||
display: flex;
|
||||
|
@ -70,7 +70,7 @@ $iefix: 0.01px;
|
|||
}
|
||||
}
|
||||
// Constructing grids : will be compiled in CSS
|
||||
@media (min-width: ($tiny + 1)) {
|
||||
@media (min-width: $small) {
|
||||
@for $i from 2 through 12 {
|
||||
[class*="grid-#{$i}"] {
|
||||
@include grid(#{$i}, 0);
|
||||
|
@ -100,7 +100,7 @@ $iefix: 0.01px;
|
|||
flex-direction: row-reverse;
|
||||
}
|
||||
// sizing individual children
|
||||
@media (min-width: ($tiny + 1)) {
|
||||
@media (min-width: $small) {
|
||||
@each $flow, $divider in ("full" "1"), ("one-half" "2"), ("one-third" "3"), ("one-quarter" "4"), ("one-fifth" "5"), ("one-sixth" "6"), ("two-thirds" "3 * 2"), ("three-quarters" "4 * 3"), ("five-sixths" "6 * 5") {
|
||||
.#{$flow} {
|
||||
flex: 0 0 auto;
|
||||
|
@ -116,7 +116,7 @@ $iefix: 0.01px;
|
|||
/* Responsive Small Breakpoint */
|
||||
// -small-X suffix means "X columns on small-medium screen"
|
||||
// example : .grid-4-small-2 will be 1 column (tiny and down) then 2 columns (until medium) then 4 columns
|
||||
@media (min-width: ($tiny + 1)) and (max-width: $medium) {
|
||||
@media (min-width: $small) and (max-width: ($medium - 1)) {
|
||||
@for $i from 1 through 4 {
|
||||
[class*="-small-#{$i}"] {
|
||||
& > * {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue