| 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 101 matching lines...) Expand 10 before | Expand all | Expand 10 after  Loading... | 
|  112         background-color: white; |  112         background-color: white; | 
|  113         border: 0; |  113         border: 0; | 
|  114         box-sizing: border-box; |  114         box-sizing: border-box; | 
|  115         font-face: Roboto-Regular; |  115         font-face: Roboto-Regular; | 
|  116         font-size: 13px; |  116         font-size: 13px; | 
|  117         height: 43px; |  117         height: 43px; | 
|  118         left: 10px; |  118         left: 10px; | 
|  119         opacity: var(--dark-secondary-opacity); |  119         opacity: var(--dark-secondary-opacity); | 
|  120         outline: 0; |  120         outline: 0; | 
|  121         position: relative; |  121         position: relative; | 
|  122         text-color: #000; |  | 
|  123         width: 127px; |  122         width: 127px; | 
|  124       } |  123       } | 
|  125  |  124  | 
|  126       #pin-input[has-content] { |  125       #pin-input[has-content] { | 
|  127         opacity: var(--dark-primary-opacity); |  126         opacity: var(--dark-primary-opacity); | 
|  128       } |  127       } | 
|  129  |  128  | 
|  130       #pin-input[is-input-rtl] { |  129       #pin-input[is-input-rtl] { | 
|  131         direction: rtl; |  130         direction: rtl; | 
|  132       } |  131       } | 
|  133  |  132  | 
|  134       #pin-input[is-invisible] { |  133       #pin-input[is-invisible] { | 
|  135         visiblity: hidden; |  134         visibility: hidden; | 
|  136       } |  135       } | 
|  137  |  136  | 
|  138       :host(:not([enable-submit-button])) #pin-input { |  137       :host(:not([enable-submit-button])) #pin-input { | 
|  139         left: 0; |  138         left: 0; | 
|  140         text-align: center; |  139         text-align: center; | 
|  141         width: 180px; |  140         width: 180px; | 
|  142       } |  141       } | 
|  143  |  142  | 
|  144       hr { |  143       hr { | 
|  145         border: 0; |  144         border: 0; | 
| (...skipping 28 matching lines...) Expand all  Loading... | 
|  174                  value="{{value::input}}" |  173                  value="{{value::input}}" | 
|  175                  on-keydown="onInputKeyDown_" |  174                  on-keydown="onInputKeyDown_" | 
|  176                  is-invisible$=[[hideInput]]> |  175                  is-invisible$=[[hideInput]]> | 
|  177           </input> |  176           </input> | 
|  178         </div> |  177         </div> | 
|  179         <hr> |  178         <hr> | 
|  180         <div class="row keyboard"> |  179         <div class="row keyboard"> | 
|  181           <paper-button class="digit-button" on-tap="onNumberTap_" value="1"> |  180           <paper-button class="digit-button" on-tap="onNumberTap_" value="1"> | 
|  182             <inner-text>$i18n{pinKeyboard1}</inner-text> |  181             <inner-text>$i18n{pinKeyboard1}</inner-text> | 
|  183           </paper-button> |  182           </paper-button> | 
|  184           <paper-button class="digit-button center-button" on-tap="onNumberTap_" |  183           <paper-button class="digit-button" on-tap="onNumberTap_" value="2"> | 
|  185                         value="2"> |  | 
|  186             <inner-text>$i18n{pinKeyboard2}</inner-text> |  184             <inner-text>$i18n{pinKeyboard2}</inner-text> | 
|  187           </paper-button> |  185           </paper-button> | 
|  188           <paper-button class="digit-button" on-tap="onNumberTap_" value="3"> |  186           <paper-button class="digit-button" on-tap="onNumberTap_" value="3"> | 
|  189             <inner-text>$i18n{pinKeyboard3}</inner-text> |  187             <inner-text>$i18n{pinKeyboard3}</inner-text> | 
|  190           </paper-button> |  188           </paper-button> | 
|  191         </div> |  189         </div> | 
|  192         <div class="row keyboard"> |  190         <div class="row keyboard"> | 
|  193           <paper-button class="digit-button" on-tap="onNumberTap_" value="4"> |  191           <paper-button class="digit-button" on-tap="onNumberTap_" value="4"> | 
|  194             <inner-text>$i18n{pinKeyboard4}</inner-text> |  192             <inner-text>$i18n{pinKeyboard4}</inner-text> | 
|  195           </paper-button> |  193           </paper-button> | 
|  196           <paper-button class="digit-button center-button" on-tap="onNumberTap_" |  194           <paper-button class="digit-button" on-tap="onNumberTap_" value="5"> | 
|  197                         value="5"> |  | 
|  198             <inner-text>$i18n{pinKeyboard5}</inner-text> |  195             <inner-text>$i18n{pinKeyboard5}</inner-text> | 
|  199           </paper-button> |  196           </paper-button> | 
|  200           <paper-button class="digit-button" on-tap="onNumberTap_" value="6"> |  197           <paper-button class="digit-button" on-tap="onNumberTap_" value="6"> | 
|  201             <inner-text>$i18n{pinKeyboard6}</inner-text> |  198             <inner-text>$i18n{pinKeyboard6}</inner-text> | 
|  202           </paper-button> |  199           </paper-button> | 
|  203         </div> |  200         </div> | 
|  204         <div class="row keyboard"> |  201         <div class="row keyboard"> | 
|  205           <paper-button class="digit-button" on-tap="onNumberTap_" value="7"> |  202           <paper-button class="digit-button" on-tap="onNumberTap_" value="7"> | 
|  206             <inner-text>$i18n{pinKeyboard7}</inner-text> |  203             <inner-text>$i18n{pinKeyboard7}</inner-text> | 
|  207           </paper-button> |  204           </paper-button> | 
|  208           <paper-button class="digit-button center-button" on-tap="onNumberTap_" |  205           <paper-button class="digit-button" on-tap="onNumberTap_" value="8"> | 
|  209                         value="8"> |  | 
|  210             <inner-text>$i18n{pinKeyboard8}</inner-text> |  206             <inner-text>$i18n{pinKeyboard8}</inner-text> | 
|  211           </paper-button> |  207           </paper-button> | 
|  212           <paper-button class="digit-button" on-tap="onNumberTap_" value="9"> |  208           <paper-button class="digit-button" on-tap="onNumberTap_" value="9"> | 
|  213             <inner-text>$i18n{pinKeyboard9}</inner-text> |  209             <inner-text>$i18n{pinKeyboard9}</inner-text> | 
|  214           </paper-button> |  210           </paper-button> | 
|  215         </div> |  211         </div> | 
|  216         <div class="row keyboard bottom-row"> |  212         <div class="row keyboard bottom-row"> | 
|  217           <div class="digit-button"></div> |  213           <div class="digit-button"></div> | 
|  218           <paper-button class="digit-button" on-tap="onNumberTap_" value="0"> |  214           <paper-button class="digit-button" on-tap="onNumberTap_" value="0"> | 
|  219             <inner-text>$i18n{pinKeyboard0}</inner-text> |  215             <inner-text>$i18n{pinKeyboard0}</inner-text> | 
|  220           </paper-button> |  216           </paper-button> | 
|  221           <paper-icon-button class="digit-button backspace-button" |  217           <paper-icon-button class="digit-button backspace-button" | 
|  222                              disabled="[[!hasInput_(value)]]" |  218                              disabled="[[!hasInput_(value)]]" | 
|  223                              on-tap="onPinClear_" icon="pin-keyboard:backspace"> |  219                              on-tap="onPinClear_" icon="pin-keyboard:backspace"> | 
|  224           </paper-icon-button> |  220           </paper-icon-button> | 
|  225         </div> |  221         </div> | 
|  226       </div> |  222       </div> | 
|  227     </div> |  223     </div> | 
|  228   </template> |  224   </template> | 
|  229   <script src="pin_keyboard.js"></script> |  225   <script src="pin_keyboard.js"></script> | 
|  230 </dom-module> |  226 </dom-module> | 
| OLD | NEW |