| OLD | NEW |
| 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.txt | 4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt |
| 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
| 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt |
| 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.txt | 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt |
| 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="../iron-flex-layout/iron-flex-layout.html"> | 10 <link rel="import" href="../iron-flex-layout/iron-flex-layout.html"> |
| (...skipping 70 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 81 `--paper-input-container-color` | Label and underline color when the input is no
t focused | `--secondary-text-color` | 81 `--paper-input-container-color` | Label and underline color when the input is no
t focused | `--secondary-text-color` |
| 82 `--paper-input-container-focus-color` | Label and underline color when the input
is focused | `--primary-color` | 82 `--paper-input-container-focus-color` | Label and underline color when the input
is focused | `--primary-color` |
| 83 `--paper-input-container-invalid-color` | Label and underline color when the inp
ut is is invalid | `--error-color` | 83 `--paper-input-container-invalid-color` | Label and underline color when the inp
ut is is invalid | `--error-color` |
| 84 `--paper-input-container-input-color` | Input foreground color | `--primary-text
-color` | 84 `--paper-input-container-input-color` | Input foreground color | `--primary-text
-color` |
| 85 `--paper-input-container` | Mixin applied to the container | `{}` | 85 `--paper-input-container` | Mixin applied to the container | `{}` |
| 86 `--paper-input-container-disabled` | Mixin applied to the container when it's di
sabled | `{}` | 86 `--paper-input-container-disabled` | Mixin applied to the container when it's di
sabled | `{}` |
| 87 `--paper-input-container-label` | Mixin applied to the label | `{}` | 87 `--paper-input-container-label` | Mixin applied to the label | `{}` |
| 88 `--paper-input-container-label-focus` | Mixin applied to the label when the inpu
t is focused | `{}` | 88 `--paper-input-container-label-focus` | Mixin applied to the label when the inpu
t is focused | `{}` |
| 89 `--paper-input-container-label-floating` | Mixin applied to the label when float
ing | `{}` | 89 `--paper-input-container-label-floating` | Mixin applied to the label when float
ing | `{}` |
| 90 `--paper-input-container-input` | Mixin applied to the input | `{}` | 90 `--paper-input-container-input` | Mixin applied to the input | `{}` |
| 91 `--paper-input-container-input-webkit-spinner` | Mixin applied to the webkit spi
nner | `{}` |
| 91 `--paper-input-container-underline` | Mixin applied to the underline | `{}` | 92 `--paper-input-container-underline` | Mixin applied to the underline | `{}` |
| 92 `--paper-input-container-underline-focus` | Mixin applied to the underline when
the input is focused | `{}` | 93 `--paper-input-container-underline-focus` | Mixin applied to the underline when
the input is focused | `{}` |
| 93 `--paper-input-container-underline-disabled` | Mixin applied to the underline wh
en the input is disabled | `{}` | 94 `--paper-input-container-underline-disabled` | Mixin applied to the underline wh
en the input is disabled | `{}` |
| 94 `--paper-input-prefix` | Mixin applied to the input prefix | `{}` | 95 `--paper-input-prefix` | Mixin applied to the input prefix | `{}` |
| 95 `--paper-input-suffix` | Mixin applied to the input suffix | `{}` | 96 `--paper-input-suffix` | Mixin applied to the input suffix | `{}` |
| 96 | 97 |
| 97 This element is `display:block` by default, but you can set the `inline` attribu
te to make it | 98 This element is `display:block` by default, but you can set the `inline` attribu
te to make it |
| 98 `display:inline-block`. | 99 `display:inline-block`. |
| 99 --> | 100 --> |
| 100 | 101 |
| (...skipping 20 matching lines...) Expand all Loading... |
| 121 | 122 |
| 122 :host([hidden]) { | 123 :host([hidden]) { |
| 123 display: none !important; | 124 display: none !important; |
| 124 } | 125 } |
| 125 | 126 |
| 126 .floated-label-placeholder { | 127 .floated-label-placeholder { |
| 127 @apply(--paper-font-caption); | 128 @apply(--paper-font-caption); |
| 128 } | 129 } |
| 129 | 130 |
| 130 .underline { | 131 .underline { |
| 132 height: 2px; |
| 131 position: relative; | 133 position: relative; |
| 132 } | 134 } |
| 133 | 135 |
| 134 .focused-line { | 136 .focused-line { |
| 135 @apply(--layout-fit); | 137 @apply(--layout-fit); |
| 136 | 138 |
| 137 background: var(--paper-input-container-focus-color, --primary-color); | 139 border-bottom: 2px solid var(--paper-input-container-focus-color, --prim
ary-color); |
| 138 height: 2px; | |
| 139 | 140 |
| 140 -webkit-transform-origin: center center; | 141 -webkit-transform-origin: center center; |
| 141 transform-origin: center center; | 142 transform-origin: center center; |
| 142 -webkit-transform: scale3d(0,1,1); | 143 -webkit-transform: scale3d(0,1,1); |
| 143 transform: scale3d(0,1,1); | 144 transform: scale3d(0,1,1); |
| 144 | 145 |
| 145 @apply(--paper-input-container-underline-focus); | 146 @apply(--paper-input-container-underline-focus); |
| 146 } | 147 } |
| 147 | 148 |
| 148 .underline.is-highlighted .focused-line { | 149 .underline.is-highlighted .focused-line { |
| 149 -webkit-transform: none; | 150 -webkit-transform: none; |
| 150 transform: none; | 151 transform: none; |
| 151 -webkit-transition: -webkit-transform 0.25s; | 152 -webkit-transition: -webkit-transform 0.25s; |
| 152 transition: transform 0.25s; | 153 transition: transform 0.25s; |
| 153 | 154 |
| 154 @apply(--paper-transition-easing); | 155 @apply(--paper-transition-easing); |
| 155 } | 156 } |
| 156 | 157 |
| 157 .underline.is-invalid .focused-line { | 158 .underline.is-invalid .focused-line { |
| 158 background: var(--paper-input-container-invalid-color, --error-color); | 159 border-color: var(--paper-input-container-invalid-color, --error-color); |
| 159 -webkit-transform: none; | 160 -webkit-transform: none; |
| 160 transform: none; | 161 transform: none; |
| 161 -webkit-transition: -webkit-transform 0.25s; | 162 -webkit-transition: -webkit-transform 0.25s; |
| 162 transition: transform 0.25s; | 163 transition: transform 0.25s; |
| 163 | 164 |
| 164 @apply(--paper-transition-easing); | 165 @apply(--paper-transition-easing); |
| 165 } | 166 } |
| 166 | 167 |
| 167 .unfocused-line { | 168 .unfocused-line { |
| 168 @apply(--layout-fit); | 169 @apply(--layout-fit); |
| 169 | 170 |
| 170 background: var(--paper-input-container-color, --secondary-text-color); | 171 border-bottom: 1px solid var(--paper-input-container-color, --secondary-
text-color); |
| 171 height: 1px; | |
| 172 | 172 |
| 173 @apply(--paper-input-container-underline); | 173 @apply(--paper-input-container-underline); |
| 174 } | 174 } |
| 175 | 175 |
| 176 :host([disabled]) .unfocused-line { | 176 :host([disabled]) .unfocused-line { |
| 177 border-bottom: 1px dashed; | 177 border-bottom: 1px dashed; |
| 178 border-color: var(--paper-input-container-color, --secondary-text-color)
; | 178 border-color: var(--paper-input-container-color, --secondary-text-color)
; |
| 179 background: transparent; | |
| 180 | 179 |
| 181 @apply(--paper-input-container-underline-disabled); | 180 @apply(--paper-input-container-underline-disabled); |
| 182 } | 181 } |
| 183 | 182 |
| 184 .label-and-input-container { | 183 .label-and-input-container { |
| 185 @apply(--layout-flex-auto); | 184 @apply(--layout-flex-auto); |
| 186 @apply(--layout-relative); | 185 @apply(--layout-relative); |
| 187 | 186 |
| 188 width: 100%; | 187 width: 100%; |
| 189 max-width: 100%; | 188 max-width: 100%; |
| (...skipping 79 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 269 border: none; | 268 border: none; |
| 270 color: var(--paper-input-container-input-color, --primary-text-color); | 269 color: var(--paper-input-container-input-color, --primary-text-color); |
| 271 -webkit-appearance: none; | 270 -webkit-appearance: none; |
| 272 text-align: inherit; | 271 text-align: inherit; |
| 273 vertical-align: bottom; | 272 vertical-align: bottom; |
| 274 | 273 |
| 275 @apply(--paper-font-subhead); | 274 @apply(--paper-font-subhead); |
| 276 @apply(--paper-input-container-input); | 275 @apply(--paper-input-container-input); |
| 277 } | 276 } |
| 278 | 277 |
| 278 .input-content ::content input::-webkit-outer-spin-button, |
| 279 .input-content ::content input::-webkit-inner-spin-button { |
| 280 @apply(--paper-input-container-input-webkit-spinner); |
| 281 } |
| 282 |
| 279 ::content [prefix] { | 283 ::content [prefix] { |
| 280 @apply(--paper-font-subhead); | 284 @apply(--paper-font-subhead); |
| 281 | 285 |
| 282 @apply(--paper-input-prefix); | 286 @apply(--paper-input-prefix); |
| 283 @apply(--layout-flex-none); | 287 @apply(--layout-flex-none); |
| 284 } | 288 } |
| 285 | 289 |
| 286 ::content [suffix] { | 290 ::content [suffix] { |
| 287 @apply(--paper-font-subhead); | 291 @apply(--paper-font-subhead); |
| 288 | 292 |
| (...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 331 <div class="focused-line"></div> | 335 <div class="focused-line"></div> |
| 332 </div> | 336 </div> |
| 333 | 337 |
| 334 <div class$="[[_computeAddOnContentClass(focused,invalid)]]"> | 338 <div class$="[[_computeAddOnContentClass(focused,invalid)]]"> |
| 335 <content id="addOnContent" select="[add-on]"></content> | 339 <content id="addOnContent" select="[add-on]"></content> |
| 336 </div> | 340 </div> |
| 337 </template> | 341 </template> |
| 338 </dom-module> | 342 </dom-module> |
| 339 | 343 |
| 340 <script src="paper-input-container-extracted.js"></script></body></html> | 344 <script src="paper-input-container-extracted.js"></script></body></html> |
| OLD | NEW |