OLD | NEW |
---|---|
1 /* Copyright 2013 The Chromium Authors. All rights reserved. | 1 /* Copyright 2016 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 | 5 |
6 /* Overrides for the desktop user manager screen. */ | 6 /* Overrides for the desktop user manager screen. */ |
7 | 7 |
8 .oobe-display { | 8 .oobe-display { |
9 background-color: #eee; | 9 background-color: #eee; |
10 } | 10 } |
11 | 11 |
12 #outer-container { | 12 #outer-container { |
13 min-height: 0; | 13 min-height: 0; |
14 } | 14 } |
15 | 15 |
16 .bubble.faded { | 16 .bubble.faded { |
17 opacity: 0; | 17 opacity: 0; |
18 } | 18 } |
19 | 19 |
20 .pod { | 20 .pod { |
21 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); | 21 box-shadow: 0 1px 2px rgba(0,0,0,0.1); |
tommycli
2016/02/08 18:45:19
Why did the spaces go away?
Moe
2016/02/09 00:15:33
used an external css cleanup tool...
| |
22 height: 226px; | 22 height: 226px; |
23 /* On non-retina desktop, the text is blurry if we use the scale3d() | 23 /* On non-retina desktop, the text is blurry if we use the scale3d() |
24 inherited from user_pod_row.js */ | 24 inherited from user_pod_row.js */ |
25 transform: scale(0.9); | 25 transform: scale(0.9); |
26 } | 26 } |
27 | 27 |
28 podrow[ncolumns='6'] .pod { | 28 podrow[ncolumns='6'] .pod { |
29 transform: scale(0.8); | 29 transform: scale(0.8); |
30 } | 30 } |
31 | 31 |
32 /* Because of crbug.com/406529, the text in the .name div is janky if there's | 32 /* Because of crbug.com/406529, the text in the .name div is janky if there's |
33 both a transform:scale and a transition:opacity applied to a div, so we must | 33 both a transform:scale and a transition:opacity applied to a div, so we must |
34 apply the opacity change to the children instead. */ | 34 apply the opacity change to the children instead. */ |
35 .pod.faded { | 35 .pod.faded { |
36 opacity: 1; | 36 opacity: 1; |
37 } | 37 } |
38 | 38 |
39 .pod.faded .user-image-pane, | 39 .pod.faded .user-image-pane, |
40 .pod.faded .main-pane { | 40 .pod.faded .main-pane { |
41 opacity: .4; | 41 opacity: .4; |
42 } | 42 } |
43 | 43 |
44 .pod.hovered:not(.focused) { | 44 .pod.hovered:not(.focused) { |
45 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); | 45 box-shadow: 0 2px 4px rgba(0,0,0,0.2); |
46 } | 46 } |
47 | 47 |
48 .pod.focused { | 48 .pod.focused { |
49 box-shadow: 0 16px 21px rgba(0, 0, 0, 0.2); | 49 box-shadow: 0 16px 21px rgba(0,0,0,0.2); |
50 transform: scale(1) !important; | 50 transform: scale(1) !important; |
51 } | 51 } |
52 | 52 |
53 .pod.focused.locked { | 53 .pod.focused.locked { |
54 box-shadow: 0 12px 21px rgba(0, 0, 0, 0.2); | 54 box-shadow: 0 12px 21px rgba(0,0,0,0.2); |
55 height: 220px; | 55 height: 220px; |
56 } | 56 } |
57 | 57 |
58 .user-image-pane { | 58 .user-image-pane { |
59 border-top-left-radius: 2px; | 59 border-top-left-radius: 2px; |
60 border-top-right-radius: 2px; | 60 border-top-right-radius: 2px; |
61 height: 180px; | 61 height: 180px; |
62 left: 0; | 62 left: 0; |
63 top: 0; | 63 top: 0; |
64 width: 180px; | 64 width: 180px; |
(...skipping 11 matching lines...) Expand all Loading... | |
76 height: 180px; | 76 height: 180px; |
77 width: 180px; | 77 width: 180px; |
78 } | 78 } |
79 | 79 |
80 .pod input[type='password'] { | 80 .pod input[type='password'] { |
81 height: 45px; /* 1px shorter as to not overlap the pod's rounded corners */ | 81 height: 45px; /* 1px shorter as to not overlap the pod's rounded corners */ |
82 top: 1px; | 82 top: 1px; |
83 } | 83 } |
84 | 84 |
85 .pod .indicator-container { | 85 .pod .indicator-container { |
86 background-color: rgba(255, 255, 255, 0.85); | 86 background-color: rgba(255,255,255,0.85); |
87 border-radius: 16px; | 87 border-radius: 16px; |
88 height: 32px; | 88 height: 32px; |
89 left: 8px; | 89 left: 8px; |
90 position: absolute; | 90 position: absolute; |
91 top: 8px; | 91 top: 8px; |
92 } | 92 } |
93 | 93 |
94 html[dir=rtl] .pod .indicators { | 94 html[dir=rtl] .pod .indicators { |
95 left: auto; | 95 left: auto; |
96 right: 8px; | 96 right: 8px; |
(...skipping 11 matching lines...) Expand all Loading... | |
108 | 108 |
109 /* Using -webkit-mask on the indicators allows us to tweak the color. */ | 109 /* Using -webkit-mask on the indicators allows us to tweak the color. */ |
110 .pod .indicator-container > div { | 110 .pod .indicator-container > div { |
111 -webkit-mask-position: center; | 111 -webkit-mask-position: center; |
112 -webkit-mask-repeat: no-repeat; | 112 -webkit-mask-repeat: no-repeat; |
113 -webkit-mask-size: 24px; | 113 -webkit-mask-size: 24px; |
114 } | 114 } |
115 | 115 |
116 .pod.locked .locked-indicator { | 116 .pod.locked .locked-indicator { |
117 -webkit-mask-image: url(../../../../ui/webui/resources/images/lock.svg); | 117 -webkit-mask-image: url(../../../../ui/webui/resources/images/lock.svg); |
118 background-color: #757575; | 118 background-color: rgb(117,117,117); |
119 display: initial; | 119 display: initial; |
120 } | 120 } |
121 | 121 |
122 .pod.legacy-supervised .legacy-supervised-indicator { | 122 .pod.legacy-supervised .legacy-supervised-indicator { |
123 -webkit-mask-image: | 123 -webkit-mask-image: |
124 url(../../../../ui/webui/resources/images/supervisor_account.svg); | 124 url(../../../../ui/webui/resources/images/supervisor_account.svg); |
125 background-color: rgb(66, 133, 244); | 125 background-color: rgb(66,133,244); |
126 display: initial; | 126 display: initial; |
127 } | 127 } |
128 | 128 |
129 .pod.child .child-indicator { | 129 .pod.child .child-indicator { |
130 -webkit-mask-image: | 130 -webkit-mask-image: |
131 url(../../../../ui/webui/resources/images/account_child_invert.svg); | 131 url(../../../../ui/webui/resources/images/account_child_invert.svg); |
132 background-color: rgb(66, 133, 244); | 132 background-color: rgb(66,133,244); |
133 display: initial; | 133 display: initial; |
134 } | 134 } |
135 | 135 |
136 .main-pane { | 136 .main-pane { |
137 left: 0; | 137 left: 0; |
138 top: 0; | 138 top: 0; |
139 } | 139 } |
140 | 140 |
141 html[dir=rtl] .main-pane { | 141 html[dir=rtl] .main-pane { |
142 right: 0; | 142 right: 0; |
143 } | 143 } |
144 | 144 |
145 .name-container, | 145 .name-container, |
146 .pod.focused:not(.multiprofiles-policy-applied) .auth-container { | 146 .pod.focused:not(.multiprofiles-policy-applied) .auth-container { |
147 top: 180px; | 147 top: 180px; |
148 width: 180px; | 148 width: 180px; |
149 } | 149 } |
150 | 150 |
151 .pod.focused:not(.locked) .name-container { | 151 .pod.focused:not(.locked) .name-container { |
152 display: block; | 152 display: block; |
153 } | 153 } |
154 | 154 |
155 .pod .name { | 155 .pod .name { |
156 color: #363636; | 156 color: rgb(54,54,54); |
157 font-size: 15px; | 157 font-size: 15px; |
158 margin-top: 11px; | 158 margin-top: 11px; |
159 } | 159 } |
160 | 160 |
161 .pod.focused:not(.locked) .auth-container { | 161 .pod.focused:not(.locked) .auth-container { |
162 display: none; | 162 display: none; |
163 } | 163 } |
164 | 164 |
165 .pod[auth-type='offlinePassword'].focused.locked .password-entry-container { | 165 .pod[auth-type='offlinePassword'].focused.locked .password-entry-container { |
166 display: flex; | 166 display: flex; |
167 flex: auto; | 167 flex: auto; |
168 } | 168 } |
169 | 169 |
170 .action-box-area { | 170 .action-box-area { |
171 background-color: #f5f5f5; | 171 background-color: rgb(245,245,245); |
172 height: 24px; | 172 height: 24px; |
173 /* Because of crbug.com/406529, the text in the .name div is janky if there's | 173 /* Because of crbug.com/406529, the text in the .name div is janky if there's |
174 an opacity transition in this div. */ | 174 an opacity transition in this div. */ |
175 transition: none; | 175 transition: none; |
176 width: 24px; | 176 width: 24px; |
177 } | 177 } |
178 | 178 |
179 .action-box-button, | 179 .action-box-button, |
180 .action-box-button:hover, | 180 .action-box-button:hover, |
181 .action-box-area.active .action-box-button { | 181 .action-box-area.active .action-box-button { |
(...skipping 17 matching lines...) Expand all Loading... | |
199 .action-box-remove-user-warning .remove-warning-button { | 199 .action-box-remove-user-warning .remove-warning-button { |
200 height: 30px; | 200 height: 30px; |
201 } | 201 } |
202 | 202 |
203 .action-box-remove-user-warning .remove-warning-button:focus { | 203 .action-box-remove-user-warning .remove-warning-button:focus { |
204 /* Override the default blue border inherited from | 204 /* Override the default blue border inherited from |
205 button.custom-appearance:focus. */ | 205 button.custom-appearance:focus. */ |
206 border: 1px solid transparent !important; | 206 border: 1px solid transparent !important; |
207 box-shadow: inset 0 0 0 1px #fff; | 207 box-shadow: inset 0 0 0 1px #fff; |
208 } | 208 } |
OLD | NEW |