nib
nib copied to clipboard
transition mixin breaks surrounding code
Stylus: 0.54.5 Nib: 1.1.0
Source file:
@import 'nib'
$perRow = 5
$itemRatio = 0.625
.grid
display block
opacity 0
transition opacity 1s ease
&-item
position relative
display block
width (100% / $perRow)
height 0
padding-top (100% * $itemRatio / $perRow)
Result:
.grid {
display: block;
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
.grid td,
.grid th {
padding: 0;
}
-webkit-transition: ;
.grid td,
.grid th {
padding: 0;
}
-moz-transition: ;
.grid td,
.grid th {
padding: 0;
}
-o-transition: ;
.grid td,
.grid th {
padding: 0;
}
-ms-transition: ;
.grid td,
.grid th {
padding: 0;
}
transition: ;
}
.grid-item {
position: relative;
display: block;
width: 20%;
height: 0;
padding-top: 12.5%;
}
Correct result when nib is not imported:
.grid {
display: block;
opacity: 0;
transition: opacity 1s ease;
}
.grid-item {
position: relative;
display: block;
width: 20%;
height: 0;
padding-top: 12.5%;
}