Old and new about pages: simplify product logo animation code

chrome/browser/resources/settings/about_page/about_page.js

Index: chrome/browser/resources/settings/about_page/about_page.js
diff --git a/chrome/browser/resources/settings/about_page/about_page.js b/chrome/browser/resources/settings/about_page/about_page.js
index 69fda24b8c4b39d0f37d2d7682ad284d415caee7..df86d49102ab781cf575745575e0ef4d4cc2565d 100644
--- a/chrome/browser/resources/settings/about_page/about_page.js
+++ b/chrome/browser/resources/settings/about_page/about_page.js
@@ -281,11 +281,12 @@ Polymer({
 
   /** @private */
   onProductLogoTap_: function() {
-    var logo = this.$['product-logo'];
-    logo.classList.remove('spin');
-    // Force a style recalc that cancels the animation specified by "spin".
-    getComputedStyle(logo).getPropertyValue('animation-name');
-    logo.classList.add('spin');
+    this.$['product-logo'].animate({
+      transform: ['none', 'rotate(-10turn)'],
+    }, {
+      duration: 500,
+      easing: 'cubic-bezier(1, 0, 0, 1)',
+    });
   },
 
 <if expr="_google_chrome">