Chromium Code Reviews| OLD | NEW |
|---|---|
| 1 <!-- TODO(crbug.com/603217): Use i18n instead of string literals. Figure out | 1 <!-- TODO(crbug.com/603217): Use i18n instead of string literals. Figure out |
| 2 what i18n to use for keypad, ie, does 1 ABC make | 2 what i18n to use for keypad, ie, does 1 ABC make |
| 3 sense in every scenario? --> | 3 sense in every scenario? --> |
| 4 | 4 |
| 5 <link rel="import" href="chrome://resources/cr_elements/icons.html"> | 5 <link rel="import" href="chrome://resources/cr_elements/icons.html"> |
| 6 <link rel="import" href="chrome://resources/html/i18n_behavior.html"> | 6 <link rel="import" href="chrome://resources/html/i18n_behavior.html"> |
| 7 <link rel="import" href="chrome://resources/html/polymer.html"> | 7 <link rel="import" href="chrome://resources/html/polymer.html"> |
| 8 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-butt on.html"> | 8 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-butt on.html"> |
| 9 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper -icon-button.html"> | 9 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper -icon-button.html"> |
| 10 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.html "> | 10 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.html "> |
| (...skipping 113 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 124 } | 124 } |
| 125 | 125 |
| 126 #pin-input[has-content] { | 126 #pin-input[has-content] { |
| 127 opacity: var(--dark-primary-opacity); | 127 opacity: var(--dark-primary-opacity); |
| 128 } | 128 } |
| 129 | 129 |
| 130 #pin-input[is-input-rtl] { | 130 #pin-input[is-input-rtl] { |
| 131 direction: rtl; | 131 direction: rtl; |
| 132 } | 132 } |
| 133 | 133 |
| 134 #pin-input[is-invisible] { | |
| 135 visiblity: hidden; | |
| 136 } | |
| 137 | |
| 134 :host(:not([enable-submit-button])) #pin-input { | 138 :host(:not([enable-submit-button])) #pin-input { |
| 135 left: 0; | 139 left: 0; |
| 136 text-align: center; | 140 text-align: center; |
| 137 width: 180px; | 141 width: 180px; |
| 138 } | 142 } |
| 139 | 143 |
| 140 hr { | 144 hr { |
| 141 border: 0; | 145 border: 0; |
| 142 border-bottom: 1px solid #000; | 146 border-bottom: 1px solid #000; |
| 143 left: 10px; | 147 left: 10px; |
| 144 margin: 0; | 148 margin: 0; |
| 145 opacity: 0.14; | 149 opacity: 0.14; |
| 146 position: relative; | 150 position: relative; |
| 147 width: 160px; | 151 width: 160px; |
| 148 } | 152 } |
| 149 | 153 |
| 150 #pin-input[type=number]::-webkit-inner-spin-button, | 154 #pin-input[type=number]::-webkit-inner-spin-button, |
| 151 #pin-input[type=number]::-webkit-outer-spin-button { | 155 #pin-input[type=number]::-webkit-outer-spin-button { |
| 152 -webkit-appearance: none; | 156 -webkit-appearance: none; |
| 153 margin: 0; | 157 margin: 0; |
| 154 } | 158 } |
| 155 | 159 |
| 156 /* Ensure that all children of paper-button do not consume events. This | 160 /* Ensure that all children of paper-button do not consume events. This |
| 157 * simplifies the event handler code. */ | 161 * simplifies the event handler code. */ |
| 158 paper-button * { | 162 paper-button * { |
| 159 pointer-events: none; | 163 pointer-events: none; |
| 160 } | 164 } |
| 161 </style> | 165 </style> |
| 162 | 166 |
| 163 <div id="root"> | 167 <div id="root" on-keypress="onKeyPress_" on-keydown="onKeyDown_"> |
| 164 <div id="container-constrained-width"> | 168 <div id="container-constrained-width"> |
| 165 <div class="row"> | 169 <div class="row first-row"> |
| 166 <input id="pin-input" type="[[getInputType_(enablePassword)]]" | 170 <input id="pin-input" type="[[getInputType_(enablePassword)]]" |
| 167 is-input-rtl$="[[isInputRtl_(value)]]" | 171 is-input-rtl$="[[isInputRtl_(value)]]" |
| 168 has-content$="[[hasInput_(value)]]" | 172 has-content$="[[hasInput_(value)]]" |
| 169 placeholder="[[getInputPlaceholder_(enablePassword)]]" | 173 placeholder="[[getInputPlaceholder_(enablePassword)]]" |
| 170 value="{{value::input}}" | 174 value="{{value::input}}" |
| 171 on-keydown="onInputKeyDown_"> | 175 on-keydown="onInputKeyDown_" |
| 176 is-invisible$=[[hideInput]]> | |
| 172 </input> | 177 </input> |
| 173 <paper-icon-button icon="pin-keyboard:arrow-forward" | |
| 174 class="digit-button submit-button" | |
| 175 disabled="[[!hasInput_(value)]]" | |
| 176 hidden="[[!enableSubmitButton]]" | |
| 177 on-tap="firePinSubmitEvent_"> | |
| 178 </paper-icon-button> | |
| 179 </div> | 178 </div> |
| 180 <hr> | 179 <hr> |
| 181 <div class="row keyboard top-row"> | 180 <div class="row keyboard"> |
| 182 <paper-button class="digit-button" on-tap="onNumberTap_" value="1"> | 181 <paper-button class="digit-button" on-tap="onNumberTap_" value="1"> |
| 183 <inner-text>$i18n{pinKeyboard1}</inner-text> | 182 <inner-text>$i18n{pinKeyboard1}</inner-text> |
| 184 </paper-button> | 183 </paper-button> |
| 185 <paper-button class="digit-button" on-tap="onNumberTap_" value="2"> | 184 <paper-button class="digit-button center-button" on-tap="onNumberTap_" |
|
jdufault
2016/08/29 23:58:38
Are these accidental rebase changes?
sammiequon
2016/08/30 01:24:56
Yes rebased from last weeks cl.
| |
| 185 value="2"> | |
| 186 <inner-text>$i18n{pinKeyboard2}</inner-text> | 186 <inner-text>$i18n{pinKeyboard2}</inner-text> |
| 187 </paper-button> | 187 </paper-button> |
| 188 <paper-button class="digit-button" on-tap="onNumberTap_" value="3"> | 188 <paper-button class="digit-button" on-tap="onNumberTap_" value="3"> |
| 189 <inner-text>$i18n{pinKeyboard3}</inner-text> | 189 <inner-text>$i18n{pinKeyboard3}</inner-text> |
| 190 </paper-button> | 190 </paper-button> |
| 191 </div> | 191 </div> |
| 192 <div class="row keyboard"> | 192 <div class="row keyboard"> |
| 193 <paper-button class="digit-button" on-tap="onNumberTap_" value="4"> | 193 <paper-button class="digit-button" on-tap="onNumberTap_" value="4"> |
| 194 <inner-text>$i18n{pinKeyboard4}</inner-text> | 194 <inner-text>$i18n{pinKeyboard4}</inner-text> |
| 195 </paper-button> | 195 </paper-button> |
| 196 <paper-button class="digit-button" on-tap="onNumberTap_" value="5"> | 196 <paper-button class="digit-button center-button" on-tap="onNumberTap_" |
| 197 value="5"> | |
| 197 <inner-text>$i18n{pinKeyboard5}</inner-text> | 198 <inner-text>$i18n{pinKeyboard5}</inner-text> |
| 198 </paper-button> | 199 </paper-button> |
| 199 <paper-button class="digit-button" on-tap="onNumberTap_" value="6"> | 200 <paper-button class="digit-button" on-tap="onNumberTap_" value="6"> |
| 200 <inner-text>$i18n{pinKeyboard6}</inner-text> | 201 <inner-text>$i18n{pinKeyboard6}</inner-text> |
| 201 </paper-button> | 202 </paper-button> |
| 202 </div> | 203 </div> |
| 203 <div class="row keyboard"> | 204 <div class="row keyboard"> |
| 204 <paper-button class="digit-button" on-tap="onNumberTap_" value="7"> | 205 <paper-button class="digit-button" on-tap="onNumberTap_" value="7"> |
| 205 <inner-text>$i18n{pinKeyboard7}</inner-text> | 206 <inner-text>$i18n{pinKeyboard7}</inner-text> |
| 206 </paper-button> | 207 </paper-button> |
| 207 <paper-button class="digit-button" on-tap="onNumberTap_" value="8"> | 208 <paper-button class="digit-button center-button" on-tap="onNumberTap_" |
| 209 value="8"> | |
| 208 <inner-text>$i18n{pinKeyboard8}</inner-text> | 210 <inner-text>$i18n{pinKeyboard8}</inner-text> |
| 209 </paper-button> | 211 </paper-button> |
| 210 <paper-button class="digit-button" on-tap="onNumberTap_" value="9"> | 212 <paper-button class="digit-button" on-tap="onNumberTap_" value="9"> |
| 211 <inner-text>$i18n{pinKeyboard9}</inner-text> | 213 <inner-text>$i18n{pinKeyboard9}</inner-text> |
| 212 </paper-button> | 214 </paper-button> |
| 213 </div> | 215 </div> |
| 214 <div class="row keyboard bottom-row"> | 216 <div class="row keyboard bottom-row"> |
| 215 <div class="digit-button"></div> | 217 <div class="digit-button"></div> |
| 216 <paper-button class="digit-button" on-tap="onNumberTap_" value="0"> | 218 <paper-button class="digit-button" on-tap="onNumberTap_" value="0"> |
| 217 <inner-text>$i18n{pinKeyboard0}</inner-text> | 219 <inner-text>$i18n{pinKeyboard0}</inner-text> |
| 218 </paper-button> | 220 </paper-button> |
| 219 <paper-icon-button class="digit-button backspace-button" | 221 <paper-icon-button class="digit-button backspace-button" |
| 220 disabled="[[!hasInput_(value)]]" | 222 disabled="[[!hasInput_(value)]]" |
| 221 on-tap="onPinClear_" icon="pin-keyboard:backspace"> | 223 on-tap="onPinClear_" icon="pin-keyboard:backspace"> |
| 222 </paper-icon-button> | 224 </paper-icon-button> |
| 223 </div> | 225 </div> |
| 224 </div> | 226 </div> |
| 225 </div> | 227 </div> |
| 226 </template> | 228 </template> |
| 227 <script src="pin_keyboard.js"></script> | 229 <script src="pin_keyboard.js"></script> |
| 228 </dom-module> | 230 </dom-module> |
| OLD | NEW |