Merge branch 'MDL-41229-master' of git://github.com/mouneyrac/moodle
[moodle.git] / theme / bootstrapbase / less / moodle / filemanager.less
1  // File Picker and File Manager
2 .filemanager,
3 .filepicker,
4 .file-picker {
5     font-size: 11px;
6 }
7 .filemanager a,
8 .file-picker a,
9 .filemanager a:hover,
10 .file-picker a:hover {
11     color: #555555;
12     text-decoration: none;
13 }
14 .filemanager input[type="text"],
15 .file-picker input[type="text"] {
16     width: 265px;
17 }
18 .filemanager .fp-license,
19 .file-picker .fp-setlicense {
20     td {
21         max-width: 265px;
22     }
23     select {
24         max-width: 100%;
25     }
26 }
27 .fp-content-center {
28     height: 100%;
29     width: 100%;
30     display: table-cell;
31     vertical-align: middle;
32 }
33 .fp-content-hidden {
34     visibility: hidden;
35 }
36 // Dialogue (File Picker and File Manager)
37 .yui3-panel-focused {
38     outline: none;
39 }
40 #filesskin .yui3-panel-content {
41     padding-bottom: 20px;
42     background: #F2F2F2;
43     .border-radius(8px);
44     border: 1px solid #fff;
45     display: inline-block;
46     .ie7-inline-block();
47     .box-shadow(5px 5px 20px 0 #666);
48 }
49 #filesskin .yui3-widget-hd {
50     .border-radius(10px 10px 0 0);
51     border-bottom: 1px solid #BBBBBB;
52     padding: 5px;
53     text-align: center;
54     font-size: 12px;
55     color: #333;
56     letter-spacing: 1px;
57     text-shadow: 1px 1px 1px #fff;
58     filter: dropshadow(color=#FFFFFF, offx=1, offy=1);
59     #gradient > .vertical (#fff, #ccc);
60 }
61 .fp-panel-button {
62     background: #fff;
63     padding: 3px 20px 2px 20px;
64     text-align: center;
65     margin: 10px;
66     .border-radius(10px);
67     display: inline-block;
68     .ie7-inline-block();
69     .box-shadow(2px 2px 3px .1px #999);
70 }
72  .moodle-dialogue-base .filepicker .moodle-dialogue-wrap .moodle-dialogue-bd {
73     padding: 0px;
74 }
76 // File Picker layout
77 #filesskin .file-picker.fp-generallayout {
78     width: 859px;
79     background: #FFFFFF;
80     .border-radius(10px);
81     border: 1px solid #CCCCCC;
82     position: relative;
83 }
84 .file-picker .fp-repo-area {
85     width: 180px;
86     overflow: auto;
87     display: inline-block;
88     .ie7-inline-block();
89     float: left;
90     height: 525px;
91     border-right: 1px solid #BBBBBB;
92 }
93 .dir-rtl .file-picker .fp-repo-area {
94     border-left: 1px solid #BBBBBB;
95     border-right: none;
96     float: right;
97 }
98 .file-picker .fp-repo-items {
99     float: left;
100     width: 693px;
102 .dir-rtl .file-picker .fp-repo-items {
103     float: right;
105 .file-picker .fp-navbar {
106     background: #F2F2F2;
107     min-height: 22px;
108     border-bottom: 1px solid #BBBBBB;
109     padding: 5px 8px;
111 .file-picker .fp-content {
112     background: #FFFFFF;
113     clear: both;
114     overflow: auto;
115     height: 468px;
117 .filepicker.moodle-dialogue-fullscreen .file-picker .fp-content {
118     width: 100%;
119     height: 100%;
121 .dir-rtl .file-picker .fp-repo-items {
122     margin-right: 181px;
124 .file-picker .fp-content-loading {
125     height: 100%;
126     width: 100%;
127     display: table;
128     text-align: center;
130 .file-picker .fp-content .fp-object-container {
131     width: 98%;
132     height: 98%;
134 .dir-rtl .file-picker .fp-list {
135     text-align: right;
137 .dir-rtl .file-picker .fp-toolbar {
138     padding: 0;
140 .dir-rtl .file-picker .fp-list {
141     text-align: right;
143 .dir-rtl .file-picker .fp-repo-name {
144     display: inline;
146 .dir-rtl .file-picker .fp-pathbar {
147     text-align: right;
148     display: block;
149     border-top: none;
151 .dir-rtl .file-picker div.bd {
152     text-align: right;
154 .dir-rtl #filemenu .yuimenuitemlabel {
155     text-align: right;
157 .dir-rtl .filepicker .yui-layout-unit-left {
158     left: 500px;
160 .dir-rtl .filepicker .yui-layout-unit-center {
161     left: 0;
163 // File Manager
164 .dir-rtl .filemanager-toolbar a {
165     padding: 0;
167 // Repositories on fp-repo-area (File Picker only)
168 .file-picker .fp-list {
169     list-style-type: none;
170     padding: 0;
171     float: left;
172     width: 100%;
173     margin: 0;
175 .dir-rtl .file-picker .fp-list {
176     text-align: right;
177     float: left;
179 .file-picker .fp-list .fp-repo a {
180     display: block;
181     padding: .5em .7em;
183 .file-picker .fp-list .fp-repo.active {
184     background: #F2F2F2;
186 .file-picker .fp-list .fp-repo-icon {
187     padding: 0 7px 0 5px;
189 // Tools, Path & View on fp-navbar (File Picker and File Manager)
190 .fp-toolbar {
191     display: table-row;
192     line-height: 22px;
193     float: left;
194     max-width: 70%;
196 .dir-rtl .fp-toolbar {
197     float: right;
199 .fp-toolbar.empty {
200     display: none;
202 .fp-toolbar .disabled {
203     display: none;
205 .fp-toolbar div {
206     display: inline-block;
207     .ie7-inline-block();
208     padding: 0 2px;
209     padding-right: 10px;
211 .dir-rtl .fp-toolbar div {
212     width: 100px;
213     padding-right: 0px;
215 .fp-toolbar img {
216     vertical-align: -15%;
217     margin-right: 5px;
219 .fp-toolbar .fp-tb-search {
220     width: 228px;
221     height: 14px;
223 .fp-toolbar .fp-tb-search input {
224     background: #FFFFFF url('[[pix:a/search]]') no-repeat 3px 3px;
225     padding: 2px 6px 1px 20px;
226     width: 200px;
227     height: 16px;
228     border: 1px solid #BBBBBB;
230 .fp-viewbar {
231     float: right;
232     width: 69px;
233     height: 22px;
234     margin-right: 8px;
236 .dir-rtl .fp-toolbar img {
237     vertical-align: -35%;
239 .dir-rtl .fp-viewbar {
240     float: left;
241     width: 100px;
243 .fp-vb-icons {
244     background: url('[[pix:theme|fp/view_icon_active]]') no-repeat 0 0;
245     width: 22px;
246     height: 22px;
247     display: inline-block;
248     .ie7-inline-block();
250 .dir-rtl .fp-vb-icons {
251     background: url('[[pix:theme|fp/view_icon_active]]') no-repeat 0 0;
252     display: block;
253     float: left;
254     margin-right: 4px;
256 .fp-vb-icons.checked {
257     background: url('[[pix:theme|fp/view_icon_selected]]');
259 .dir-rtl .fp-vb-icons.checked {
260     background: url('[[pix:theme|fp/view_icon_selected]]');
261     display: block;
262     float: left;
263     margin-right: 4px;
265 .fp-viewbar.disabled .fp-vb-icons {
266     background: url('[[pix:theme|fp/view_icon_inactive]]');
268 .fp-vb-details {
269     background: url('[[pix:theme|fp/view_list_active]]') no-repeat 0 0;
270     width: 23px;
271     height: 22px;
272     display: inline-block;
273     .ie7-inline-block();
274     margin-left: -4px;
276 .dir-rtl .fp-vb-details {
277     background: url('[[pix:theme|fp/view_list_active]]') no-repeat 0 0;
278     display: block;
279     float: left;
280     margin-right: 4px;
282 .fp-vb-details.checked {
283     background: url('[[pix:theme|fp/view_list_selected]]');
285 .dir-rtl .fp-vb-details.checked {
286     background: url('[[pix:theme|fp/view_list_selected]]');
287     display: block;
288     float: left;
289     margin-right: 4px;
291 .fp-viewbar.disabled .fp-vb-details {
292     background: url('[[pix:theme|fp/view_list_inactive]]');
294 .fp-vb-tree {
295     background: url('[[pix:theme|fp/view_tree_active]]') no-repeat 0 0;
296     width: 23px;
297     height: 22px;
298     display: inline-block;
299     .ie7-inline-block();
300     margin-left: -4px;
302 .dir-rtl .fp-vb-tree {
303     background: url('[[pix:theme|fp/view_tree_active]]') no-repeat 0 0;
304     display: block;
305     float: left;
306     margin-right: 4px;
308 .fp-vb-tree.checked {
309     background: url('[[pix:theme|fp/view_tree_selected]]');
311 .dir-rtl .fp-vb-tree.checked {
312     background: url('[[pix:theme|fp/view_tree_selected]]');
313     display: block;
314     float: left;
315     margin-right: 4px;
317 .fp-viewbar.disabled .fp-vb-tree {
318     background: url('[[pix:theme|fp/view_tree_inactive]]');
320 .file-picker .fp-clear-left {
321     clear: left;
323 // over ride hover rule from core.css
324 .dir-rtl .filemanager-toolbar .fp-vb-icons a:hover {
325     background: url('[[pix:theme|fp/view_icon_selected]]');
327 .dir-rtl .filemanager-toolbar .fp-vb-icons.checked a:hover {
328     background: url('[[pix:theme|fp/view_icon_active]]') no-repeat 0 0;
330 .dir-rtl .fp-vb-details a:hover {
331     background: none;
332     border: 20px solid black;
334 .dir-rtl .fp-vb-details.checked a:hover {
335     background: none;
336     border: 40px solid black;
338 .dir-rtl .fp-vb-tree a:hover {
339     background: none;
340     border: 30px solid black;
342 .dir-rtl .fp-vb-tree.checked a:hover {
343     background: none;
344     border: 50px solid black;
346 .file-picker .fp-pathbar {
347     display: table-row;
349 .fp-pathbar.empty {
350     display: none;
352 .fp-pathbar .fp-path-folder {
353     background: url('[[pix:theme|fp/path_folder]]') no-repeat 0 0;
354     width: 27px;
355     height: 12px;
356     margin-left: 4px;
358 .dir-rtl .fp-pathbar .fp-path-folder {
359     background: url('[[pix:theme|fp/path_folder_rtl]]') no-repeat right top;
360     width: auto;
361     height: 12px;
362     margin-left: 4px;
364 .dir-rtl .fp-pathbar span {
365     display: inline-block;
366     .ie7-inline-block();
367     float: right;
368     margin-left: 32px;
370 .fp-pathbar .fp-path-folder-name {
371     margin-left: 32px;
372     line-height: 20px;
374 .dir-rtl .fp-pathbar .fp-path-folder-name {
375     margin-right: 32px;
376     line-height: 20px;
378 // Icon view (File Picker and File Manager)
379 .fp-iconview .fp-file {
380     float: left;
381     text-align: center;
382     position: relative;
383     margin: 10px 10px 35px;
385 .fp-iconview .fp-thumbnail {
386     min-width: 110px;
387     min-height: 110px;
388     line-height: 110px;
389     text-align: center;
390     border: 1px solid #FFFFFF;
391     display: block;
393 .fp-iconview .fp-thumbnail img {
394     border: 1px solid #ddd;
395     padding: 3px;
396     vertical-align: middle;
397     .box-shadow(1px 1px 2px 0 #ccc);
399 .fp-iconview .fp-thumbnail:hover {
400     background: #fff;
401     border: 1px solid #ddd;
402     .box-shadow(inset 0 0 10px 0px #ccc);
404 .fp-iconview .fp-filename-field {
405     height: 33px;
406     word-wrap: break-word;
407     overflow: hidden;
408     position: absolute;
410 .fp-iconview .fp-filename-field:hover {
411     overflow: visible;
412     z-index: 1000;
414 .fp-iconview .fp-filename-field .fp-filename {
415     background: #FFFFFF;
416     padding-top: 5px;
417     padding-bottom: 12px;
418     min-width: 112px;
420 .dir-rtl .fp-iconview .fp-file {
421     float: right;
423 // Table view (File Picker only)
424 .file-picker .yui3-datatable table {
425     border: 0 solid #BBBBBB;
426     width: 100%;
428 #filesskin .file-picker .yui3-datatable-header {
429     background: #FFFFFF;
430     border-bottom: 1px solid #CCCCCC;
431     border-left: 0 solid #FFFFFF;
432     color: #555555;
434 #filesskin .file-picker .yui3-datatable-odd .yui3-datatable-cell {
435     background-color: #F6F6F6;
436     border-left: 0 solid #F6F6F6;
438 #filesskin .file-picker .yui3-datatable-even .yui3-datatable-cell {
439     background-color: #FFFFFF;
440     border-left: 0 solid #FFFFFF;
442 .dir-rtl .file-picker .yui3-datatable-header {
443     text-align: right;
445 // Tree view (File Manager only)
447 // first or middle sibling, no children
448 .file-picker .ygtvtn,
449 .filemanager .ygtvtn {
450     background: url('[[pix:moodle|y/tn]]') 0 0 no-repeat;
451     width: 17px;
452     height: 22px;
454 .dir-rtl .filemanager .ygtvtn,
455 .dir-rtl .file-picker .ygtvtn {
456     background: url('[[pix:moodle|y/tn_rtl]]') 0 0 no-repeat;
457     width: 17px;
458     height: 22px;
460 // first or middle sibling, collapsable
461 .file-picker .ygtvtm,
462 .filemanager .ygtvtm {
463     background: url('[[pix:moodle|y/tm]]') 0 10px no-repeat;
464     width: 13px;
465     height: 12px;
466     cursor: pointer;
468 // first or middle sibling, collapsable, hover
469 .file-picker .ygtvtmh,
470 .filemanager .ygtvtmh {
471     background: url('[[pix:moodle|y/tm]]') 0 10px no-repeat;
472     width: 13px;
473     height: 12px;
474     cursor: pointer;
476 // first or middle sibling, expandable
477 .file-picker .ygtvtp,
478 .filemanager .ygtvtp {
479     background: url('[[pix:moodle|y/tp]]') 0 10px no-repeat;
480     width: 13px;
481     height: 12px;
482     cursor: pointer;
484 .dir-rtl .file-picker .ygtvtp,
485 .dir-rtl .filemanager .ygtvtp {
486     background: url('[[pix:moodle|y/tp_rtl]]') 0 10px no-repeat;
488 // first or middle sibling, expandable, hover
489 .file-picker .ygtvtph,
490 .filemanager .ygtvtph {
491     background: url('[[pix:moodle|y/tp]]') 0 10px no-repeat;
492     width: 13px;
493     height: 22px;
494     cursor: pointer;
496 .dir-rtl .file-picker .ygtvtph,
497 .dir-rtl .filemanager .ygtvtph {
498     background: url('[[pix:moodle|y/tp_rtl]]') 0 10px no-repeat;
500 // last sibling, no children
501 .file-picker .ygtvln,
502 .filemanager .ygtvln {
503     background: url('[[pix:moodle|y/ln]]') 0 0 no-repeat;
504     width: 17px;
505     height: 22px;
507 .dir-rtl .file-picker .ygtvln,
508 .dir-rtl .filemanager .ygtvln {
509     background: url('[[pix:moodle|y/ln_rtl]]') 0 0 no-repeat;
511 // Last sibling, collapsable
512 .file-picker .ygtvlm,
513 .filemanager .ygtvlm {
514     background: url('[[pix:moodle|y/lm]]') 0 10px no-repeat;
515     width: 13px;
516     height: 12px;
517     cursor: pointer;
519 // Last sibling, collapsable, hover
520 .file-picker .ygtvlmh,
521 .filemanager .ygtvlmh {
522     background: url('[[pix:moodle|y/lm]]') 0 10px no-repeat;
523     width: 13px;
524     height: 12px;
525     cursor: pointer;
527 // Last sibling, expandable
528 .file-picker .ygtvlp,
529 .filemanager .ygtvlp {
530     background: url('[[pix:moodle|y/lp]]') 0 10px no-repeat;
531     width: 13px;
532     height: 12px;
533     cursor: pointer;
535 .dir-rtl .file-picker .ygtvlp,
536 .dir-rtl .filemanager .ygtvlp {
537     background: url('[[pix:moodle|y/lp_rtl]]') 0 10px no-repeat;
539 // Last sibling, expandable, hover
540 .file-picker .ygtvlph,
541 .filemanager .ygtvlph {
542     background: url('[[pix:moodle|y/lp]]') 0 10px no-repeat;
543     width: 13px;
544     height: 12px;
545     cursor: pointer;
547 .dir-rtl .file-picker .ygtvlph,
548 .dir-rtl .filemanager .ygtvlph {
549     background: url('[[pix:moodle|y/lp_rtl]]') 0 10px no-repeat;
551 // Loading icon
552 .file-picker .ygtvloading,
553 .filemanager .ygtvloading {
554     background: transparent url('[[pix:moodle|y/loading]]') 0 0 no-repeat;
555     width: 16px;
556     height: 22px;
558 // the style for the empty cells that are used for rendering the depth of the node
559 .file-picker .ygtvdepthcell,
560 .filemanager .ygtvdepthcell {
561     background: url('[[pix:moodle|y/vline]]') 0 0 no-repeat;
562     width: 17px;
563     height: 32px;
565 .file-picker .ygtvblankdepthcell,
566 .filemanager .ygtvblankdepthcell {
567     width: 17px;
568     height: 22px;
570 a.ygtvspacer:hover {
571     color: transparent;
572     text-decoration: none;
574 .ygtvlabel,
575 .ygtvlabel:link,
576 .ygtvlabel:visited,
577 .ygtvlabel:hover {
578     background-color: transparent;
579     cursor: pointer;
580     margin-left: 2px;
581     text-decoration: none;
583 .file-picker .ygtvfocus,
584 .filemanager .ygtvfocus {
585     background-color: #EEEEEE;
587 .fp-filename-icon {
588     margin-top: 10px;
589     display: block;
590     position: relative;
592 .fp-icon {
593     float: left;
594     margin-top: -7px;
595     width: 24px;
596     height: 24px;
597     margin-right: 10px;
598     text-align: center;
599     line-height: 24px;
601 .dir-rtl .fp-icon {
602     float: right;
603     margin-left: 10px;
604     margin-right: 0;
606 .fp-icon img {
607     max-height: 24px;
608     max-width: 24px;
609     vertical-align: middle;
611 .fp-filename {
612     padding-right: 10px;
614 .dir-rtl .fp-filename {
615     padding-left: 10px;
616     padding-right: 0;
618 // Repositories Login on fp-content (File Picker only)
620 .file-picker .fp-login-form {
621     height: 100%;
622     width: 100%;
623     display: table;
625 .file-picker .fp-login-form table {
626     margin: 0 auto;
628 .file-picker .fp-login-form p {
629     text-align: center;
630     margin-top: 3em;
632 .file-picker .fp-login-form .fp-login-input label {
633     text-align: right;
634     display: block;
636 .file-picker .fp-login-form .fp-login-input .input {
637     text-align: left;
639 .file-picker .fp-login-form input[type="checkbox"]{
640     width: 15px;
641     height: 15px;
643 // Upload on fp-content (File Picker only)
644 .file-picker .fp-upload-form {
645     height: 100%;
646     width: 100%;
647     display: table;
649 .file-picker .fp-upload-form table {
650     margin: 0 auto;
652 // File exists dialogue on Upload (File Picker only)
653 .file-picker.fp-dlg {
654     text-align: center;
656 .file-picker.fp-dlg .fp-dlg-text {
657     padding: 30px 20px 10px;
658     font-size: 12px;
660 .file-picker.fp-dlg .fp-dlg-buttons {
661     margin: 0 20px;
663 // Error dialogue on Upload (File Picker only)
664 .file-picker.fp-msg {
665     text-align: center;
667 .file-picker.fp-msg .fp-msg-text {
668     padding: 40px 20px 10px 20px;
669     min-width: 200px;
670     max-width: 500px;
671     max-height: 300px;
672     overflow: auto;
673     font-size: 12px;
675 .file-picker.fp-msg.fp-msg-error .fp-msg-text {
676     padding: 40px 20px 10px 20px;
677     font-size: 12px;
679 // Error on fp-content (File Picker only)
680 .file-picker .fp-content-error {
681     height: 100%;
682     width: 100%;
683     display: table;
684     text-align: center;
686 .file-picker .fp-content-error .fp-error {
687     height: 100%;
688     width: 100%;
689     display: table-cell;
690     vertical-align: middle;
691     padding: 40px 20px 10px 20px;
692     font-size: 12px;
694 // Lazy loading on fp-content (File Picker only)
695 .file-picker .fp-nextpage {
696     clear: both;
698 .file-picker .fp-nextpage .fp-nextpage-loading {
699     display: none;
701 .file-picker .fp-nextpage.loading .fp-nextpage-link {
702     display: none;
704 .file-picker .fp-nextpage.loading .fp-nextpage-loading {
705     display: block;
706     text-align: center;
707     height: 100px;
708     padding-top: 50px;
710 // Select Dialogue (File Picker and File Manager)
711 .fp-select form {
712     padding: 20px 20px 0;
714 .fp-select .fp-select-loading {
715     text-align: center;
716     margin-top: 20px;
718 .fp-select .fp-hr {
719     clear: both;
720     height: 1px;
721     background-color: #FFFFFF;
722     border-bottom: 1px solid #BBBBBB;
723     width: auto;
724     margin: 10px 0;
726 .fp-select table {
727     padding: 0 0 10px;
729 .fp-select table .mdl-right {
730     min-width: 84px;
732 .fp-select .fp-reflist .mdl-right {
733     vertical-align: top;
735 .fp-select .fp-select-buttons {
736     float: right;
738 .fp-select .fp-info {
739     display: block;
740     clear: both;
741     padding: 1px 20px 0;
743 .fp-select .fp-thumbnail {
744     float: left;
745     min-width: 110px;
746     min-height: 110px;
747     line-height: 110px;
748     text-align: center;
749     margin: 10px 20px 0 0;
750     background: #fff;
751     border: 1px solid #ddd;
752     .box-shadow(inset 0 0 10px 0 #ccc);
754 .fp-select .fp-thumbnail img {
755     border: 1px solid #DDDDDD;
756     padding: 3px;
757     vertical-align: middle;
758     margin: 10px;
760 .fp-select .fp-fileinfo {
761     display: inline-block;
762     .ie7-inline-block();
763     margin-top: 10px;
765 .file-picker.fp-select .fp-fileinfo {
766     max-width: 240px;
768 .fp-select .fp-fileinfo div {
769     padding-bottom: 5px;
771 .file-picker.fp-select .uneditable {
772     display: none;
774 .file-picker.fp-select .fp-select-loading {
775     display: none;
777 .file-picker.fp-select.loading .fp-select-loading {
778     display: block;
780 .file-picker.fp-select.loading form {
781     display: none;
783 .fp-select .fp-dimensions.fp-unknown {
784     display: none;
786 // File Manager
787 .filemanager-loading{
788     display: none;
790 .jsenabled .filemanager-loading{
791     display: block;
792     margin-top: 100px;
794 .filemanager.fm-loading .filemanager-toolbar,
795 .filemanager.fm-loading .fp-pathbar,
796 .filemanager.fm-loading .filemanager-container,
797 .filemanager.fm-loaded .filemanager-loading,
798 .filemanager.fm-maxfiles .fp-btn-add,
799 .filemanager.fm-maxfiles .dndupload-message,
800 .filemanager.fm-noitems .fp-btn-download,
801 .filemanager .fm-empty-container,
802 .filemanager.fm-noitems .filemanager-container .fp-content {
803     display: none;
805 .filemanager .filemanager-updating {
806     display: none;
807     text-align: center;
809 .filemanager.fm-updating .filemanager-updating {
810     display: block;
811     margin-top: 37px;
813 .filemanager.fm-updating .fm-content-wrapper,
814 .filemanager.fm-nomkdir .fp-btn-mkdir,
815 .fitem.disabled .filemanager .filemanager-toolbar,
816 .fitem.disabled .filemanager .fp-pathbar,
817 .fitem.disabled .filemanager .fp-restrictions,
818 .fitem.disabled .filemanager .fm-content-wrapper {
819     display: none;
821 // File Manager layout
822 .fp-restrictions{
823     text-align: right;
825 .filemanager .fp-navbar {
826     background: #F2F2F2;
827     border: 1px solid #BBBBBB;
828     border-bottom: none;
830 .filemanager-toolbar{
831     padding: 5px 8px;
832     min-height: 22px;
833     overflow: hidden;
835 .fp-pathbar {
836     border-top: 1px solid #BBBBBB;
837     padding: 5px 8px 1px;
838     min-height: 20px;
840 .filemanager .fp-pathbar.empty {
841     display: none;
843 .filepicker-filelist,
844 .filemanager-container {
845     background: #FFFFFF;
846     clear: both;
847     overflow: auto;
848     border: 1px solid #BBBBBB;
849     min-height: 140px;
850     position: relative;
852 .filemanager .fp-content{
853     overflow: auto;
854     max-height: 472px;
855     min-height: 157px;
857 .filemanager-container,
858 .filepicker-filelist {
859     overflow: hidden;
861 .fitem.disabled .filepicker-filelist,
862 .fitem.disabled .filemanager-container {
863     background-color: #EBEBE4;
865 .fitem.disabled .fp-btn-choose {
866     .muted
868 .fitem.disabled .filepicker-filelist .filepicker-filename {
869     display: none;
871 // Icon view (File Manager only)
872 .fp-iconview .fp-reficons1 {
873     position: absolute;
874     height: 100%;
875     width: 100%;
876     top: 0;
877     left: 0;
879 .fp-iconview .fp-reficons2 {
880     position: absolute;
881     height: 100%;
882     width: 100%;
883     top: 0;
884     left: 0;
886 .fp-iconview .fp-file.fp-hasreferences .fp-reficons1 {
887     background: url('[[pix:theme|fp/link]]') no-repeat;
888     background-position: bottom right;
890 .fp-iconview .fp-file.fp-isreference .fp-reficons2 {
891     background: url('[[pix:theme|fp/alias]]') no-repeat;
892     background-position: bottom left;
894 .filemanager .fp-iconview .fp-file.fp-originalmissing .fp-thumbnail img {
895     display: none;
897 .filemanager .fp-iconview .fp-file.fp-originalmissing .fp-thumbnail {
898     background: url([[pix:s/dead]]) no-repeat;
899     background-position: center center;
901 // Table view (File Manager only)
902 .filemanager .yui3-datatable table {
903     border: 0 solid #BBBBBB;
904     width: 100%;
906 .filemanager .yui3-datatable-header {
907     background: #FFFFFF!important;
908     border-bottom: 1px solid #CCCCCC!important;
909     border-left: 0 solid #FFFFFF!important;
910     color: #555555!important;
912 .filemanager .yui3-datatable-odd .yui3-datatable-cell {
913     background-color: #F6F6F6!important;
914     border-left: 0 solid #F6F6F6;
916 .filemanager .yui3-datatable-even .yui3-datatable-cell {
917     background-color: #FFFFFF!important;
918     border-left: 0 solid #FFFFFF;
920 .filemanager .fp-filename-icon.fp-hasreferences .fp-reficons1{
921     background: url('[[pix:theme|fp/link_sm]]') no-repeat 0 0;
922     height: 100%;
923     width: 100%;
924     position: absolute;
925     top: 8px;
926     left: 17px;
927     z-index: 1000;
929 .filemanager .fp-filename-icon.fp-isreference .fp-reficons2 {
930     background: url('[[pix:theme|fp/alias_sm]]') no-repeat 0 0;
931     height: 100%;
932     width: 100%;
933     position: absolute;
934     top: 9px;
935     left: -6px;
936     z-index: 1001;
938 // Folder Context Menu (File Manager only)
939 .filemanager .fp-contextmenu {
940     display: none;
942 .filemanager .fp-iconview .fp-folder.fp-hascontextmenu .fp-contextmenu {
943     display: block;
944     position: absolute;
945     right: 7px;
946     bottom: 5px;
948 .filemanager .fp-treeview .fp-folder.fp-hascontextmenu .fp-contextmenu,
949 .filemanager .fp-tableview .fp-folder.fp-hascontextmenu .fp-contextmenu {
950     display: inline;
951     position: absolute;
952     left: 14px;
953     margin-right: -20px;
954     top: 6px;
956 .dir-rtl .filemanager .fp-iconview .fp-folder.fp-hascontextmenu .fp-contextmenu {
957     left: 7px;
958     right: inherit;
960 .dir-rtl .filemanager .fp-treeview .fp-folder.fp-hascontextmenu .fp-contextmenu,
961 .dir-rtl .filemanager .fp-tableview .fp-folder.fp-hascontextmenu .fp-contextmenu {
962     left: inherit;
963     right: 16px;
964     margin-right: 0;
967 // Drag and drop support (filemanager and filepicker form elements)
968 .filepicker-filelist .filepicker-container,
969 .filemanager.fm-noitems .fm-empty-container {
970     display: block;
971     position: absolute;
972     top: 10px;
973     bottom: 10px;
974     left: 10px;
975     right: 10px;
976     border: 2px dashed #BBBBBB;
977     padding-top: 85px;
978     text-align: center;
980 .filepicker-filelist .dndupload-target,
981 .filemanager-container .dndupload-target {
982     background: #FFFFFF;
983     position: absolute;
984     top: 10px;
985     bottom: 10px;
986     left: 10px;
987     right: 10px;
988     border: 2px dashed #fb7979;
989     padding-top: 85px;
990     text-align: center;
991     .box-shadow(0px 0 0 10px #fff);
993 .filepicker-filelist.dndupload-over .dndupload-target,
994 .filemanager-container.dndupload-over .dndupload-target {
995     background: #FFFFFF;
996     position: absolute;
997     top: 10px;
998     bottom: 10px;
999     left: 10px;
1000     right: 10px;
1001     border: 2px dashed #6c8cd3;
1002     padding-top: 85px;
1003     text-align: center;
1005 .dndupload-message {
1006     display: none;
1008 .dndsupported .dndupload-message {
1009     display: inline;
1011 .dnduploadnotsupported-message {
1012     display: none;
1014 .dndnotsupported .dnduploadnotsupported-message {
1015     display: inline;
1017 .dndupload-target {
1018     display: none;
1020 .dndsupported .dndupload-ready .dndupload-target {
1021     display: block;
1023 .dndupload-uploadinprogress {
1024     display: none;
1025     text-align: center;
1027 .dndupload-uploading .dndupload-uploadinprogress {
1028     display: block;
1030 .dndupload-arrow {
1031     background: url([[pix:theme|fp/dnd_arrow]]) center no-repeat;
1032     width: 100%;
1033     height: 80px;
1034     position: absolute;
1035     margin-left: -28px;
1036     top: 5px;
1038 .fitem.disabled .filepicker-container,
1039 .fitem.disabled .fm-empty-container {
1040     display: none;
1042 .dndupload-progressbars {
1043     padding: 10px;
1044     display: none;
1046 .dndupload-inprogress .dndupload-progressbars {
1047     display: block;
1049 .dndupload-inprogress .fp-content {
1050     display: none;
1052 .filemanager.fm-noitems .dndupload-inprogress .fm-empty-container {
1053     display: none;
1055 .filepicker-filelist.dndupload-inprogress .filepicker-container {
1056     display: none;
1058 .filepicker-filelist.dndupload-inprogress a {
1059     display: none;
1061 // Select Dialogue (File Manager only)
1062 .filemanager.fp-select .fp-select-loading {
1063     display: none;
1065 .filemanager.fp-select.loading .fp-select-loading {
1066     display: block;
1068 .filemanager.fp-select.loading form {
1069     display: none;
1071 .filemanager.fp-select.fp-folder .fp-license,
1072 .filemanager.fp-select.fp-folder .fp-author,
1073 .filemanager.fp-select.fp-file .fp-file-unzip,
1074 .filemanager.fp-select.fp-folder .fp-file-unzip,
1075 .filemanager.fp-select.fp-file .fp-file-zip,
1076 .filemanager.fp-select.fp-zip .fp-file-zip {
1077     display: none;
1079 .filemanager.fp-select .fp-file-setmain,
1080 .filemanager.fp-select .fp-file-setmain-help {
1081     display: none;
1083 .filemanager.fp-select.fp-cansetmain .fp-file-setmain,
1084 .filemanager.fp-select.fp-cansetmain .fp-file-setmain-help {
1085     display: inline-block;
1086     .ie7-inline-block();
1088 .filemanager .fp-mainfile .fp-filename {
1089     font-weight: bold;
1091 .filemanager.fp-select.fp-folder .fp-file-download {
1092     display: none;
1094 // to be implemented
1095 .fm-operation {
1096     font-weight: bold;
1098 .filemanager.fp-select .fp-original.fp-unknown,
1099 .filemanager.fp-select .fp-original .fp-originloading {
1100     display: none;
1102 .filemanager.fp-select .fp-original.fp-loading .fp-originloading {
1103     display: inline;
1105 .filemanager.fp-select .fp-reflist.fp-unknown,
1106 .filemanager.fp-select .fp-reflist .fp-reflistloading {
1107     display: none;
1109 .filemanager.fp-select .fp-refcount {
1110     max-width: 265px;
1112 .filemanager.fp-select .fp-reflist.fp-loading .fp-reflistloading {
1113     display: inline;
1115 .filemanager.fp-select .fp-reflist .fp-value {
1116     background: #F9F9F9;
1117     border: 1px solid #BBBBBB;
1118     padding: 8px 7px;
1119     margin: 0;
1120     max-width: 265px;
1121     max-height: 75px;
1122     overflow: auto;
1124 .filemanager.fp-select .fp-reflist .fp-value li {
1125     padding-bottom: 7px;
1127 // Create folder dialogue (File Manager only)
1128 .filemanager.fp-mkdir-dlg {
1129     text-align: center;
1131 .filemanager.fp-mkdir-dlg .fp-mkdir-dlg-text {
1132     text-align: left;
1133     margin: 20px;
1135 .dir-rtl .filemanager .fp-mkdir-dlg p {
1136     text-align: right;
1138 // Confirm dialogue for delete (File Manager only)
1139 .filemanager.fp-dlg {
1140     text-align: center;
1142 .filemanager.fp-dlg .fp-dlg-text {
1143     padding: 0 10px;
1144     min-width: 200px;
1145     max-width: 340px;
1146     max-height: 300px;
1147     overflow: auto;
1148     line-height: 22px;
1149     margin: 40px 20px 20px;
1150     font-size: 12px;
1152 // file picker search dialog
1153 .file-picker div.bd {
1154     text-align: left;
1156 // RTL Overrides
1157 .dir-rtl .file-picker div.bd,
1158 .dir-rtl .file-picker .fp-pathbar,
1159 .dir-rtl .file-picker .fp-list,
1160 .dir-rtl #filemenu .yuimenuitemlabel,
1161 .dir-rtl .filemanager-container .yui3-skin-sam .yui3-datatable-header {
1162     text-align: right;
1164 .dir-rtl .filepicker .yui-layout-unit-left {
1165     left: 500px;
1167 .dir-rtl .filepicker .yui-layout-unit-center {
1168     left: 0;