OLD | NEW |
1 /* Copyright 2013 The Chromium Authors. All rights reserved. | 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 | 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 .oobe-display { | 7 .oobe-display { |
8 background-color: #eee; | 8 background-color: #eee; |
9 } | 9 } |
10 | 10 |
11 #outer-container { | 11 #outer-container { |
12 min-height: 0; | 12 min-height: 0; |
13 } | 13 } |
14 | 14 |
15 .bubble.faded { | 15 .bubble.faded { |
16 opacity: 0; | 16 opacity: 0; |
17 } | 17 } |
18 | 18 |
19 .pod { | 19 .pod { |
20 border-radius: 2px; | 20 border-radius: 2px; |
21 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); | 21 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); |
22 padding: 0; | 22 padding: 0; |
23 width: 180px; | 23 width: 180px; |
24 } | 24 } |
25 | 25 |
26 .pod.hovered { | 26 .pod.faded { |
27 box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); | 27 opacity: .4; |
| 28 } |
| 29 |
| 30 .pod.hovered:not(.focused) { |
| 31 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); |
| 32 opacity: 0.9 !important; |
| 33 } |
| 34 |
| 35 .pod.focused { |
| 36 box-shadow: 0 12px 21px rgba(0, 0, 0, 0.2); |
28 } | 37 } |
29 | 38 |
30 .pod .main-pane { | 39 .pod .main-pane { |
31 width: 180px; | 40 width: 180px; |
32 } | 41 } |
33 | 42 |
34 .pod .user-image-container { | 43 .pod .user-image-container { |
35 height: 180px; | 44 height: 180px; |
36 width: 180px; | 45 width: 180px; |
37 } | 46 } |
38 | 47 |
39 .pod .user-image { | 48 .pod .user-image { |
40 border-top-left-radius: 2px; | 49 border-top-left-radius: 2px; |
41 border-top-right-radius: 2px; | 50 border-top-right-radius: 2px; |
42 height: 180px; | 51 height: 180px; |
43 opacity: 1; | 52 opacity: 1; |
44 width: 180px; | 53 width: 180px; |
45 } | 54 } |
46 | 55 |
47 .pod .name { | 56 .pod .name { |
48 color: black; | 57 color: #363636; |
49 font-size: 15px; | 58 font-size: 15px; |
50 line-height: 20px; | 59 line-height: 20px; |
51 margin: 5px 0 5px; | 60 margin: 10px 0 10px; |
52 } | 61 } |
53 | 62 |
54 /* For local/unlocked profiles, the name box becomes the focused element. | 63 /* For local/unlocked profiles, the name box becomes the focused element. |
55 However, don't display the blue focus outline around it. */ | 64 However, don't display the blue focus outline around it. */ |
56 .pod .name:focus { | 65 .pod .name:focus { |
57 outline: none; | 66 outline: none; |
58 } | 67 } |
59 | 68 |
60 /* For local/unlocked profiles, always display the name and not the | 69 /* For local/unlocked profiles, always display the name and not the |
61 sign-in button. */ | 70 sign-in button. */ |
62 .pod.need-password.focused .name { | 71 .pod.need-password.focused .name { |
63 display: block; | 72 display: block; |
64 } | 73 } |
65 | 74 |
66 .pod .locked-indicator { | 75 .pod .locked-indicator { |
67 background-image: url('chrome://theme/IDR_ICON_PROFILES_LOCKED'); | 76 background-image: -webkit-image-set( |
| 77 url('chrome://theme/IDR_ICON_PROFILES_LOCKED') 1x, |
| 78 url('chrome://theme/IDR_ICON_PROFILES_LOCKED@2x') 2x); |
68 background-repeat: no-repeat; | 79 background-repeat: no-repeat; |
69 height: 35px; | 80 height: 35px; |
70 left: 10px; | 81 left: 8px; |
71 position: absolute; | 82 position: absolute; |
72 top: 10px; | 83 top: 8px; |
73 width: 35px; | 84 width: 35px; |
74 z-index: 1; | 85 z-index: 1; |
75 } | 86 } |
76 | 87 |
77 html[dir=rtl] .pod .locked-indicator { | 88 html[dir=rtl] .pod .locked-indicator { |
78 right: 10px; | 89 right: 8px; |
79 } | 90 } |
80 | 91 |
81 .pod .supervised-indicator { | 92 .pod .supervised-indicator { |
82 background-image: url('chrome://theme/IDR_ICON_PROFILES_SUPERVISED'); | 93 background-image: -webkit-image-set( |
| 94 url('chrome://theme/IDR_ICON_PROFILES_SUPERVISED') 1x, |
| 95 url('chrome://theme/IDR_ICON_PROFILES_SUPERVISED@2x') 2x); |
83 background-repeat: no-repeat; | 96 background-repeat: no-repeat; |
84 height: 35px; | 97 height: 35px; |
85 left: 10px; | 98 left: 8px; |
86 position: absolute; | 99 position: absolute; |
87 top: 10px; | 100 top: 8px; |
88 width: 35px; | 101 width: 35px; |
89 z-index: 1; | 102 z-index: 1; |
90 } | 103 } |
91 | 104 |
92 html[dir=rtl] .pod .supervised-indicator { | 105 html[dir=rtl] .pod .supervised-indicator { |
93 right: 10px; | 106 right: 8px; |
94 } | 107 } |
| 108 |
| 109 .action-box-area { |
| 110 background-color: #f5f5f5; |
| 111 height: 24px; |
| 112 width: 24px; |
| 113 } |
| 114 |
| 115 .action-box-button, |
| 116 .action-box-button:hover, |
| 117 .action-box-area.active .action-box-button { |
| 118 background-image: none; |
| 119 border-left: 6px solid transparent; |
| 120 border-right: 6px solid transparent; |
| 121 border-top: 6px solid #989898; |
| 122 height: 0; |
| 123 left: 6px; |
| 124 margin: 0; |
| 125 position: absolute; |
| 126 top: 9px; |
| 127 width: 0; |
| 128 } |
| 129 |
| 130 .action-box-button:hover, |
| 131 .action-box-area.active .action-box-button { |
| 132 border-top: 6px solid #4c4c4c; |
| 133 } |
OLD | NEW |