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