Old and new about pages: simplify product logo animation code

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

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @fileoverview 'settings-about-page' contains version and OS related
  * information.
  */
 Polymer({
   is: 'settings-about-page',
@@ skipping 263 matching lines @@
    * @return {boolean}
    * @private
    */
   shouldShowRegulatoryInfo_: function() {
     return this.regulatoryInfo_ !== null;
   },
 </if>
 
   /** @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">
   /** @private */
   onReportIssueTap_: function() {
     this.aboutBrowserProxy_.openFeedbackDialog();
   },
 </if>
 });