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

Side by Side Diff: third_party/polymer/v1_0/components/paper-input/paper-input-container.html

Issue 1221923003: Update bower.json for Polymer elements and add PRESUBMIT.py (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: rebase Created 5 years, 5 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
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.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 --> 9 -->
10 10
(...skipping 47 matching lines...) Expand 10 before | Expand all | Expand 10 after
58 The following custom properties and mixins are available for styling: 58 The following custom properties and mixins are available for styling:
59 59
60 Custom property | Description | Default 60 Custom property | Description | Default
61 ----------------|-------------|---------- 61 ----------------|-------------|----------
62 `--paper-input-container-color` | Label and underline color when the input is no t focused | `--secondary-text-color` 62 `--paper-input-container-color` | Label and underline color when the input is no t focused | `--secondary-text-color`
63 `--paper-input-container-focus-color` | Label and underline color when the input is focused | `--default-primary-color` 63 `--paper-input-container-focus-color` | Label and underline color when the input is focused | `--default-primary-color`
64 `--paper-input-container-invalid-color` | Label and underline color when the inp ut is focused | `--google-red-500` 64 `--paper-input-container-invalid-color` | Label and underline color when the inp ut is focused | `--google-red-500`
65 `--paper-input-container-input-color` | Input foreground color | `--primary-text -color` 65 `--paper-input-container-input-color` | Input foreground color | `--primary-text -color`
66 `--paper-input-container` | Mixin applied to the container | `{}` 66 `--paper-input-container` | Mixin applied to the container | `{}`
67 `--paper-input-container-label` | Mixin applied to the label | `{}` 67 `--paper-input-container-label` | Mixin applied to the label | `{}`
68 `--paper-input-container-label-focus` | Mixin applied to the label when the inpu t is focused | `{}`
68 `--paper-input-container-input` | Mixin applied to the input | `{}` 69 `--paper-input-container-input` | Mixin applied to the input | `{}`
70 `--paper-input-container-underline` | Mixin applied to the underline | `{}`
71 `--paper-input-container-underline-focus` | Mixin applied to the underline when the input is focued | `{}`
72 `--paper-input-container-underline-disabled` | Mixin applied to the underline wh en the input is disabled | `{}`
69 73
70 This element is `display:block` by default, but you can set the `inline` attribu te to make it 74 This element is `display:block` by default, but you can set the `inline` attribu te to make it
71 `display:inline-block`. 75 `display:inline-block`.
72 --> 76 -->
73 <dom-module id="paper-input-container"> 77 <dom-module id="paper-input-container">
74 78
75 <style> 79 <style>
76 80
77 :host { 81 :host {
78 display: block; 82 display: block;
(...skipping 21 matching lines...) Expand all
100 104
101 .focused-line { 105 .focused-line {
102 height: 2px; 106 height: 2px;
103 107
104 -webkit-transform-origin: center center; 108 -webkit-transform-origin: center center;
105 transform-origin: center center; 109 transform-origin: center center;
106 -webkit-transform: scale3d(0,1,1); 110 -webkit-transform: scale3d(0,1,1);
107 transform: scale3d(0,1,1); 111 transform: scale3d(0,1,1);
108 112
109 background: var(--paper-input-container-focus-color, --default-primary-col or); 113 background: var(--paper-input-container-focus-color, --default-primary-col or);
114
115 @apply(--paper-input-container-underline-focus);
110 } 116 }
111 117
112 .underline.is-highlighted .focused-line { 118 .underline.is-highlighted .focused-line {
113 -webkit-transform: none; 119 -webkit-transform: none;
114 transform: none; 120 transform: none;
115 -webkit-transition: -webkit-transform 0.25s; 121 -webkit-transition: -webkit-transform 0.25s;
116 transition: transform 0.25s; 122 transition: transform 0.25s;
117 123
118 @apply(--paper-transition-easing); 124 @apply(--paper-transition-easing);
119 } 125 }
120 126
121 .underline.is-invalid .focused-line { 127 .underline.is-invalid .focused-line {
122 background: var(--paper-input-container-invalid-color, --google-red-500); 128 background: var(--paper-input-container-invalid-color, --google-red-500);
123 129
124 -webkit-transform: none; 130 -webkit-transform: none;
125 transform: none; 131 transform: none;
126 -webkit-transition: -webkit-transform 0.25s; 132 -webkit-transition: -webkit-transform 0.25s;
127 transition: transform 0.25s; 133 transition: transform 0.25s;
128 134
129 @apply(--paper-transition-easing); 135 @apply(--paper-transition-easing);
130 } 136 }
131 137
132 .unfocused-line { 138 .unfocused-line {
133 height: 1px; 139 height: 1px;
134 background: var(--paper-input-container-color, --secondary-text-color); 140 background: var(--paper-input-container-color, --secondary-text-color);
141
142 @apply(--paper-input-container-underline);
135 } 143 }
136 144
137 :host([disabled]) .unfocused-line { 145 :host([disabled]) .unfocused-line {
138 border-bottom: 1px dashed; 146 border-bottom: 1px dashed;
139 border-color: var(--paper-input-container-color, --secondary-text-color); 147 border-color: var(--paper-input-container-color, --secondary-text-color);
140 background: transparent; 148 background: transparent;
149
150 @apply(--paper-input-container-underline-disabled);
141 } 151 }
142 152
143 .input-content { 153 .input-content {
144 position: relative; 154 position: relative;
145 } 155 }
146 156
147 .input-content ::content label, 157 .input-content ::content label,
148 .input-content ::content .paper-input-label { 158 .input-content ::content .paper-input-label {
149 position: absolute; 159 position: absolute;
150 top: 0; 160 top: 0;
(...skipping 14 matching lines...) Expand all
165 transform-origin: left top; 175 transform-origin: left top;
166 -webkit-transition: -webkit-transform 0.25s; 176 -webkit-transition: -webkit-transform 0.25s;
167 transition: transform 0.25s; 177 transition: transform 0.25s;
168 178
169 @apply(--paper-transition-easing); 179 @apply(--paper-transition-easing);
170 } 180 }
171 181
172 .input-content.label-is-highlighted ::content label, 182 .input-content.label-is-highlighted ::content label,
173 .input-content.label-is-highlighted ::content .paper-input-label { 183 .input-content.label-is-highlighted ::content .paper-input-label {
174 color: var(--paper-input-container-focus-color, --default-primary-color); 184 color: var(--paper-input-container-focus-color, --default-primary-color);
185
186 @apply(--paper-input-container-label-focus);
175 } 187 }
176 188
177 .input-content.is-invalid ::content label, 189 .input-content.is-invalid ::content label,
178 .input-content.is-invalid ::content .paper-input-label { 190 .input-content.is-invalid ::content .paper-input-label {
179 color: var(--paper-input-container-invalid-color, --google-red-500); 191 color: var(--paper-input-container-invalid-color, --google-red-500);
180 } 192 }
181 193
182 .input-content.label-is-hidden ::content label, 194 .input-content.label-is-hidden ::content label,
183 .input-content.label-is-hidden ::content .paper-input-label { 195 .input-content.label-is-hidden ::content .paper-input-label {
184 visibility: hidden; 196 visibility: hidden;
(...skipping 312 matching lines...) Expand 10 before | Expand all | Expand 10 after
497 } else if (focused) { 509 } else if (focused) {
498 cls += ' is-highlighted' 510 cls += ' is-highlighted'
499 } 511 }
500 return cls; 512 return cls;
501 } 513 }
502 514
503 }); 515 });
504 516
505 })(); 517 })();
506 </script> 518 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698