1 <!doctype html> 2 <!-- 3 @license 4 Copyright (c) 2016 The Polymer Project Authors. All rights reserved. 5 This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 6 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 7 The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 8 Code distributed by Google as part of the polymer project is also 9 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 10 --> 11 <html> 12 <head> 13 <title>paper-icon-button-light demo</title> 14 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes"> 15 <script src="../../webcomponentsjs/webcomponents-lite.js"></script> 16 17 <link rel="import" href="../../iron-icons/iron-icons.html"> 18 <link rel="import" href="../../paper-styles/color.html"> 19 <link rel="import" href="../../iron-demo-helpers/demo-snippet.html"> 20 <link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html"> 21 <link rel="import" href="../paper-icon-button-light.html"> 22 23 <style is="custom-style" include="demo-pages-shared-styles"></style> 24 </head> 25 <body unresolved> 26 <div class="vertical-section-container centered"> 27 <h3>paper-icon-button-light can contain iron-icons or external images and can be disabled</h3> 28 <demo-snippet class="centered-demo"> 29 <template> 30 <style is="custom-style"> 31 button[is=paper-icon-button-light] { 32 width: 40px; 33 height: 40px; 34 padding: 8px; 35 margin: 10px; 36 } 37 38 button[is=paper-icon-button-light] > img { 39 width: 24px; 40 height: 24px; 41 } 42 </style> 43 44 <button is="paper-icon-button-light" title="heart"> 45 <iron-icon icon="favorite"></iron-icon> 46 </button> 47 <button is="paper-icon-button-light" title="octocat"> 48 <img src="https://assets-cdn.github.com/images/modules/logos_page/Octocat.png" alt="octocat"> 49 </button> 50 <button is="paper-icon-button-light" title="reply" disabled> 51 <iron-icon icon="reply"></iron-icon> 52 </button> 53 </template> 54 </demo-snippet> 55 </div> 56 </body> 57 </html> 58
