1
2/*____________ Layout ____________*/
3
4#mediamanager__page h1 {
5    margin: 0 0 .5em;
6}
7
8#mediamanager__page {
9    min-width: 800px;
10    width: 100%;
11    text-align: left;
12}
13
14#mediamanager__page .panel {
15    float: left;
16}
17
18#mediamanager__page .namespaces {
19    width: 15%;
20    min-width: 120px;
21}
22#mediamanager__page .filelist {
23    width: 50%;
24    min-width: 400px;
25}
26#mediamanager__page .file {
27    width: 35%;
28    min-width: 280px;
29}
30
31#mediamanager__page .panelHeader {
32    background-color: __background_alt__;
33    margin: 0 10px 10px 0;
34    padding: 10px 10px 8px;
35    text-align: left;
36    min-height: 20px;
37    overflow: hidden;
38}
39[dir=rtl] #mediamanager__page .panelContent {
40    text-align: right;
41}
42
43
44#mediamanager__page .panelContent {
45    overflow-y: auto;
46    overflow-x: hidden;
47    padding: 0;
48    margin: 0 10px 10px 0;
49    position: relative;
50}
51
52#mediamanager__page .file .panelHeader,
53#mediamanager__page .file .panelContent {
54    margin-right: 0;
55}
56
57#mediamanager__page .ui-resizable-e {
58    width: 6px;
59    right: 2px;
60    background: transparent url(images/resizecol.png) center center no-repeat;
61}
62#mediamanager__page .ui-resizable-e:hover {
63    background-color: __background_alt__;
64}
65
66
67/*____________ Namespaces tree ____________*/
68
69[dir=rtl] #mediamanager__page .namespaces {
70    text-align: right;
71}
72
73#mediamanager__page .namespaces h2 {
74    font-size: 1em;
75    display: inline-block;
76    border-width: 0;
77    padding: .3em .8em;
78    margin: 0 .3em 0 0;
79    border-radius: .5em .5em 0 0;
80    font-weight: normal;
81    background-color: __background_alt__;
82    color: __text__;
83    line-height: 1.5em;
84}
85* html #mediamanager__page .namespaces h2,
86*+html #mediamanager__page .namespaces h2 {
87    display: inline;
88}
89[dir=rtl] #mediamanager__page .namespaces h2 {
90    margin-right: 10px;
91}
92
93#mediamanager__page .namespaces ul {
94    margin-left: .2em;
95    margin-bottom: 0;
96    padding: 0;
97    list-style: none;
98}
99[dir=rtl] #mediamanager__page .namespaces ul {
100    margin-left: 0;
101    margin-right: .2em;
102}
103
104#mediamanager__page .namespaces ul ul {
105    margin-left: 1em;
106}
107[dir=rtl] #mediamanager__page .namespaces ul ul {
108    margin-left: 0;
109    margin-right: 1em;
110}
111#mediamanager__page .namespaces ul ul li {
112    margin: 0;
113}
114
115
116#mediamanager__page .namespaces ul .selected {
117    background-color: __highlight__;
118    font-weight: bold;
119}
120
121/*____________ Panel header ____________*/
122
123#mediamanager__page .panelHeader h3 {
124    float: left;
125    font-weight: normal;
126    font-size: 1em;
127    padding: 0;
128    margin: 0 0 3px;
129}
130
131#mediamanager__page .panelHeader form.options {
132    float: right;
133    margin-top: -3px;
134}
135
136#mediamanager__page .panelHeader ul {
137    list-style: none;
138    margin: 0;
139    padding: 0;
140}
141#mediamanager__page .panelHeader ul li {
142    color: __text__;
143    float: left;
144    line-height: 1;
145    padding-left: 3px;
146}
147
148#mediamanager__page .panelHeader ul li.listType {
149    padding-left: 30px;
150    background: url('../../images/icon-list.png') 3px 1px no-repeat;
151}
152#mediamanager__page .panelHeader ul li.sortBy {
153    padding-left: 30px;
154    background: url('../../images/icon-sort.png') 3px 1px no-repeat;
155}
156
157#mediamanager__page .panelHeader form.options .ui-buttonset label{
158    font-size: 90%;
159    margin-right: -0.4em;
160}
161#mediamanager__page .panelHeader form.options .ui-buttonset .ui-button-text {
162    padding: .4em .7em;
163    line-height: 1;
164}
165
166/*____________ File list ____________*/
167
168#mediamanager__page .filelist ul {
169    padding: 0;
170    margin: 0;
171}
172[dir=rtl] #mediamanager__page .filelist ul.tabs {
173    margin-right: 10px;
174}
175
176#mediamanager__page .filelist .panelContent ul li:hover {
177    background-color: __background_alt__;
178}
179
180#mediamanager__page .filelist li dt a {
181    vertical-align: middle;
182    display: table-cell;
183    overflow: hidden;
184}
185* html #mediamanager__page .filelist .thumbs li dt a,
186*+html #mediamanager__page .filelist .thumbs li dt a {
187    display: block;
188}
189* html #mediamanager__page .filelist .rows li dt a,
190*+html #mediamanager__page .filelist .rows li dt a {
191    display: inline;
192}
193
194/* thumbs */
195
196#mediamanager__page .filelist .thumbs li {
197    width: 100px;
198    min-height: 130px;
199    display: inline-block;
200    display: -moz-inline-stack;
201    /* the right margin should visually be 10px, but because of its inline-block nature the whitespace inbetween is about 4px more */
202    margin: 0 6px 10px 0;
203    background-color: __background_neu__;
204    color: __text__;
205    padding: 5px;
206    vertical-align: top;
207    text-align: center;
208    position: relative;
209    line-height: 1.2;
210}
211[dir=rtl] #mediamanager__page .filelist .thumbs li {
212    margin-right: 0;
213    margin-left: 6px;
214}
215* html #mediamanager__page .filelist .thumbs li,
216*+html #mediamanager__page .filelist .thumbs li {
217    display: inline;
218    zoom: 1;
219}
220
221#mediamanager__page .filelist .thumbs li dt a {
222    width: 100px;
223    height: 90px;
224}
225
226#mediamanager__page .filelist .thumbs li dt a img {
227    max-width: 90px;
228    max-height: 90px;
229}
230
231#mediamanager__page .filelist .thumbs li .name,
232#mediamanager__page .filelist .thumbs li .size,
233#mediamanager__page .filelist .thumbs li .filesize,
234#mediamanager__page .filelist .thumbs li .date {
235    display: block;
236    overflow: hidden;
237    text-overflow: ellipsis;
238    width: 90px;
239    white-space: nowrap;
240}
241#mediamanager__page .filelist .thumbs li .name {
242    padding: 5px 0;
243    font-weight: bold;
244}
245#mediamanager__page .filelist .thumbs li .date {
246    font-style: italic;
247    white-space: normal;
248}
249
250/* rows */
251
252#mediamanager__page .filelist .rows li {
253    list-style: none;
254    display: block;
255    position: relative;
256    max-height: 50px;
257    margin: 0;
258    margin-bottom: 3px;
259    background-color: __background__;
260    color: __text__;
261    overflow: hidden;
262}
263
264#mediamanager__page .filelist .rows li:nth-child(2n+1) {
265    background-color: __background_neu__;
266}
267
268#mediamanager__page .filelist .rows li dt {
269    float: left;
270    width: 10%;
271    height: 40px;
272    text-align: center;
273}
274
275#mediamanager__page .filelist .rows li dt a {
276    width: 100px;
277    height: 40px;
278}
279
280#mediamanager__page .filelist .rows li dt a img {
281    max-width: 40px;
282    max-height: 40px;
283}
284
285#mediamanager__page .filelist .rows li .name,
286#mediamanager__page .filelist .rows li .size,
287#mediamanager__page .filelist .rows li .filesize,
288#mediamanager__page .filelist .rows li .date {
289    overflow: hidden;
290    text-overflow: ellipsis;
291    float: left;
292    margin-left: 1%;
293    white-space: nowrap;
294}
295
296#mediamanager__page .filelist .rows li .name {
297    width: 30%;
298    font-weight: bold;
299}
300#mediamanager__page .filelist .rows li .size,
301#mediamanager__page .filelist .rows li .filesize {
302    width: 15%;
303}
304#mediamanager__page .filelist .rows li .date {
305    width: 20%;
306    font-style: italic;
307    white-space: normal;
308}
309
310/*____________ Upload panel ____________*/
311
312#mediamanager__page div.upload {
313    padding-bottom: 0.5em;
314}
315
316#media__content #mediamanager__uploader {
317    border-bottom: 1px solid __border__;
318    padding-bottom: 0.5em;
319}
320
321/*____________ File preview ____________*/
322
323#mediamanager__page .file ul.actions {
324    text-align: center;
325    margin: 0 0 5px;
326    list-style: none;
327}
328#mediamanager__page .file ul.actions li {
329    display: inline;
330}
331
332#mediamanager__page .file div.image {
333    margin-bottom: 5px;
334    text-align: center;
335}
336
337#mediamanager__page .file div.image img {
338    width: 100%;
339}
340
341#mediamanager__page .file dl {
342}
343#mediamanager__page .file dl dt {
344    font-weight: bold;
345    display: block;
346    background-color: __background_alt__;
347}
348#mediamanager__page .file dl dd {
349    display: block;
350    background-color: __background_neu__;
351}
352
353
354/*____________ Meta data edit form ____________*/
355
356#mediamanager__page form.meta div.row {
357    margin-bottom: 5px;
358}
359
360#mediamanager__page form.meta label span {
361    display: block;
362}
363[dir=rtl] #mediamanager__page form.meta label span {
364    text-align: right;
365}
366
367#mediamanager__page form.meta input {
368    width: 50%;
369}
370
371#mediamanager__page form.meta input.button,
372#mediamanager__page form.meta button {
373    width: auto;
374}
375
376#mediamanager__page form.meta textarea.edit {
377    height: 6em;
378    width: 95%;
379    min-width: 95%;
380    max-width: 95%;
381}
382
383/*____________ Revisions form ____________*/
384
385#mediamanager__page form.changes ul {
386    margin-left: 10px;
387    list-style-type: none;
388}
389
390#mediamanager__page form.changes ul li div.li div {
391    font-size: 90%;
392    color: __text_neu__;
393    padding-left: 18px;
394}
395
396#mediamanager__page form.changes ul li div.li input {
397    position: relative;
398    top: 1px;
399}
400
401/* File diff */
402
403#mediamanager__diff table {
404    table-layout: fixed;
405}
406
407#mediamanager__diff td,
408#mediamanager__diff th {
409    width: 48%;
410    margin: 0 5px 10px 0;
411    padding: 0;
412    vertical-align: top;
413    text-align: left;
414}
415[dir=rtl] #mediamanager__diff td,
416[dir=rtl] #mediamanager__diff th {
417    text-align: right;
418}
419
420#mediamanager__diff th {
421    font-weight: normal;
422}
423#mediamanager__diff th a {
424    font-weight: bold;
425}
426#mediamanager__diff th span {
427    font-size: 90%;
428}
429
430#mediamanager__diff dl dd strong{
431    background-color: __highlight__;
432    color: __text__;
433    font-weight: normal;
434}
435
436/* Image diff */
437
438#mediamanager__page .file form.diffView {
439    margin-bottom: 10px;
440    display: block;
441}
442
443#mediamanager__diff div.slider {
444    margin: 10px;
445    width: 95%;
446}
447
448#mediamanager__diff .imageDiff {
449    position: relative;
450}
451#mediamanager__diff .imageDiff .image2 {
452    position: absolute;
453    top: 0;
454    left: 0;
455}
456
457#mediamanager__diff .imageDiff.opacity .image2 {
458    -moz-opacity: 0.5;
459    -khtml-opacity: 0.5;
460    opacity: 0.5;
461}
462
463#mediamanager__diff .imageDiff.portions .image2 {
464    border-right: 1px solid red;
465    overflow: hidden;
466}
467
468#mediamanager__diff .imageDiff.portions img {
469    float: left;
470}
471
472#mediamanager__diff .imageDiff img {
473    width: 100%;
474    max-width: none;
475}
476
477