OLD | NEW |
1 /* Copyright 2014 The Chromium Authors. All rights reserved. | 1 /* Copyright 2014 The Chromium Authors. All rights reserved. |
2 * Use of this source code is governed by a BSD-style license that can be | 2 * Use of this source code is governed by a BSD-style license that can be |
3 * found in the LICENSE file. | 3 * found in the LICENSE file. |
4 * | 4 * |
5 * This is the stylesheet used by user pods row of account picker UI. | 5 * This is the stylesheet used by user pods row of account picker UI. |
6 */ | 6 */ |
7 | 7 |
8 podrow { | 8 podrow { |
9 /* Temporarily disabled because animation interferes with updating screen's | 9 /* Temporarily disabled because animation interferes with updating screen's |
10 size. */ | 10 size. */ |
(...skipping 165 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
176 transition: opacity 200ms ease-in-out 180ms; | 176 transition: opacity 200ms ease-in-out 180ms; |
177 visibility: visible; | 177 visibility: visible; |
178 } | 178 } |
179 | 179 |
180 .auth-container.pin-enabled { | 180 .auth-container.pin-enabled { |
181 opacity: 0; | 181 opacity: 0; |
182 transition: none; | 182 transition: none; |
183 visibility: hidden; | 183 visibility: hidden; |
184 } | 184 } |
185 | 185 |
| 186 .auth-container .submit-button[disabled] { |
| 187 color: #000; |
| 188 opacity: 0.26; |
| 189 } |
| 190 |
| 191 .auth-container .submit-button { |
| 192 box-sizing: border-box; |
| 193 color: var(--google-blue-500); |
| 194 height: 43px; |
| 195 min-height: 43px; |
| 196 min-width: 43px; |
| 197 padding: 11.5px 10px; |
| 198 position: relative; |
| 199 width: 43px; |
| 200 } |
| 201 |
| 202 .auth-container .submit-button.error-shown { |
| 203 color: #CD2A00; |
| 204 } |
| 205 |
186 .name-container { | 206 .name-container { |
187 transition: transform 180ms, | 207 transition: transform 180ms, |
188 opacity 180ms ease-in-out 180ms, | 208 opacity 180ms ease-in-out 180ms, |
189 visibility 180ms ease-in-out 180ms; | 209 visibility 180ms ease-in-out 180ms; |
190 opacity : 1; | 210 opacity : 1; |
191 visibility: visible; | 211 visibility: visible; |
192 } | 212 } |
193 | 213 |
194 .name-container.pin-enabled { | 214 .name-container.pin-enabled { |
195 opacity : 0; | 215 opacity : 0; |
(...skipping 25 matching lines...) Expand all Loading... |
221 .reauth-hint-container { | 241 .reauth-hint-container { |
222 display: none; | 242 display: none; |
223 } | 243 } |
224 | 244 |
225 .pod[auth-type='offlinePassword'].focused .password-entry-container, | 245 .pod[auth-type='offlinePassword'].focused .password-entry-container, |
226 .pod[auth-type='forceOfflinePassword'].focused .password-entry-container { | 246 .pod[auth-type='forceOfflinePassword'].focused .password-entry-container { |
227 display: flex; | 247 display: flex; |
228 flex: auto; | 248 flex: auto; |
229 } | 249 } |
230 | 250 |
| 251 .capslock-on .password-container { |
| 252 width: 107px; |
| 253 } |
| 254 |
231 .password-container { | 255 .password-container { |
232 flex: auto; | 256 flex: auto; |
| 257 width: 127px; |
233 } | 258 } |
234 | 259 |
235 .pod input[type='password'] { | 260 .pod input[type='password'] { |
236 background-color: white; | 261 background-color: white; |
237 border: none; | 262 border: none; |
238 padding: 4px 6px; | 263 padding: 4px 6px; |
239 position: relative; | 264 position: relative; |
240 top: 6px; | 265 top: 6px; |
241 width: 100%; | 266 width: 100%; |
242 } | 267 } |
243 | 268 |
244 .capslock-hint-container { | 269 .capslock-hint-container { |
245 display: none; | 270 display: none; |
246 } | 271 } |
247 | 272 |
248 .capslock-on .capslock-hint-container { | 273 .capslock-on .capslock-hint-container { |
249 display: block; | 274 display: block; |
250 flex: none; | 275 flex: none; |
| 276 height: 43px; |
| 277 position: relative; |
| 278 width: 20px; |
251 } | 279 } |
252 | 280 |
253 .capslock-hint { | 281 .capslock-hint { |
254 -webkit-margin-end: 6px; | 282 -webkit-margin-end: 6px; |
255 -webkit-margin-start: -2px; | 283 -webkit-margin-start: -2px; |
| 284 margin: auto; |
256 position: relative; | 285 position: relative; |
257 top: 11px; | 286 top: 15px; |
258 } | 287 } |
259 | 288 |
260 .password-label, | 289 .password-label, |
261 .signin-transition-container { | 290 .signin-transition-container { |
262 display: none; | 291 display: none; |
263 } | 292 } |
264 | 293 |
265 .pod[auth-type='userClick']:not(.signing-in) .password-label, | 294 .pod[auth-type='userClick']:not(.signing-in) .password-label, |
266 .pod[auth-type='userClick'].signing-in .signin-transition-container { | 295 .pod[auth-type='userClick'].signing-in .signin-transition-container { |
267 color: grey; | 296 color: grey; |
(...skipping 618 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
886 -webkit-animation: ellipsis-component2 1.5s infinite; | 915 -webkit-animation: ellipsis-component2 1.5s infinite; |
887 } | 916 } |
888 | 917 |
889 @-webkit-keyframes ellipsis-component2 { | 918 @-webkit-keyframes ellipsis-component2 { |
890 0% { opacity: 0; } | 919 0% { opacity: 0; } |
891 25% { opacity: 0; } | 920 25% { opacity: 0; } |
892 50% { opacity: 0; } | 921 50% { opacity: 0; } |
893 75% { opacity: 1; } | 922 75% { opacity: 1; } |
894 100% { opacity: 0; } | 923 100% { opacity: 0; } |
895 } | 924 } |
OLD | NEW |