Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(440)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: polymer_0.5.0/bower_components/paper-icon-button/demo.html

Issue 786953007: npm_modules: Fork bower_components into Polymer 0.4.0 and 0.5.0 versions (Closed) Base URL: https://chromium.googlesource.com/infra/third_party/npm_modules.git@master
Patch Set: Created 5 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « polymer_0.5.0/bower_components/paper-icon-button/bower.json ('k') | polymer_0.5.0/bower_components/paper-icon-button/index.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!doctype html> 1 <!doctype html>
2 <!-- 2 <!--
3 Copyright 2013 The Polymer Authors. All rights reserved. 3 Copyright 2013 The Polymer Authors. All rights reserved.
4 Use of this source code is governed by a BSD-style 4 Use of this source code is governed by a BSD-style
5 license that can be found in the LICENSE file. 5 license that can be found in the LICENSE file.
6 --> 6 -->
7 <html> 7 <html>
8 <head> 8 <head>
9 <title>paper-icon-button</title> 9 <title>paper-icon-button</title>
10 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initia l-scale=1, user-scalable=yes"> 10 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initia l-scale=1, user-scalable=yes">
11 <script src="../platform/platform.js"></script> 11 <script src="../webcomponentsjs/webcomponents.js"></script>
12 12
13 <link rel="import" href="../core-icons/core-icons.html"> 13 <link rel="import" href="../core-icons/core-icons.html">
14 <link rel="import" href="paper-icon-button.html"> 14 <link rel="import" href="paper-icon-button.html">
15 15
16 <style shim-shadowdom> 16 <style shim-shadowdom>
17 body { 17 body {
18 font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial; 18 font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial;
19 font-size: 14px; 19 font-size: 14px;
20 margin: 0; 20 margin: 0;
21 padding: 24px; 21 padding: 24px;
(...skipping 24 matching lines...) Expand all
46 } 46 }
47 47
48 paper-icon-button.red { 48 paper-icon-button.red {
49 color: #fe774d; 49 color: #fe774d;
50 } 50 }
51 51
52 paper-icon-button.blueRipple::shadow #ripple { 52 paper-icon-button.blueRipple::shadow #ripple {
53 color: #4285f4; 53 color: #4285f4;
54 } 54 }
55 55
56 paper-icon-button.huge::shadow #icon {
57 width: 100px;
58 height: 100px;
59 }
60
56 /* core-selector paper-icon-button:not([active])::shadow core-icon { 61 /* core-selector paper-icon-button:not([active])::shadow core-icon {
57 color: #c9c9c9; 62 color: #c9c9c9;
58 } 63 }
59 */ 64 */
60 paper-icon-button.custom { 65 paper-icon-button.custom {
61 color: #a9edff; 66 color: #a9edff;
62 } 67 }
63 </style> 68 </style>
64 69
65 </head> 70 </head>
66 71
67 <body unresolved onclick="clickAction(event);"> 72 <body unresolved onclick="clickAction(event);">
68 73
69 <column> 74 <column>
70 75
71 <section> 76 <section>
72 77
73 <div>Icon buttons</div> 78 <div>Icon buttons</div>
74 79
75 <paper-icon-button icon="menu"></paper-icon-button> 80 <paper-icon-button icon="menu" title="menu"></paper-icon-button>
76 <paper-icon-button icon="arrow-back"></paper-icon-button> 81 <paper-icon-button icon="arrow-back" title="arrow-back"></paper-icon-but ton>
77 <paper-icon-button icon="arrow-forward"></paper-icon-button> 82 <paper-icon-button icon="arrow-forward" title="arrow-forward"></paper-ic on-button>
78 <paper-icon-button disabled icon="clear"></paper-icon-button> 83 <paper-icon-button disabled icon="clear" title="clear"></paper-icon-butt on>
79 84
80 </section> 85 </section>
81 86
82 <br> 87 <br>
83 88
84 <section> 89 <section>
85 90
86 <div>Styled</div> 91 <div>Styled</div>
87 92
88 <paper-icon-button icon="favorite"></paper-icon-button> 93 <paper-icon-button class="hover" icon="favorite" title="with :hover styl e"></paper-icon-button>
89 <paper-icon-button class="hover" icon="favorite"></paper-icon-button> 94 <paper-icon-button class="red" icon="favorite" title="red icon"></paper- icon-button>
90 <paper-icon-button class="red" icon="favorite"></paper-icon-button> 95 <paper-icon-button class="red blueRipple" icon="favorite" title="red ico n, blue ripple"></paper-icon-button>
91 <paper-icon-button class="red blueRipple" icon="favorite"></paper-icon-b utton> 96
97 <br>
98
99 <paper-icon-button class="huge" icon="favorite" title="huge"></paper-ico n-button>
92 100
93 </section> 101 </section>
94 102
103 <section>
104
105 <div>Link</div>
106
107 <a href="https://www.polymer-project.org" target="_blank">
108 <paper-icon-button icon="polymer" title="polymer"></paper-icon-button>
109 </a>
110
111 </section>
112
95 <!-- <section> 113 <!-- <section>
96 <span>focused</span> 114 <span>focused</span>
97 <paper-icon-button focused icon="social:cake"></paper-icon-button> 115 <paper-icon-button focused icon="social:cake"></paper-icon-button>
98 <paper-icon-button focused icon="social:plus-one"></paper-icon-button> 116 <paper-icon-button focused icon="social:plus-one"></paper-icon-button>
99 </section> 117 </section>
100 --> 118 -->
101 <!-- <section> 119 <!-- <section>
102 <span>segmented</span> 120 <span>segmented</span>
103 <core-selector selected="1"> 121 <core-selector selected="1">
104 <paper-icon-button fill isToggle icon="maps:directionswalk"></paper-ic on-button> 122 <paper-icon-button fill isToggle icon="maps:directionswalk"></paper-ic on-button>
105 <paper-icon-button fill isToggle icon="maps:directions-bike"></paper-i con-button> 123 <paper-icon-button fill isToggle icon="maps:directions-bike"></paper-i con-button>
106 <paper-icon-button fill isToggle icon="maps:directions-transit"></pape r-icon-button> 124 <paper-icon-button fill isToggle icon="maps:directions-transit"></pape r-icon-button>
107 <paper-icon-button fill isToggle icon="maps:directions-car"></paper-ic on-button> 125 <paper-icon-button fill isToggle icon="maps:directions-car"></paper-ic on-button>
108 </core-selector> 126 </core-selector>
109 </section> 127 </section>
110 --> 128 -->
111 <section> 129 <section>
112 130
113 <div>Custom icon src</div> 131 <div>Custom icon src</div>
114 132
115 <paper-icon-button class="custom" src="https://assets-cdn.github.com/ima ges/modules/logos_page/Octocat.png" aria-label="octocat"></paper-icon-button> 133 <paper-icon-button class="custom" src="https://assets-cdn.github.com/ima ges/modules/logos_page/Octocat.png" aria-label="octocat" title="octocat"></paper -icon-button>
116 134
117 </section> 135 </section>
118 </column> 136 </column>
119 137
120 <script> 138 <script>
121 139
122 function clickAction(e) { 140 function clickAction(e) {
123 var t = e.target; 141 var t = e.target;
124 if (t.localName === 'paper-icon-button') { 142 if (t.localName === 'paper-icon-button') {
125 if (t.hasAttribute('disabled')) { 143 if (t.hasAttribute('disabled')) {
126 console.error('should not be able to click disabled button', t); 144 console.error('should not be able to click disabled button', t);
127 } else { 145 } else {
128 console.log('click', t); 146 console.log('click', t);
129 } 147 }
130 } 148 }
131 } 149 }
132 150
133 </script> 151 </script>
134 152
135 </body> 153 </body>
136 </html> 154 </html>
OLDNEW
« no previous file with comments | « polymer_0.5.0/bower_components/paper-icon-button/bower.json ('k') | polymer_0.5.0/bower_components/paper-icon-button/index.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698