Première version en Python.
[auf_paf.git] / paf0 / paf0 / media / css / widgets.css
CommitLineData
0ba28d89 1/* SELECTOR (FILTER INTERFACE) */
2
3.selector {
4 width: 580px;
5 float: left;
6}
7
8.selector select {
9 width: 270px;
10 height: 17.2em;
11}
12
13.selector-available, .selector-chosen {
14 float: left;
15 width: 270px;
16 text-align: center;
17 margin-bottom: 5px;
18}
19
20.selector-chosen select {
21 border-top: none;
22}
23
24.selector-available h2, .selector-chosen h2 {
25 border: 1px solid #ccc;
26}
27
28.selector .selector-available h2 {
29 background: white url(../img/nav-bg.gif) bottom left repeat-x;
30 color: #666;
31}
32
33.selector .selector-filter {
34 background: white;
35 border: 1px solid #ccc;
36 border-width: 0 1px;
37 padding: 3px;
38 color: #999;
39 font-size: 10px;
40 margin: 0;
41 text-align: left;
42}
43
44.selector .selector-filter label {
45 width: 16px;
46 padding: 2px;
47}
48
49.selector .selector-available input {
50 width: 230px;
51}
52
53.selector ul.selector-chooser {
54 float: left;
55 width: 22px;
56 height: 50px;
57 background: url(../img/chooser-bg.gif) top center no-repeat;
58 margin: 10em 5px 0 5px;
59 padding: 0;
60}
61
62.selector-chooser li {
63 margin: 0;
64 padding: 3px;
65 list-style-type: none;
66}
67
68.selector select {
69 margin-bottom: 10px;
70 margin-top: 0;
71}
72
73.selector-add, .selector-remove {
74 width: 16px;
75 height: 16px;
76 display: block;
77 text-indent: -3000px;
78 overflow: hidden;
79}
80
81.selector-add {
82 background: url(../img/selector-icons.gif) 0 -161px no-repeat;
83 cursor: default;
84 margin-bottom: 2px;
85}
86
87.active.selector-add {
88 background: url(../img/selector-icons.gif) 0 -187px no-repeat;
89 cursor: pointer;
90}
91
92.selector-remove {
93 background: url(../img/selector-icons.gif) 0 -109px no-repeat;
94 cursor: default;
95}
96
97.active.selector-remove {
98 background: url(../img/selector-icons.gif) 0 -135px no-repeat;
99 cursor: pointer;
100}
101
102a.selector-chooseall, a.selector-clearall {
103 display: inline-block;
104 text-align: left;
105 margin-left: auto;
106 margin-right: auto;
107 font-weight: bold;
108 color: #666;
109}
110
111a.selector-chooseall {
112 padding: 3px 18px 3px 0;
113}
114
115a.selector-clearall {
116 padding: 3px 0 3px 18px;
117}
118
119a.active.selector-chooseall:hover, a.active.selector-clearall:hover {
120 color: #036;
121}
122
123a.selector-chooseall {
124 background: url(../img/selector-icons.gif) right -263px no-repeat;
125 cursor: default;
126}
127
128a.active.selector-chooseall {
129 background: url(../img/selector-icons.gif) right -289px no-repeat;
130 cursor: pointer;
131}
132
133a.selector-clearall {
134 background: url(../img/selector-icons.gif) left -211px no-repeat;
135 cursor: default;
136}
137
138a.active.selector-clearall {
139 background: url(../img/selector-icons.gif) left -237px no-repeat;
140 cursor: pointer;
141}
142
143/* STACKED SELECTORS */
144
145.stacked {
146 float: left;
147 width: 500px;
148}
149
150.stacked select {
151 width: 480px;
152 height: 10.1em;
153}
154
155.stacked .selector-available, .stacked .selector-chosen {
156 width: 480px;
157}
158
159.stacked .selector-available {
160 margin-bottom: 0;
161}
162
163.stacked .selector-available input {
164 width: 442px;
165}
166
167.stacked ul.selector-chooser {
168 height: 22px;
169 width: 50px;
170 margin: 0 0 3px 40%;
171 background: url(../img/chooser_stacked-bg.gif) top center no-repeat;
172}
173
174.stacked .selector-chooser li {
175 float: left;
176 padding: 3px 3px 3px 5px;
177}
178
179.stacked .selector-chooseall, .stacked .selector-clearall {
180 display: none;
181}
182
183.stacked .selector-add {
184 background: url(../img/selector-icons.gif) 0 -57px no-repeat;
185 cursor: default;
186}
187
188.stacked .active.selector-add {
189 background: url(../img/selector-icons.gif) 0 -83px no-repeat;
190 cursor: pointer;
191}
192
193.stacked .selector-remove {
194 background: url(../img/selector-icons.gif) 0 -5px no-repeat;
195 cursor: default;
196}
197
198.stacked .active.selector-remove {
199 background: url(../img/selector-icons.gif) 0 -31px no-repeat;
200 cursor: pointer;
201}
202
203/* DATE AND TIME */
204
205p.datetime {
206 line-height: 20px;
207 margin: 0;
208 padding: 0;
209 color: #666;
210 font-size: 11px;
211 font-weight: bold;
212}
213
214.datetime span {
215 font-size: 11px;
216 color: #ccc;
217 font-weight: normal;
218 white-space: nowrap;
219}
220
221table p.datetime {
222 font-size: 10px;
223 margin-left: 0;
224 padding-left: 0;
225}
226
227/* FILE UPLOADS */
228
229p.file-upload {
230 line-height: 20px;
231 margin: 0;
232 padding: 0;
233 color: #666;
234 font-size: 11px;
235 font-weight: bold;
236}
237
238.file-upload a {
239 font-weight: normal;
240}
241
242.file-upload .deletelink {
243 margin-left: 5px;
244}
245
246span.clearable-file-input label {
247 color: #333;
248 font-size: 11px;
249 display: inline;
250 float: none;
251}
252
253/* CALENDARS & CLOCKS */
254
255.calendarbox, .clockbox {
256 margin: 5px auto;
257 font-size: 11px;
258 width: 16em;
259 text-align: center;
260 background: white;
261 position: relative;
262}
263
264.clockbox {
265 width: auto;
266}
267
268.calendar {
269 margin: 0;
270 padding: 0;
271}
272
273.calendar table {
274 margin: 0;
275 padding: 0;
276 border-collapse: collapse;
277 background: white;
278 width: 100%;
279}
280
281.calendar caption, .calendarbox h2 {
282 margin: 0;
283 font-size: 11px;
284 text-align: center;
285 border-top: none;
286}
287
288.calendar th {
289 font-size: 10px;
290 color: #666;
291 padding: 2px 3px;
292 text-align: center;
293 background: #e1e1e1 url(../img/nav-bg.gif) 0 50% repeat-x;
294 border-bottom: 1px solid #ddd;
295}
296
297.calendar td {
298 font-size: 11px;
299 text-align: center;
300 padding: 0;
301 border-top: 1px solid #eee;
302 border-bottom: none;
303}
304
305.calendar td.selected a {
306 background: #C9DBED;
307}
308
309.calendar td.nonday {
310 background: #efefef;
311}
312
313.calendar td.today a {
314 background: #ffc;
315}
316
317.calendar td a, .timelist a {
318 display: block;
319 font-weight: bold;
320 padding: 4px;
321 text-decoration: none;
322 color: #444;
323}
324
325.calendar td a:hover, .timelist a:hover {
326 background: #5b80b2;
327 color: white;
328}
329
330.calendar td a:active, .timelist a:active {
331 background: #036;
332 color: white;
333}
334
335.calendarnav {
336 font-size: 10px;
337 text-align: center;
338 color: #ccc;
339 margin: 0;
340 padding: 1px 3px;
341}
342
343.calendarnav a:link, #calendarnav a:visited, #calendarnav a:hover {
344 color: #999;
345}
346
347.calendar-shortcuts {
348 background: white;
349 font-size: 10px;
350 line-height: 11px;
351 border-top: 1px solid #eee;
352 padding: 3px 0 4px;
353 color: #ccc;
354}
355
356.calendarbox .calendarnav-previous, .calendarbox .calendarnav-next {
357 display: block;
358 position: absolute;
359 font-weight: bold;
360 font-size: 12px;
361 background: #C9DBED url(../img/default-bg.gif) bottom left repeat-x;
362 padding: 1px 4px 2px 4px;
363 color: white;
364}
365
366.calendarnav-previous:hover, .calendarnav-next:hover {
367 background: #036;
368}
369
370.calendarnav-previous {
371 top: 0;
372 left: 0;
373}
374
375.calendarnav-next {
376 top: 0;
377 right: 0;
378}
379
380.calendar-cancel {
381 margin: 0 !important;
382 padding: 0 !important;
383 font-size: 10px;
384 background: #e1e1e1 url(../img/nav-bg.gif) 0 50% repeat-x;
385 border-top: 1px solid #ddd;
386}
387
388.calendar-cancel:hover {
389 background: #e1e1e1 url(../img/nav-bg-reverse.gif) 0 50% repeat-x;
390}
391
392.calendar-cancel a {
393 color: black;
394 display: block;
395}
396
397ul.timelist, .timelist li {
398 list-style-type: none;
399 margin: 0;
400 padding: 0;
401}
402
403.timelist a {
404 padding: 2px;
405}
406
407/* INLINE ORDERER */
408
409ul.orderer {
410 position: relative;
411 padding: 0 !important;
412 margin: 0 !important;
413 list-style-type: none;
414}
415
416ul.orderer li {
417 list-style-type: none;
418 display: block;
419 padding: 0;
420 margin: 0;
421 border: 1px solid #bbb;
422 border-width: 0 1px 1px 0;
423 white-space: nowrap;
424 overflow: hidden;
425 background: #e2e2e2 url(../img/nav-bg-grabber.gif) repeat-y;
426}
427
428ul.orderer li:hover {
429 cursor: move;
430 background-color: #ddd;
431}
432
433ul.orderer li a.selector {
434 margin-left: 12px;
435 overflow: hidden;
436 width: 83%;
437 font-size: 10px !important;
438 padding: 0.6em 0;
439}
440
441ul.orderer li a:link, ul.orderer li a:visited {
442 color: #333;
443}
444
445ul.orderer li .inline-deletelink {
446 position: absolute;
447 right: 4px;
448 margin-top: 0.6em;
449}
450
451ul.orderer li.selected {
452 background-color: #f8f8f8;
453 border-right-color: #f8f8f8;
454}
455
456ul.orderer li.deleted {
457 background: #bbb url(../img/deleted-overlay.gif);
458}
459
460ul.orderer li.deleted a:link, ul.orderer li.deleted a:visited {
461 color: #888;
462}
463
464ul.orderer li.deleted .inline-deletelink {
465 background-image: url(../img/inline-restore.png);
466}
467
468ul.orderer li.deleted:hover, ul.orderer li.deleted a.selector:hover {
469 cursor: default;
470}
471
472/* EDIT INLINE */
473
474.inline-deletelink {
475 float: right;
476 text-indent: -9999px;
477 background: transparent url(../img/inline-delete.png) no-repeat;
478 width: 15px;
479 height: 15px;
480 border: 0px none;
481 outline: 0; /* Remove dotted border around link */
482}
483
484.inline-deletelink:hover {
485 background-position: -15px 0;
486 cursor: pointer;
487}
488
489.editinline button.addlink {
490 border: 0px none;
491 color: #5b80b2;
492 font-size: 100%;
493 cursor: pointer;
494}
495
496.editinline button.addlink:hover {
497 color: #036;
498 cursor: pointer;
499}
500
501.editinline table .help {
502 text-align: right;
503 float: right;
504 padding-left: 2em;
505}
506
507.editinline tfoot .addlink {
508 white-space: nowrap;
509}
510
511.editinline table thead th:last-child {
512 border-left: none;
513}
514
515.editinline tr.deleted {
516 background: #ddd url(../img/deleted-overlay.gif);
517}
518
519.editinline tr.deleted .inline-deletelink {
520 background-image: url(../img/inline-restore.png);
521}
522
523.editinline tr.deleted td:hover {
524 cursor: default;
525}
526
527.editinline tr.deleted td:first-child {
528 background-image: none !important;
529}
530
531/* EDIT INLINE - STACKED */
532
533.editinline-stacked {
534 min-width: 758px;
535}
536
537.editinline-stacked .inline-object {
538 margin-left: 210px;
539 background: white;
540}
541
542.editinline-stacked .inline-source {
543 float: left;
544 width: 200px;
545 background: #f8f8f8;
546}
547
548.editinline-stacked .inline-splitter {
549 float: left;
550 width: 9px;
551 background: #f8f8f8 url(../img/inline-splitter-bg.gif) 50% 50% no-repeat;
552 border-right: 1px solid #ccc;
553}
554
555.editinline-stacked .controls {
556 clear: both;
557 background: #e1e1e1 url(../img/nav-bg.gif) top left repeat-x;
558 padding: 3px 4px;
559 font-size: 11px;
560 border-top: 1px solid #ddd;
561}
562