From b93f1b2acbf64e27086d0def406f31f2aab93afc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Paul=20O=E2=80=99Shannessy?= <paul@oshannessy.com>
Date: Sat, 11 Jan 2014 22:52:12 -0800
Subject: [PATCH] Use the recommended way to vendor prefix styles

See http://facebook.github.io/react/tips/inline-styles.html

This also adds in the non-prefixed styles to make Firefox work but
commented out since there are issues with SVG and transform-origin.
See #48
---
 src/elements/VectorWidget/VectorWidget.js | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/elements/VectorWidget/VectorWidget.js b/src/elements/VectorWidget/VectorWidget.js
index 06961df..3d39eba 100644
--- a/src/elements/VectorWidget/VectorWidget.js
+++ b/src/elements/VectorWidget/VectorWidget.js
@@ -78,9 +78,15 @@ var VectorWidget = React.createClass({
    * describe the structure of your UI component at *any* point in time.
    */
   render: function() {
+    var transformOrigin = '50% 50%';
+    var transform = 'rotate(' + this.state.degrees + 'deg)';
+
     var rotationStyle = {
-      '-webkit-transform-origin': '50% 50%',
-      '-webkit-transform': 'rotate(' + this.state.degrees + 'deg)'
+      WebkitTransformOrigin: transformOrigin,
+      WebkitTransform: transform,
+      // TODO: Figure out why transform-origin don't work in Firefox
+      // transformOrigin: transformOrigin,
+      // transform: transform
     };
     return (
       <svg