From 9a40ba9ec3f834871886f253c375af0c03ed4d86 Mon Sep 17 00:00:00 2001
From: Richard Herrera <rich@doctyper.com>
Date: Sun, 26 Feb 2012 11:39:30 -0800
Subject: [PATCH] transition-property mixin now includes support for multiple
 prefixed values.

---
 .../stylesheets/compass/css3/_transition.scss | 44 ++++++++++++-------
 1 file changed, 29 insertions(+), 15 deletions(-)

diff --git a/frameworks/compass/stylesheets/compass/css3/_transition.scss b/frameworks/compass/stylesheets/compass/css3/_transition.scss
index 6a865049..14b3fbe2 100644
--- a/frameworks/compass/stylesheets/compass/css3/_transition.scss
+++ b/frameworks/compass/stylesheets/compass/css3/_transition.scss
@@ -32,26 +32,40 @@ $transitionable-prefixed-properties: transform, transform-origin !default;
 
 @mixin transition-property($properties: $default-transition-property) {
   @if type-of($properties) == string { $properties: unquote($properties); }
+  $raw-properties: -compass-space-list($properties);
 
-  $match: false;
+  $webkit-transition-property: false;
+  $moz-transition-property: false;
+  $ms-transition-property: false;
+  $o-transition-property: false;
 
-  @each $prefixed-property in $transitionable-prefixed-properties {
-    @if $properties == $prefixed-property {
-      $match: true;
+  @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: array-push($webkit-transition-property, -webkit-#{$property}, true);
+      $moz-transition-property: array-push($moz-transition-property, -moz-#{$property}, true);
+      $ms-transition-property: array-push($ms-transition-property, -ms-#{$property}, true);
+      $o-transition-property: array-push($o-transition-property, -o-#{$property}, true);
+    } @else {
+      $webkit-transition-property: array-push($webkit-transition-property, $property, true);
+      $moz-transition-property: array-push($moz-transition-property, $property, true);
+      $ms-transition-property: array-push($ms-transition-property, $property, true);
+      $o-transition-property: array-push($o-transition-property, $property, true);
     }
   }
 
-  @if $match {
-    @if $experimental-support-for-webkit    { -webkit-transition-property: -webkit-#{$properties}; }
-    @if $experimental-support-for-mozilla   { -moz-transition-property: -moz-#{$properties}; }
-    @if $experimental-support-for-microsoft { -ms-transition-property: -ms-#{$properties}; }
-    @if $experimental-support-for-opera     { -o-transition-property: -o-#{$properties}; }
-    transition-property: $properties;
-  } @else {
-    @include experimental(transition-property, $properties,
-      -moz, -webkit, -o, -ms, not -khtml, official
-    );
-  }
+  @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