Keeping things DRY, refactoring some shared functionality. All prefix fixes now route through an @build-prefix-values mixin.

frameworks/compass/stylesheets/compass/css3/_transition.scss

@@ -23,7 +23,7 @@ $default-transition-function: false !default;
 
 $default-transition-delay: false !default;
 
-$transitionable-prefixed-properties: transform, transform-origin !default;
+$transitionable-prefixed-values: transform, transform-origin !default;
 
 // One or more properties to transition
 //
@@ -32,40 +32,7 @@ $transitionable-prefixed-properties: transform, transform-origin !default;
 
 @mixin transition-property($properties: $default-transition-property) {
   @if type-of($properties) == string { $properties: unquote($properties); }
-  $raw-properties: ($properties);
+  @include build-prefix-values(transition-property, $properties);
-
-  $webkit-transition-property: compact(false);
-  $moz-transition-property: compact(false);
-  $ms-transition-property: compact(false);
-  $o-transition-property: compact(false);
-
-  @each $property in $raw-properties {
-    $match: false;
-
-    @each $prefixed-property in $transitionable-prefixed-properties {
-      @if $property == $prefixed-property {
-        $match: true;
-      }
-    }
-
-    @if $match {
-      $webkit-transition-property: append($webkit-transition-property, -webkit-#{$property}, comma);
-      $moz-transition-property: append($moz-transition-property, -moz-#{$property}, comma);
-      $ms-transition-property: append($ms-transition-property, -ms-#{$property}, comma);
-      $o-transition-property: append($o-transition-property, -o-#{$property}, comma);
-    } @else {
-      $webkit-transition-property: append($webkit-transition-property, $property, comma);
-      $moz-transition-property: append($moz-transition-property, $property, comma);
-      $ms-transition-property: append($ms-transition-property, $property, comma);
-      $o-transition-property: append($o-transition-property, $property, comma);
-    }
-  }
-
-  @if $experimental-support-for-webkit    { -webkit-transition-property: $webkit-transition-property; }
-  @if $experimental-support-for-mozilla   { -moz-transition-property: $moz-transition-property; }
-  @if $experimental-support-for-microsoft { -ms-transition-property: $ms-transition-property; }
-  @if $experimental-support-for-opera     { -o-transition-property: $o-transition-property; }
-  transition-property: $properties;
 }
 
 // One or more durations in seconds
@@ -112,60 +79,7 @@ $transitionable-prefixed-properties: transform, transform-origin !default;
   $function: $default-transition-function,
   $delay: $default-transition-delay
 ) {
-  $match: false;
+  @include build-prefix-values(transition, compact($property $duration $function, false), $delay);
-
-  @each $prefixed-property in $transitionable-prefixed-properties {
-    @if $property == $prefixed-property {
-      $match: true;
-    }
-  }
-
-  @if $property and $duration and $function {
-    // Shorthand (see https://github.com/chriseppstein/compass/issues/585)
-    @if $delay {
-      @if $match {
-        @if $experimental-support-for-webkit    { -webkit-transition: -webkit-#{$property} $duration $function; -webkit-transition-delay: $delay; }
-        @if $experimental-support-for-mozilla   { -moz-transition: -moz-#{$property} $duration $function $delay; }
-        @if $experimental-support-for-microsoft { -ms-transition: -ms-#{$property} $duration $function $delay; }
-        @if $experimental-support-for-opera     { -o-transition: -o-#{$property} $duration $function $delay; }
-        transition: $property $duration $function $delay;
-      } @else {
-        @if $experimental-support-for-webkit    { -webkit-transition: $property $duration $function; -webkit-transition-delay: $delay; }
-        @include experimental(transition, $property $duration $function $delay,
-          -moz,
-          not -webkit,
-          -o,
-          -ms,
-          not -khtml,
-          official
-        );
-      }
-    }
-    @else {
-      @if $match {
-        @if $experimental-support-for-webkit    { -webkit-transition: -webkit-#{$property} $duration $function; }
-        @if $experimental-support-for-mozilla   { -moz-transition: -moz-#{$property} $duration $function; }
-        @if $experimental-support-for-microsoft { -ms-transition: -ms-#{$property} $duration $function; }
-        @if $experimental-support-for-opera     { -o-transition: -o-#{$property} $duration $function; }
-        transition: $property $duration $function;
-      } @else {
-        @include experimental(transition, $property $duration $function,
-          -moz,
-          -webkit,
-          -o,
-          -ms,
-          not -khtml,
-          official
-        );
-      }
-    }
-  }
-  @else {
-    @include transition-property($property);
-    @include transition-duration($duration);
-    @if $function { @include transition-timing-function($function); }
-    @if $delay { @include transition-delay($delay); }
-  }
 }
 
 @mixin transition(
@@ -185,49 +99,56 @@ $transitionable-prefixed-properties: transform, transform-origin !default;
   }
 
   $transition : compact($transition-1, $transition-2, $transition-3, $transition-4, $transition-5, $transition-6, $transition-7, $transition-8, $transition-9, $transition-10);
-  @include prefix-friendly-transition($transition);
+  @include build-prefix-values(transition, $transition);
 }
 
-@mixin prefix-friendly-transition($transition) {
+@mixin build-prefix-values($property, $values, $delay: false) {
-  $raw-transition: ($transition);
+  $raw-values: ($values);
+  $index: compact(false);
 
-  $webkit-transition: compact(false);
+  $webkit-value: compact(false);
-  $moz-transition: compact(false);
+  $moz-value: compact(false);
-  $ms-transition: compact(false);
+  $ms-value: compact(false);
-  $o-transition: compact(false);
+  $o-value: compact(false);
 
-  @each $single-transition in $raw-transition {
+  @each $value in $raw-values {
-    $property: nth($single-transition, 1);
+    $value: compact(join($value, false));
     $match: false;
 
-    @each $prefixed-property in $transitionable-prefixed-properties {
+    @each $prefixed-value in $transitionable-prefixed-values {
-      @if $property == $prefixed-property {
+      @if index($value, $prefixed-value) {
+        $index: index($value, $prefixed-value);
         $match: true;
       }
     }
 
     @if $match {
-      $single-transition-suffix: compact(false);
+      $value-prefix: nth($value, $index);
+      $value-suffix: compact(false);
 
-      @for $i from 2 through length($single-transition) {
+      @for $i from 2 through length($value) {
-        $single-transition-suffix: append($single-transition-suffix, nth($single-transition, $i), space);
+        $value-suffix: append($value-suffix, nth($value, $i), space);
       }
 
-      $webkit-transition: append($webkit-transition, compact(join(-webkit-#{$property}, $single-transition-suffix)), comma);
+      $non-webkit-suffix: compact(append($value-suffix, $delay, space));
-      $moz-transition: append($moz-transition, compact(join(-moz-#{$property}, $single-transition-suffix)), comma);
+
-      $ms-transition: append($ms-transition, compact(join(-ms-#{$property}, $single-transition-suffix)), comma);
+      $webkit-value: append($webkit-value, compact(join(-webkit-#{$value-prefix}, $value-suffix)), comma);
-      $o-transition: append($o-transition, compact(join(-o-#{$property}, $single-transition-suffix)), comma);
+      $moz-value: append($moz-value, compact(join(-moz-#{$value-prefix}, $non-webkit-suffix)), comma);
+      $ms-value: append($ms-value, compact(join(-ms-#{$value-prefix}, $non-webkit-suffix)), comma);
+      $o-value: append($o-value, compact(join(-o-#{$value-prefix}, $non-webkit-suffix)), comma);
     } @else {
-      $webkit-transition: append($webkit-transition, $single-transition, comma);
+      $non-webkit-value: compact(append($value, $delay, space));
-      $moz-transition: append($moz-transition, $single-transition, comma);
+
-      $ms-transition: append($ms-transition, $single-transition, comma);
+      $webkit-value: append($webkit-value, $value, comma);
-      $o-transition: append($o-transition, $single-transition, comma);
+      $moz-value: append($moz-value, $non-webkit-value, comma);
+      $ms-value: append($ms-value, $non-webkit-value, comma);
+      $o-value: append($o-value, $non-webkit-value, comma);
     }
   }
 
-  @if $experimental-support-for-webkit    { -webkit-transition: $webkit-transition; }
+  @if $experimental-support-for-webkit    { -webkit-#{$property} : $webkit-value; @if $delay { -webkit-#{$property}-delay : $delay; } }
-  @if $experimental-support-for-mozilla   { -moz-transition: $moz-transition; }
+  @if $experimental-support-for-mozilla   {    -moz-#{$property} :    $moz-value; }
-  @if $experimental-support-for-microsoft { -ms-transition: $ms-transition; }
+  @if $experimental-support-for-microsoft {     -ms-#{$property} :     $ms-value; }
-  @if $experimental-support-for-opera     { -o-transition: $o-transition; }
+  @if $experimental-support-for-opera     {      -o-#{$property} :      $o-value; }
-  transition: $transition;
+                                                    #{$property} :      compact($values $delay);
 }