4eab7604d09ea2ee9d5955436b6de9891ee8eae8
[emels.git] / emels / static / admin / css / changelists.css
1 /* CHANGELISTS */
2
3 #changelist {
4     position: relative;
5     width: 100%;
6 }
7
8 #changelist table {
9     width: 100%;
10 }
11
12 .change-list .hiddenfields { display:none; }
13
14 .change-list .filtered table {
15     border-right: none;
16 }
17
18 .change-list .filtered {
19     min-height: 400px;
20 }
21
22 .change-list .filtered .results, .change-list .filtered .paginator,
23 .filtered #toolbar, .filtered div.xfull {
24     margin-right: 280px;
25     width: auto;
26 }
27
28 .change-list .filtered table tbody th {
29     padding-right: 1em;
30 }
31
32 #changelist-form .results {
33   overflow-x: auto;
34 }
35
36 #changelist .toplinks {
37     border-bottom: 1px solid #ddd;
38 }
39
40 #changelist .paginator {
41     color: #666;
42     border-bottom: 1px solid #eee;
43     background: #fff;
44     overflow: hidden;
45 }
46
47 /* CHANGELIST TABLES */
48
49 #changelist table thead th {
50     padding: 0;
51     white-space: nowrap;
52     vertical-align: middle;
53 }
54
55 #changelist table thead th.action-checkbox-column {
56     width: 1.5em;
57     text-align: center;
58 }
59
60 #changelist table tbody td.action-checkbox {
61     text-align: center;
62 }
63
64 #changelist table tfoot {
65     color: #666;
66 }
67
68 /* TOOLBAR */
69
70 #changelist #toolbar {
71     padding: 8px 10px;
72     margin-bottom: 15px;
73     border-top: 1px solid #eee;
74     border-bottom: 1px solid #eee;
75     background: #f8f8f8;
76     color: #666;
77 }
78
79 #changelist #toolbar form input {
80     border-radius: 4px;
81     font-size: 14px;
82     padding: 5px;
83     color: #333;
84 }
85
86 #changelist #toolbar form #searchbar {
87     height: 19px;
88     border: 1px solid #ccc;
89     padding: 2px 5px;
90     margin: 0;
91     vertical-align: top;
92     font-size: 13px;
93 }
94
95 #changelist #toolbar form #searchbar:focus {
96     border-color: #999;
97 }
98
99 #changelist #toolbar form input[type="submit"] {
100     border: 1px solid #ccc;
101     padding: 2px 10px;
102     margin: 0;
103     vertical-align: middle;
104     background: #fff;
105     box-shadow: 0 -15px 20px -10px rgba(0, 0, 0, 0.15) inset;
106     cursor: pointer;
107     color: #333;
108 }
109
110 #changelist #toolbar form input[type="submit"]:focus,
111 #changelist #toolbar form input[type="submit"]:hover {
112     border-color: #999;
113 }
114
115 #changelist #changelist-search img {
116     vertical-align: middle;
117     margin-right: 4px;
118 }
119
120 /* FILTER COLUMN */
121
122 #changelist-filter {
123     position: absolute;
124     top: 0;
125     right: 0;
126     z-index: 1000;
127     width: 240px;
128     background: #f8f8f8;
129     border-left: none;
130     margin: 0;
131 }
132
133 #changelist-filter h2 {
134     font-size: 14px;
135     text-transform: uppercase;
136     letter-spacing: 0.5px;
137     padding: 5px 15px;
138     margin-bottom: 12px;
139     border-bottom: none;
140 }
141
142 #changelist-filter h3 {
143     font-weight: 400;
144     font-size: 14px;
145     padding: 0 15px;
146     margin-bottom: 10px;
147 }
148
149 #changelist-filter ul {
150     margin: 5px 0;
151     padding: 0 15px 15px;
152     border-bottom: 1px solid #eaeaea;
153 }
154
155 #changelist-filter ul:last-child {
156     border-bottom: none;
157     padding-bottom: none;
158 }
159
160 #changelist-filter li {
161     list-style-type: none;
162     margin-left: 0;
163     padding-left: 0;
164 }
165
166 #changelist-filter a {
167     display: block;
168     color: #999;
169 }
170
171 #changelist-filter li.selected {
172     border-left: 5px solid #eaeaea;
173     padding-left: 10px;
174     margin-left: -15px;
175 }
176
177 #changelist-filter li.selected a {
178     color: #5b80b2;
179 }
180
181 #changelist-filter a:focus, #changelist-filter a:hover,
182 #changelist-filter li.selected a:focus,
183 #changelist-filter li.selected a:hover {
184     color: #036;
185 }
186
187 /* DATE DRILLDOWN */
188
189 .change-list ul.toplinks {
190     display: block;
191     float: left;
192     padding: 0;
193     margin: 0;
194     width: 100%;
195 }
196
197 .change-list ul.toplinks li {
198     padding: 3px 6px;
199     font-weight: bold;
200     list-style-type: none;
201     display: inline-block;
202 }
203
204 .change-list ul.toplinks .date-back a {
205     color: #999;
206 }
207
208 .change-list ul.toplinks .date-back a:focus,
209 .change-list ul.toplinks .date-back a:hover {
210     color: #036;
211 }
212
213 /* PAGINATOR */
214
215 .paginator {
216     font-size: 13px;
217     padding-top: 10px;
218     padding-bottom: 10px;
219     line-height: 22px;
220     margin: 0;
221     border-top: 1px solid #ddd;
222 }
223
224 .paginator a:link, .paginator a:visited {
225     padding: 2px 6px;
226     background: #79aec8;
227     text-decoration: none;
228     color: #fff;
229 }
230
231 .paginator a.showall {
232     padding: 0;
233     border: none;
234     background: none;
235     color: #5b80b2;
236 }
237
238 .paginator a.showall:focus, .paginator a.showall:hover {
239     background: none;
240     color: #036;
241 }
242
243 .paginator .end {
244     margin-right: 6px;
245 }
246
247 .paginator .this-page {
248     padding: 2px 6px;
249     font-weight: bold;
250     font-size: 13px;
251     vertical-align: top;
252 }
253
254 .paginator a:focus, .paginator a:hover {
255     color: white;
256     background: #036;
257 }
258
259 /* ACTIONS */
260
261 .filtered .actions {
262     margin-right: 280px;
263     border-right: none;
264 }
265
266 #changelist table input {
267     margin: 0;
268     vertical-align: baseline;
269 }
270
271 #changelist table tbody tr.selected {
272     background-color: #FFFFCC;
273 }
274
275 #changelist .actions {
276     padding: 10px;
277     background: #fff;
278     border-top: none;
279     border-bottom: none;
280     line-height: 24px;
281     color: #999;
282 }
283
284 #changelist .actions.selected {
285     background: #fffccf;
286     border-top: 1px solid #fffee8;
287     border-bottom: 1px solid #edecd6;
288 }
289
290 #changelist .actions span.all,
291 #changelist .actions span.action-counter,
292 #changelist .actions span.clear,
293 #changelist .actions span.question {
294     font-size: 13px;
295     margin: 0 0.5em;
296     display: none;
297 }
298
299 #changelist .actions:last-child {
300     border-bottom: none;
301 }
302
303 #changelist .actions select {
304     vertical-align: top;
305     height: 24px;
306     background: none;
307     color: #000;
308     border: 1px solid #ccc;
309     border-radius: 4px;
310     font-size: 14px;
311     padding: 0 0 0 4px;
312     margin: 0;
313     margin-left: 10px;
314 }
315
316 #changelist .actions select:focus {
317     border-color: #999;
318 }
319
320 #changelist .actions label {
321     display: inline-block;
322     vertical-align: middle;
323     font-size: 13px;
324 }
325
326 #changelist .actions .button {
327     font-size: 13px;
328     border: 1px solid #ccc;
329     border-radius: 4px;
330     background: #fff;
331     box-shadow: 0 -15px 20px -10px rgba(0, 0, 0, 0.15) inset;
332     cursor: pointer;
333     height: 24px;
334     line-height: 1;
335     padding: 4px 8px;
336     margin: 0;
337     color: #333;
338 }
339
340 #changelist .actions .button:focus, #changelist .actions .button:hover {
341     border-color: #999;
342 }