Undefined Mixin 'if-rem' using Susy CSS

Question

When trying to compile a Susy/Compass document I'm getting Undefined mixin 'if-rem'.

It's this line that's causing it:

Line 35 of _grid.scss

I'm using:

• SASS 3.2.12
• Compass 0.12.2
• Susy 1.0.9

Thanks :)

Answer 1

Like the error message says you should define if-rem mixin before include it. So you have two options:

• Import _unit.scss into your style. This is the susy partial that contains the if-rem mixin declaration

  // Imports
  
  @import "compass/utilities/general/clearfix";
  @import "compass/css3/box-sizing";
  // add _unit.scss path here, or elsewhere before the @include
  @import "susy/units";
  

• Include the if-rem mixin directly into your code, you should also include the variable or if-rem mixin will return an error:

  // Whether to output fallback values in px when outputting rems.
  $rem-with-px-fallback: true !default;
  
  // Here is the`if-rem` mixin declaration
  @mixin if-rem($property, $values, $use-px-fallback: $rem-with-px-fallback) {
    $has-rem: false;
    @each $value in $values { $has-rem: if(unit($value) == 'rem', true, $has-rem); }
    @if $has-rem { @include rem($property, $values, $use-px-fallback); }
    @else { #{$property}: $values; }
  }