<!-- @license Copyright (c) 2015 The Polymer Project Authors. All rights reserved. This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as part of the polymer project is also subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt --> <link rel="import" href="../../polymer/polymer.html"> <link rel="import" href="../../paper-material/paper-material.html"> <link rel="import" href="../paper-button-behavior.html"> <dom-module id="paper-button"> <style> :host { display: inline-block; position: relative; background-color: #4285F4; color: #fff; border-radius: 3px; text-transform: uppercase; outline: none; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; user-select: none; cursor: pointer; } paper-material { border-radius: inherit; padding: 16px; } :host([disabled]) { background-color: #888; pointer-events: none; } :host([active]), :host([pressed]) { background-color: #3367D6; box-shadow: inset 0 3px 5px rgba(0,0,0,.2); } </style> <template> <paper-material class="content" elevation="[[_elevation]]" animated> <content></content> </paper-material> </template> <script> Polymer({ is: 'paper-button', behaviors: [ Polymer.PaperButtonBehavior ] }); </script> </dom-module>