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
3 * found in the LICENSE file.
7 -webkit-box-align: center;
8 -webkit-box-pack: center;
9 -webkit-perspective: 1px; /* Workaround, see http://crbug.com/360567 */
10 bottom: 51px; /* Leave space for the header bar */
13 min-height: 717px; /* This enables scrolling. Min resolution: 1024x768 */
19 .oobe-display #outer-container {
20 -webkit-perspective: 600px;
24 bottom: 0; /* Allows content overlap with control bar. */
33 #scroll-container::-webkit-scrollbar {
43 #inner-container.animation {
47 #inner-container.disabled {
52 /* Screens that have a border and background. */
53 #oobe.auto-enrollment-check #inner-container,
54 #oobe.autolaunch #inner-container,
55 #oobe.confirm-password #inner-container,
56 #oobe.connect #inner-container,
57 #oobe.enrollment #inner-container,
58 #oobe.eula #inner-container,
59 #oobe.fatal-error #inner-container,
60 #oobe.gaia-signin #inner-container,
61 #oobe.hid-detection #inner-container,
62 #oobe.kiosk-enable #inner-container,
63 #oobe.oauth-enrollment #inner-container,
64 #oobe.password-changed #inner-container,
65 #oobe.reset #inner-container,
66 #oobe.supervised-user-creation #inner-container,
67 #oobe.supervised-user-creation-dialog #inner-container,
68 #oobe.terms-of-service #inner-container,
69 #oobe.update #inner-container,
70 #oobe.user-image #inner-container,
71 #oobe.wrong-hwid #inner-container {
73 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.3),
74 0 4px 23px 5px rgba(0, 0, 0, 0.2),
75 0 2px 6px rgba(0, 0, 0, 0.15);
78 #oobe.error-message #inner-container,
79 #oobe.tpm-error-message #inner-container {
80 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.3),
81 0 4px 23px 5px rgba(0, 0, 0, 0.2),
82 0 2px 6px rgba(0, 0, 0, 0.15);
86 #oobe.account-picker.flying-pods #inner-container {
87 -webkit-transition: width 180ms ease,
91 /* Only play this animation when 'down' class is removed. */
92 .oobe-display #inner-container:not(.down) {
93 -webkit-transition: -webkit-transform 200ms ease-in-out;
96 .oobe-display #inner-container.down {
97 -webkit-transform: translateY(50px) rotateX(-2.5deg);
101 -webkit-margin-start: 17px;
102 display: -webkit-box;
108 -webkit-box-pack: center;
109 -webkit-transition: opacity 200ms ease-in-out,
110 visibility 200ms ease-in-out;
111 display: -webkit-box;
115 /* Hidden for the duration of initial transition. */
116 .oobe-display #progress-dots.down {
121 -webkit-margin-end: 12px;
133 #app-launch-splash-dot,
134 #auto-enrollment-check-dot,
136 #confirm-password-dot,
137 #controller-pairing-dot,
144 #oauth-enrollment-dot,
145 #password-changed-dot,
147 #supervised-user-creation-dot,
148 #supervised-user-creation-dialog-dot,
149 #terms-of-service-dot,
150 #tpm-error-message-dot,
155 #oobe.connect #connect-dot,
156 #oobe.enrollment #gaia-signin-dot,
157 #oobe.enrollment #signin-dot,
158 #oobe.eula #eula-dot,
159 #oobe.gaia-signin #gaia-signin-dot,
160 #oobe.oauth-enrollment #gaia-signin-dot,
161 #oobe.oauth-enrollment #signin-dot,
162 #oobe.signin #signin-dot,
163 #oobe.update #update-dot,
164 #oobe.user-image #user-image-dot {
168 #oobe.reset #progress-dots,
169 #oobe.host-pairing #progress-dots,
170 #oobe.controller-pairing #progress-dots {
174 body:not(.oobe-display) #inner-container {
180 body:not(.oobe-display) #progress-dots {
184 #outer-container.fullscreen,
185 #outer-container.fullscreen #oobe,
186 #outer-container.fullscreen #oobe #inner-container {
191 html[build=chrome] #header-sections {
192 -webkit-margin-start: -48px;
196 html[build=chromium] #header-sections {
197 -webkit-margin-start: 5px;
202 color: rgb(119, 120, 123); /* Should matching text color of the logo. */
206 text-transform: lowercase;
210 .header-section::before {
211 /* Divider in header between product name and title,
212 * like "[Product name] > [step header]". */
213 content: '\00A0\203A\00A0\00A0';