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

Side by Side Diff: third_party/polymer/components-chromium/paper-input/paper-input.css

Issue 592593002: Inline scripts were extracted from Polymer elements. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: s/echo ""/echo/ Created 6 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
OLDNEW
(Empty)
1 :host {
2 display: inline-block;
3 outline: none;
4 text-align: inherit;
5 color: #757575;
6 }
7 :host(:hover) {
8 cursor: text;
9 }
10
11 #container {
12 position: relative;
13 }
14
15 #inputClone,
16 #minInputHeight,
17 #maxInputHeight {
18 position: absolute;
19 top: 0;
20 left: 0;
21 visibility: hidden;
22 padding: 0.5em 0;
23 }
24
25 :host /deep/ input,
26 :host /deep/ textarea {
27 font: inherit;
28 color: #000;
29 padding: 0;
30 /* Important to use margin here so the margin remains visible
31 * when textarea scrolls internally. */
32 margin: 0.5em 0;
33 background-color: transparent;
34 border: none;
35 outline: none;
36 width: 100%;
37 }
38
39 :host /deep/ input:invalid,
40 :host /deep/ textarea:invalid {
41 box-shadow: none;
42 }
43
44 .host /deep/ textarea {
45 resize: none;
46 }
47
48 #floatedLabel {
49 font-size: 0.75em;
50 background: transparent;
51 white-space: nowrap;
52 }
53 #floatedLabel.hidden {
54 visibility: hidden;
55 }
56 #floatedLabel.focused {
57 visibility: visible;
58 }
59
60 #label {
61 position: absolute;
62 top: 0;
63 left: 0;
64 right: 0;
65 bottom: 0;
66 width: 100%;
67 padding: 0.5em 0;
68 background: transparent;
69 -moz-transform-origin: 0% 0%;
70 -webkit-transform-origin: 0% 0%;
71 transform-origin: 0% 0%;
72 pointer-events: none;
73 }
74 #label.hidden {
75 display: none;
76 }
77 #label.animating {
78 /* TODO: transforms are unprefixed in M36/ Remove when stable. */
79 -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.2, 0, 0.03, 1);
80 transition: transform 0.3s cubic-bezier(0.2, 0, 0.03, 1);
81 }
82
83 #labelSpan {
84 overflow: hidden;
85 text-overflow: ellipsis;
86 white-space: nowrap;
87 display: inline-block;
88 max-width: 100%;
89 }
90
91 #errorContainer {
92 visibility: hidden;
93 display: -webkit-flex;
94 display: flex;
95 -webkit-align-items: center;
96 align-items: center;
97 }
98
99 :host(.invalid) #errorContainer {
100 visibility: visible;
101 }
102
103 #error {
104 -webkit-flex: 1;
105 flex: 1;
106 font-size: 0.75em;
107 padding: 0.5em 0;
108 }
109
110 #errorIcon {
111 background-image: url(error-100.png);
112 background-size: 24px 24px;
113 height: 24px;
114 width: 24px;
115 }
116
117
118 @media (min-resolution: 2dppx) {
119 #errorIcon {
120 background-image: url(error-200.png);
121 background-size: 24px 24px;
122 }
123 }
124
125 #underlineContainer {
126 position: absolute;
127 left: 0;
128 right: 0;
129 bottom: -1px;
130 }
131
132 :host([multiline]) #underlineContainer {
133 bottom: auto;
134 }
135
136 :host([multiline]) #underlineContainer.animating {
137 -webkit-transition: top 0.2s ease-in;
138 transition: top 0.2s ease-in;
139 }
140
141 #underline {
142 height: 1px;
143 background: #757575;
144 border-bottom-color: #757575;
145 }
146
147 :host([disabled]) #underline {
148 border-bottom: 1px dashed;
149 height: 0px;
150 background: transparent;
151 }
152
153 #underlineHighlight {
154 position: absolute;
155 left: 0;
156 right: 0;
157 bottom: 0;
158 height: 2px;
159 -webkit-transform: scale(0,2);
160 transform: scale(0,2);
161 }
162 #underlineHighlight.pressed {
163 -webkit-transform: scale(0.1,2);
164 transform: scale(0.1,2);
165 /* TODO: transforms are unprefixed in M36/ Remove when stable. */
166 -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.2, 0, 0.03, 1);
167 transition: transform 0.3s cubic-bezier(0.2, 0, 0.03, 1);
168 }
169 #underlineHighlight.animating {
170 /* TODO: transforms are unprefixed in M36/ Remove when stable. */
171 -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.2, 0, 0.03, 1);
172 transition: transform 0.3s cubic-bezier(0.2, 0, 0.03, 1);
173 }
174 #underlineHighlight.focused {
175 -webkit-transform: scale(1);
176 transform: scale(1);
177 }
178
179 #caret {
180 display: none;
181 position: absolute;
182 top: 0;
183 left: 0;
184 right: 0;
185 bottom: 0;
186 opacity: 0;
187 -moz-transform-origin: 0%;
188 -webkit-transform-origin-x: 0%;
189 transform-origin-x: 0%;
190 -webkit-transform: scaleX(1) translateX(10%);
191 transform: scaleX(1) translateX(10%);
192 }
193 #caret.animating {
194 display: block;
195 /* TODO: transforms are unprefixed in M36/ Remove when stable. */
196 -webkit-transition: -webkit-transform 0.2s ease-out, opacity 0.2s ease-out;
197 transition: transform 0.3s cubic-bezier(0.2, 0, 0.03, 1);
198 }
199 #caret.focused {
200 display: block;
201 opacity: 0.75;
202 -webkit-transform: scaleX(0) translateX(0);
203 transform: scaleX(0) translateX(0);
204 }
205 #caretInner {
206 position: absolute;
207 top: 0.6em;
208 left: 0;
209 height: 1.2em;
210 width: 25%;
211 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698