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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/polymer/v1_0/components-chromium/paper-button/paper-button.html

Issue 1401633002: Update Polymer from 1.1.4 -> 1.1.5 (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: dzhioev@ review Created 5 years, 2 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 | « third_party/polymer/v1_0/components-chromium/paper-button/bower.json ('k') | third_party/polymer/v1_0/components-chromium/paper-button/paper-button-extracted.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!-- 1 <!--
2 @license 2 @license
3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE 4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS
7 Code distributed by Google as part of the polymer project is also 7 Code distributed by Google as part of the polymer project is also
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS
9 --><html><head><link rel="import" href="../polymer/polymer.html"> 9 --><html><head><link rel="import" href="../polymer/polymer.html">
10 <link rel="import" href="../paper-material/paper-material.html"> 10 <link rel="import" href="../paper-material/paper-material.html">
11 <link rel="import" href="../paper-ripple/paper-ripple.html"> 11 <link rel="import" href="../paper-ripple/paper-ripple.html">
12 <link rel="import" href="../paper-behaviors/paper-button-behavior.html"> 12 <link rel="import" href="../paper-behaviors/paper-button-behavior.html">
13 <link rel="import" href="../iron-flex-layout/iron-flex-layout.html"> 13 <link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
14 14
15 <!-- 15 <!--
16 16 Material design: [Buttons](https://www.google.com/design/spec/components/buttons .html)
17 Material Design: <a href="http://www.google.com/design/spec/components/buttons.h tml">Buttons</a>
18 17
19 `paper-button` is a button. When the user touches the button, a ripple effect em anates 18 `paper-button` is a button. When the user touches the button, a ripple effect em anates
20 from the point of contact. It may be flat or raised. A raised button is styled w ith a 19 from the point of contact. It may be flat or raised. A raised button is styled w ith a
21 shadow. 20 shadow.
22 21
23 Example: 22 Example:
24 23
25 <paper-button>Flat button</paper-button> 24 <paper-button>Flat button</paper-button>
26 <paper-button raised>Raised button</paper-button> 25 <paper-button raised>Raised button</paper-button>
27 <paper-button noink>No ripple effect</paper-button> 26 <paper-button noink>No ripple effect</paper-button>
(...skipping 39 matching lines...) Expand 10 before | Expand all | Expand 10 after
67 `--paper-button-ink-color` | Background color of the ripple | `Based on the butt on's color` 66 `--paper-button-ink-color` | Background color of the ripple | `Based on the butt on's color`
68 `--paper-button` | Mixin applied to the button | `{}` 67 `--paper-button` | Mixin applied to the button | `{}`
69 `--paper-button-disabled` | Mixin applied to the disabled button. Note that you can also use the `paper-button[disabled]` selector | `{}` 68 `--paper-button-disabled` | Mixin applied to the disabled button. Note that you can also use the `paper-button[disabled]` selector | `{}`
70 `--paper-button-flat-keyboard-focus` | Mixin applied to a flat button after it's been focused using the keyboard | `{}` 69 `--paper-button-flat-keyboard-focus` | Mixin applied to a flat button after it's been focused using the keyboard | `{}`
71 `--paper-button-raised-keyboard-focus` | Mixin applied to a raised button after it's been focused using the keyboard | `{}` 70 `--paper-button-raised-keyboard-focus` | Mixin applied to a raised button after it's been focused using the keyboard | `{}`
72 71
73 @demo demo/index.html 72 @demo demo/index.html
74 --> 73 -->
75 74
76 </head><body><dom-module id="paper-button"> 75 </head><body><dom-module id="paper-button">
77 <template> 76 <template strip-whitespace="">
78 77
79 <style> 78 <style include="paper-material">
80 :host { 79 :host {
81 display: inline-block; 80 display: inline-block;
82 position: relative; 81 position: relative;
83 box-sizing: border-box; 82 box-sizing: border-box;
84 min-width: 5.14em; 83 min-width: 5.14em;
85 margin: 0 0.29em; 84 margin: 0 0.29em;
86 background: transparent; 85 background: transparent;
87 text-align: center; 86 text-align: center;
88 font: inherit; 87 font: inherit;
89 text-transform: uppercase; 88 text-transform: uppercase;
90 outline-width: 0; 89 outline-width: 0;
91 border-radius: 3px; 90 border-radius: 3px;
92 -moz-user-select: none; 91 -moz-user-select: none;
93 -ms-user-select: none; 92 -ms-user-select: none;
94 -webkit-user-select: none; 93 -webkit-user-select: none;
95 user-select: none; 94 user-select: none;
96 cursor: pointer; 95 cursor: pointer;
97 z-index: 0; 96 z-index: 0;
98 padding: 0.7em 0.57em; 97 padding: 0.7em 0.57em;
99 98
100 @apply(--paper-button); 99 @apply(--paper-button);
101 } 100 }
102 101
103 :host([raised]) .keyboard-focus { 102 :host([raised].keyboard-focus) {
104 font-weight: bold; 103 font-weight: bold;
105 @apply(--paper-button-raised-keyboard-focus); 104 @apply(--paper-button-raised-keyboard-focus);
106 } 105 }
107 106
108 :host(:not([raised])) .keyboard-focus { 107 :host(:not([raised]).keyboard-focus) {
109 font-weight: bold; 108 font-weight: bold;
110 @apply(--paper-button-flat-keyboard-focus); 109 @apply(--paper-button-flat-keyboard-focus);
111 } 110 }
112 111
113 :host([disabled]) { 112 :host([disabled]) {
114 background: #eaeaea; 113 background: #eaeaea;
115 color: #a8a8a8; 114 color: #a8a8a8;
116 cursor: auto; 115 cursor: auto;
117 pointer-events: none; 116 pointer-events: none;
118 117
119 @apply(--paper-button-disabled); 118 @apply(--paper-button-disabled);
120 } 119 }
121 120
122 :host([noink]) paper-ripple {
123 display: none;
124 }
125
126 paper-ripple { 121 paper-ripple {
127 color: var(--paper-button-ink-color); 122 color: var(--paper-button-ink-color);
128 } 123 }
129 124
130 paper-material { 125 :host > ::content * {
131 border-radius: inherit;
132 @apply(--layout-fit);
133 }
134
135 .content > ::content * {
136 text-transform: inherit; 126 text-transform: inherit;
137 } 127 }
138 </style> 128 </style>
139 129 <content></content>
140 <paper-ripple></paper-ripple>
141
142 <paper-material elevation="[[_elevation]]" animated=""></paper-material>
143
144 <div class$="[[_computeContentClass(receivedFocusFromKeyboard)]]">
145 <content></content>
146 </div>
147
148 </template> 130 </template>
149 </dom-module> 131 </dom-module>
150 132
151 <script src="paper-button-extracted.js"></script></body></html> 133 <script src="paper-button-extracted.js"></script></body></html>
OLDNEW
« no previous file with comments | « third_party/polymer/v1_0/components-chromium/paper-button/bower.json ('k') | third_party/polymer/v1_0/components-chromium/paper-button/paper-button-extracted.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698