Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.4.14)
// Compass (v1.0.3)
// ----

$future-proof: true;
$future-properties: rotate scale translate;

@function generate-single-property($arg) {
  $start-pos: str-index($arg, '(');
  $end-pos: str-index($arg, ')');
  $prop: str-slice($arg, 1, ($start-pos - 1));
  $value: str-slice($arg, ($start-pos + 1), ($end-pos - 1));
  @if index(X Y Z, str-slice($prop, str-length($prop))) {
    @return (
      #{str-slice($prop, 1, str-length($prop) - 1)}: (
        str-slice($prop, str-length($prop)): $value
      )
    );
  }
  @return (
    $prop: $value
  );
}

@mixin output-map($map) {
  @each $key, $value in $map {
    @if type-of($value) == map {
      $array: ();
      @each $dimension in (X Y Z) {
        $output: 0;
        @if map-has-key($value, $dimension) {
          $output: map-get($value, $dimension);
        }
        $array: append($array, $output, comma);
      }
      #{$key}: #{$array};
    } @else {
      #{$key}: $value;
    }
  }
}

@mixin future-transform($args) {
  transform: $args;
  
  @if $future-proof == true {
    $transform: ();
    $arg-map: ();
    @each $arg in $args {
      $this-map: generate-single-property($arg);
      $key: nth(map-keys($this-map), 1);
      @if index($future-properties, $key) {
        @if map-has-key($arg-map, $key) {
          $existing-map: map-get($arg-map, $key);
          $additional-map: map-get($this-map, $key);
          $this-map: (#{$key}: map-merge($existing-map, $additional-map));
        }
        $arg-map: map-merge($arg-map, $this-map);
      } @else {
        @each $key, $value in $arg {
          $transform: append($transform, #{$key($value)});
        }
      }
    }
    transform: $transform;
    @include output-map($arg-map);
  }
}

.element {
  @include future-transform(rotate(3deg) skew(12deg) scale(1.2, 1, 1.1) translateX(25%) translateY(40px));
}

SassMeister-output.css

.element {
  transform: rotate(3deg) skew(12deg) scale(1.2, 1, 1.1) translateX(25%) translateY(40px);
  transform: skew(12deg);
  rotate: 3deg;
  scale: 1.2, 1, 1.1;
  translate: 25%, 40px, 0; }