-
Notifications
You must be signed in to change notification settings - Fork 213
Description
Another one I found from going through Foundation 4. Probably related to #33 .
Basically, it seems that setting a variable to null (in this case via mixin arguments) will evaluate to true if that variable is evaluated.
Notice that, in the following code, $collapse is checked a few times. In the code that calls it (below) it's been set to null. It should fail the first evaluation (approx line 4) which it does, but it should also fail the later evaluation (approx lines 15, 18), which it doesn't. Also note that if I change the calling code to false, then it behaves as expected, with the first evaluation passing, and the latter two not.
Accoding to the SCSS page:
The @if directive takes a SassScript expression and uses the styles nested beneath it if the expression returns anything other than false or null:
@mixin grid-column($columns:false, $last-column:false, $center:false, $offset:false, $push:false, $pull:false, $collapse:false, $float:left) {
// Gutter padding whenever a column isn't set to collapse
@if $collapse == false {
padding-left: $column-gutter / 2;
padding-right: $column-gutter / 2;
}
// If a column number is given, calculate width
@if $columns {
width: gridCalc($columns, $total-columns);
// If last column, float naturally instead of to the right
@if $last-column { float: $default-opposite; }
// if collapsed, get rid of gutter padding
@else if $collapse { padding-left: 0; padding-right: 0; }
}
@if $collapse { padding-left: 0; padding-right: 0; }
}Calling it with @include grid-column($columns:$i,$collapse:null,$float:false);
produces something like:
.row .large-1 {
width: 8.33333%;
padding-left: 0;
padding-right: 0;
padding-left: 0;
padding-right: 0;
/* Grid HTML Classes */
}