1/* Copyright 2013 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.
4 */
5
6/* Overrides for the desktop user manager screen. */
7
8.oobe-display {
9  background-color: #eee;
10}
11
12#outer-container {
13  min-height: 0;
14}
15
16.bubble.faded {
17  opacity: 0;
18}
19
20.pod {
21  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
22  height: 226px;
23  /* On non-retina desktop, the text is blurry if we use the scale3d()
24  inherited from user_pod_row.js */
25  transform: scale(0.9);
26}
27
28podrow[ncolumns='6'] .pod {
29  transform: scale(0.8);
30}
31
32.pod.faded {
33  opacity: .4;
34}
35
36.pod.hovered:not(.focused) {
37  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
38}
39
40.pod.focused {
41  box-shadow: 0 16px 21px rgba(0, 0, 0, 0.2);
42  transform: scale(1) !important;
43}
44
45.pod.focused.locked {
46  box-shadow: 0 12px 21px rgba(0, 0, 0, 0.2);
47  height: 220px;
48}
49
50.user-image-pane {
51  border-top-left-radius: 2px;
52  border-top-right-radius: 2px;
53  height: 180px;
54  left: 0;
55  top: 0;
56  width: 180px;
57}
58
59html[dir=rtl] .user-image-pane {
60  right: 0;
61}
62
63.pod .name {
64  margin-top: 12px;
65}
66
67.pod .user-image {
68  height: 180px;
69  width: 180px;
70}
71
72.pod input[type='password'] {
73  height: 45px;  /* 1px shorter as to not overlap the pod's rounded corners */
74  top: 1px;
75}
76
77.pod.locked .locked-indicator {
78  background-image: -webkit-image-set(
79      url('chrome://theme/IDR_ICON_PROFILES_LOCKED') 1x,
80      url('chrome://theme/IDR_ICON_PROFILES_LOCKED@2x') 2x);
81  height: 31px;
82  left: 8px;
83  position: absolute;
84  top: 8px;
85  width: 31px;
86}
87
88html[dir=rtl] .pod.locked .locked-indicator {
89  left: auto;
90  right: 8px;
91}
92
93.pod.supervised-user .supervised-indicator {
94  background-image: -webkit-image-set(
95      url('chrome://theme/IDR_ICON_PROFILES_SUPERVISED') 1x,
96      url('chrome://theme/IDR_ICON_PROFILES_SUPERVISED@2x') 2x);
97  height: 31px;
98  left: 8px;
99  position: absolute;
100  top: 8px;
101  width: 31px;
102}
103
104html[dir=rtl] .pod.supervised-user .supervised-indicator {
105  left: auto;
106  right: 8px;
107}
108
109.main-pane {
110  left: 0;
111  top: 0;
112}
113
114html[dir=rtl] .main-pane {
115  right: 0;
116}
117
118.name-container,
119.pod.focused:not(.multiprofiles-policy-applied) .auth-container {
120  top: 180px;
121  width: 180px;
122}
123
124.pod.focused:not(.locked) .name-container {
125  display: block;
126}
127
128.pod .name {
129  color: #363636;
130  font-size: 15px;
131  margin-top: 11px;
132}
133
134.pod.focused:not(.locked) .auth-container {
135  display: none;
136}
137
138.pod.focused.locked .password-entry-container {
139  display: flex;
140  flex: auto;
141}
142
143.action-box-area {
144  background-color: #f5f5f5;
145  height: 24px;
146  /* Because of crbug.com/406529, the text in the .name div is janky if there's
147  an opacity transition in this div. */
148  transition: none;
149  width: 24px;
150}
151
152.action-box-button,
153.action-box-button:hover,
154.action-box-area.active .action-box-button {
155  background-image: none;
156  border-left: 6px solid transparent;
157  border-right: 6px solid transparent;
158  border-top: 6px solid #989898;
159  height: 0;
160  left: 6px;
161  margin: 0;
162  position: absolute;
163  top: 9px;
164  width: 0;
165}
166
167.action-box-button:hover,
168.action-box-area.active .action-box-button {
169  border-top: 6px solid #4c4c4c;
170}
171
172.action-box-remove-user-warning .remove-warning-button {
173  height: 30px;
174}
175
176.action-box-remove-user-warning .remove-warning-button:focus {
177  /* Override the default blue border inherited from
178  button.custom-appearance:focus. */
179  border: 1px solid transparent !important;
180  box-shadow: inset 0 0 0 1px #fff;
181}
182