| 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 the Locally managed user creation flow screen. | 5 * This is the stylesheet used by the Locally managed user creation flow screen. |
| 6 */ | 6 */ |
| 7 | 7 |
| 8 #supervised-user-creation { | 8 #supervised-user-creation { |
| 9 height: 609px; /* Same size as GAIA sign in screen.*/ | 9 height: 609px; /* Same size as GAIA sign in screen.*/ |
| 10 padding: 0 0; /* Some screens have elements right next to borders. */ | 10 padding: 0 0; /* Some screens have elements right next to borders. */ |
| (...skipping 395 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 406 float: left; | 406 float: left; |
| 407 } | 407 } |
| 408 | 408 |
| 409 #supervised-user-creation-image-preview-img { | 409 #supervised-user-creation-image-preview-img { |
| 410 display: block; | 410 display: block; |
| 411 max-height: 220px; | 411 max-height: 220px; |
| 412 max-width: 220px; | 412 max-width: 220px; |
| 413 } | 413 } |
| 414 | 414 |
| 415 #supervised-user-creation-image-preview-img.animated-transform { | 415 #supervised-user-creation-image-preview-img.animated-transform { |
| 416 -webkit-transition: -webkit-transform 200ms linear; | 416 -webkit-transition: transform 200ms linear; |
| 417 } | 417 } |
| 418 | 418 |
| 419 .camera.live #supervised-user-creation-image-preview-img { | 419 .camera.live #supervised-user-creation-image-preview-img { |
| 420 display: none; | 420 display: none; |
| 421 } | 421 } |
| 422 | 422 |
| 423 .camera.flip-x #supervised-user-creation-image-preview-img { | 423 .camera.flip-x #supervised-user-creation-image-preview-img { |
| 424 -webkit-transform: rotateY(180deg); | 424 transform: rotateY(180deg); |
| 425 } | 425 } |
| 426 | 426 |
| 427 .default-image #supervised-user-creation-image-preview-img { | 427 .default-image #supervised-user-creation-image-preview-img { |
| 428 background: white; | 428 background: white; |
| 429 border: solid 1px #cacaca; | 429 border: solid 1px #cacaca; |
| 430 border-radius: 4px; | 430 border-radius: 4px; |
| 431 padding: 2px; | 431 padding: 2px; |
| 432 } | 432 } |
| 433 | 433 |
| 434 .supervised-user-creation-image-stream-area { | 434 .supervised-user-creation-image-stream-area { |
| 435 display: none; | 435 display: none; |
| 436 padding: 0; | 436 padding: 0; |
| 437 position: relative; | 437 position: relative; |
| 438 } | 438 } |
| 439 | 439 |
| 440 .camera.live .supervised-user-creation-image-stream-area { | 440 .camera.live .supervised-user-creation-image-stream-area { |
| 441 display: block; | 441 display: block; |
| 442 } | 442 } |
| 443 | 443 |
| 444 #supervised-user-creation-image-stream-crop { | 444 #supervised-user-creation-image-stream-crop { |
| 445 -webkit-transition: -webkit-transform 200ms linear; | 445 -webkit-transition: transform 200ms linear; |
| 446 height: 220px; | 446 height: 220px; |
| 447 overflow: hidden; | 447 overflow: hidden; |
| 448 position: relative; | 448 position: relative; |
| 449 width: 220px; | 449 width: 220px; |
| 450 } | 450 } |
| 451 | 451 |
| 452 .flip-x #supervised-user-creation-image-stream-crop { | 452 .flip-x #supervised-user-creation-image-stream-crop { |
| 453 -webkit-transform: rotateY(180deg); | 453 transform: rotateY(180deg); |
| 454 } | 454 } |
| 455 | 455 |
| 456 .supervised-user-creation-image-stream { | 456 .supervised-user-creation-image-stream { |
| 457 border: solid 1px #cacaca; | 457 border: solid 1px #cacaca; |
| 458 height: 220px; | 458 height: 220px; |
| 459 /* Center image for 4:3 aspect ratio. */ | 459 /* Center image for 4:3 aspect ratio. */ |
| 460 left: -16.6%; | 460 left: -16.6%; |
| 461 position: absolute; | 461 position: absolute; |
| 462 visibility: hidden; | 462 visibility: hidden; |
| 463 } | 463 } |
| (...skipping 20 matching lines...) Expand all Loading... |
| 484 display: block; | 484 display: block; |
| 485 height: 32px; | 485 height: 32px; |
| 486 opacity: 0; | 486 opacity: 0; |
| 487 position: absolute; | 487 position: absolute; |
| 488 right: 8px; | 488 right: 8px; |
| 489 width: 32px; | 489 width: 32px; |
| 490 } | 490 } |
| 491 | 491 |
| 492 /* TODO(merkulova): remove when webkit crbug.com/126479 is fixed. */ | 492 /* TODO(merkulova): remove when webkit crbug.com/126479 is fixed. */ |
| 493 .flip-trick { | 493 .flip-trick { |
| 494 -webkit-transform: translateZ(1px); | 494 transform: translateZ(1px); |
| 495 } | 495 } |
| 496 | 496 |
| 497 html[dir=rtl] #supervised-user-creation-flip-photo { | 497 html[dir=rtl] #supervised-user-creation-flip-photo { |
| 498 left: 8px; | 498 left: 8px; |
| 499 right: auto; | 499 right: auto; |
| 500 } | 500 } |
| 501 | 501 |
| 502 /* "Flip photo" button is hidden during flip animation. */ | 502 /* "Flip photo" button is hidden during flip animation. */ |
| 503 .camera.online:not(.animation) #supervised-user-creation-flip-photo, | 503 .camera.online:not(.animation) #supervised-user-creation-flip-photo, |
| 504 .camera.phototaken:not(.animation) #supervised-user-creation-flip-photo { | 504 .camera.phototaken:not(.animation) #supervised-user-creation-flip-photo { |
| (...skipping 15 matching lines...) Expand all Loading... |
| 520 display: block; | 520 display: block; |
| 521 } | 521 } |
| 522 | 522 |
| 523 .camera.live.online #supervised-user-creation-take-photo { | 523 .camera.live.online #supervised-user-creation-take-photo { |
| 524 background: url(chrome://theme/IDR_USER_IMAGE_CAPTURE) | 524 background: url(chrome://theme/IDR_USER_IMAGE_CAPTURE) |
| 525 no-repeat center -1px; | 525 no-repeat center -1px; |
| 526 display: block; | 526 display: block; |
| 527 } | 527 } |
| 528 | 528 |
| 529 #supervised-user-creation-image-preview .perspective-box { | 529 #supervised-user-creation-image-preview .perspective-box { |
| 530 -webkit-perspective: 600px; | 530 border: solid 1px #cacaca; |
| 531 border: solid 1px #cacaca; | 531 border-radius: 4px; |
| 532 border-radius: 4px; | 532 padding: 2px; |
| 533 padding: 2px; | 533 perspective: 600px; |
| 534 width: 220px; | 534 width: 220px; |
| 535 } | 535 } |
| 536 | 536 |
| 537 .supervised-user-creation-image-stream-area .spinner { | 537 .supervised-user-creation-image-stream-area .spinner { |
| 538 display: none; | 538 display: none; |
| 539 height: 44px; | 539 height: 44px; |
| 540 left: 50%; | 540 left: 50%; |
| 541 margin-left: -22px; | 541 margin-left: -22px; |
| 542 margin-top: -22px; | 542 margin-top: -22px; |
| 543 position: absolute; | 543 position: absolute; |
| 544 top: 50%; | 544 top: 50%; |
| 545 width: 44px; | 545 width: 44px; |
| 546 } | 546 } |
| 547 | 547 |
| 548 .camera.live:not(.online) .supervised-user-creation-image-stream-area .spinner { | 548 .camera.live:not(.online) .supervised-user-creation-image-stream-area .spinner { |
| 549 display: block; | 549 display: block; |
| 550 } | 550 } |
| 551 | 551 |
| 552 #supervised-user-creation-navigation { | 552 #supervised-user-creation-navigation { |
| 553 color: rgba(0, 0, 0, .54); | 553 color: rgba(0, 0, 0, .54); |
| 554 left: 0; | 554 left: 0; |
| 555 position: absolute; | 555 position: absolute; |
| 556 right: 0; | 556 right: 0; |
| 557 top: 0; | 557 top: 0; |
| 558 z-index: 1; | 558 z-index: 1; |
| 559 } | 559 } |
| OLD | NEW |