OLD | NEW |
| (Empty) |
1 /* Copyright (c) 2011 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 * This is the stylesheet used by the WebUI login screen | |
6 */ | |
7 | |
8 html { | |
9 /* It's necessary to put this here instead of in body in order to get the | |
10 background-size of 100% to work properly */ | |
11 height: 100%; | |
12 } | |
13 | |
14 [hidden] { | |
15 display: none !important; | |
16 } | |
17 | |
18 #user-frame { | |
19 height: 100%; | |
20 left: 0; | |
21 overflow: hidden; | |
22 position: fixed; | |
23 /* hide the user frame until we're done loading */ | |
24 visibility: hidden; | |
25 width: 100%; | |
26 } | |
27 | |
28 /* The list holds all the user cards */ | |
29 #user-list { | |
30 display: table; | |
31 height: 100%; | |
32 } | |
33 | |
34 /* The user slider container contains the slider and the top and bottom | |
35 horizontal lines. */ | |
36 #user-slider-container { | |
37 margin-top: -178px; | |
38 position: absolute; | |
39 top: 50%; | |
40 width: 100%; | |
41 } | |
42 | |
43 .user-card { | |
44 display: table-cell; | |
45 height: 100%; | |
46 padding: 29px; | |
47 position: relative; | |
48 vertical-align: middle; | |
49 } | |
50 | |
51 .user.focus { | |
52 background-color: #ececec; | |
53 } | |
54 | |
55 .user-card-grayed { | |
56 opacity: 0.4; | |
57 } | |
58 | |
59 .user { | |
60 text-align: center; | |
61 width: 220px; | |
62 height: 242px; | |
63 padding-top: 20px; | |
64 } | |
65 | |
66 .user-image { | |
67 /* -webkit-mask-image set by JavaScript to the image source */ | |
68 -webkit-mask-size: 100% 100%; | |
69 background-position: center; | |
70 background-repeat: no-repeat; | |
71 height: 170px; | |
72 margin: 4px; | |
73 padding: 0px; | |
74 width: 170px; | |
75 } | |
76 | |
77 .delete-button { | |
78 background-color: white; | |
79 height: 16px; | |
80 opacity: 0.5; | |
81 position: absolute; | |
82 right: 12px; | |
83 top: 8px; | |
84 width: 16px; | |
85 } | |
86 | |
87 #add-user-box { | |
88 margin-top: 48px; | |
89 } | |
90 | |
91 .user-image-border-box { | |
92 -webkit-border-radius: 2px; | |
93 border-color: #cfcfcf; | |
94 border-style: solid; | |
95 border-width: 1px; | |
96 height: 180px; | |
97 margin: auto; | |
98 position: relative; | |
99 width: 180px; | |
100 } | |
101 | |
102 .user span { | |
103 color: black; | |
104 font-size: 18px; | |
105 line-height: 40px; | |
106 overflow: hidden; | |
107 text-align: center; | |
108 text-decoration: none; | |
109 /* TODO(fsamuel, rbyers): why isn't ellipsis working? */ | |
110 text-overflow: ellipsis; | |
111 white-space: nowrap; | |
112 } | |
113 | |
114 .user .user-login-box { | |
115 margin-top: 4px; | |
116 } | |
117 | |
118 .guest-login-box { | |
119 text-align: center; | |
120 width: 100%; | |
121 } | |
122 | |
123 button.loginbutton { | |
124 font-size: 16px; | |
125 height: 32px; | |
126 margin-top: 8px; | |
127 width: 80%; | |
128 } | |
129 | |
130 #add-user { | |
131 height: 207px; | |
132 width: 207px; | |
133 background-image: url('chrome://theme/IDR_LOGIN_ADD_USER'); | |
134 } | |
135 | |
OLD | NEW |