SCSS mixin for font shorthand

SassMeister-input.scss

// ----
// libsass (v3.5.0.beta.2)
// ----

@mixin font($dimensions, $family, $props: null) {
  font: $props $dimensions #{$family};
}
.foo {
  @include font(14px, "Monaco, Menlo", null);
}

.bar {
  @include font(#{14px/150%}, "Menlo, Arial")
}

.baz {
  @include font(#{12rem/102%}, '"Space Invaders", Arial, Helvetica', 500 italic);
}

SassMeister-output.css

.foo {
  font: 14px Monaco, Menlo;
}

.bar {
  font: 14px/150% Menlo, Arial;
}

.baz {
  font: 500 italic 12rem/102% "Space Invaders", Arial, Helvetica;
}