Unified icon-buttons used in the new GAIA flow.

chrome/browser/resources/chromeos/login/gaia_buttons.html

Index: chrome/browser/resources/chromeos/login/gaia_buttons.html
diff --git a/chrome/browser/resources/chromeos/login/gaia_buttons.html b/chrome/browser/resources/chromeos/login/gaia_buttons.html
index 33a1cc826b303da5e2675b51ab658ec1968caff6..00ddf8463700e9a06b1a7fe10245ccf00fc9d252 100644
--- a/chrome/browser/resources/chromeos/login/gaia_buttons.html
+++ b/chrome/browser/resources/chromeos/login/gaia_buttons.html
@@ -1,6 +1,7 @@
-<link rel="import" href="chrome://resources/polymer/polymer/polymer.html">
-<link rel="import" href="chrome://resources/polymer/core-icon-button/core-icon-button.html">
+<link rel="import" href="chrome://resources/polymer/core-icon/core-icon.html">
+<link rel="import" href="chrome://resources/polymer/core-icons/core-icons.html">
 <link rel="import" href="chrome://resources/polymer/paper-button/paper-button.html">
+<link rel="import" href="chrome://resources/polymer/polymer/polymer.html">
 
 <!--
   Simple paper- and core-icon- buttons which also triggers 'tap' event on keys
@@ -13,11 +14,19 @@
   </template>
 </polymer-element>
 
-<polymer-element name="gaia-core-icon-button" extends="core-icon-button"
-    on-keydown="onKeyDown" tabindex="0">
+<!--
+  Decorator for a <button>. When applied to a <button>, the button looks like
+  an icon from a material-design icons set. Icon's name should be specified in
+  'icon' attribute.
+
+  Example:
+    <button is="gaia-icon-button" icon="close"></button>
+-->
+<polymer-element name="gaia-icon-button" extends="button" attributes="icon"

[michaelpg, 2015/05/08 22:02:22]

Note: this kind of inheritance isn't available in Polymer 0.8. I'd suggest using
a standalone element or looking into prototype mixins.

[dzhioev (left Google), 2015/05/08 22:29:02]

We are going to use <paper-icon-button> in 0.8 anyway. We can't use it now
because it is broken in 0.5.*

+    on-mousedown="{{onMouseDown}}">
   <template>
-    <link rel="stylesheet" href="gaia_core_icon_button.css">
-    <shadow></shadow>
+    <link rel="stylesheet" href="gaia_icon_button.css">
+    <core-icon icon="{{icon}}" fit></core-icon>
   </template>
 </polymer-element>