PluginProbe ʕ •ᴥ•ʔ
Folders – Unlimited Folders to Organize Media Library Folder, Pages, Posts, File Manager / 2.2.3
Folders – Unlimited Folders to Organize Media Library Folder, Pages, Posts, File Manager v2.2.3
3.1.9 3.1.8 3.1.7 2.9.3 2.9.4 2.9.5 2.9.6 2.9.7 2.9.8 3.0 3.0.1 3.0.2 3.0.3 3.0.4 3.0.5 3.0.6 3.0.7 3.0.8 3.0.9 3.1.0 3.1.1 3.1.2 3.1.3 3.1.4 3.1.5 3.1.6 trunk 1.3.7 2.0.1 2.0.2 2.0.3 2.0.4 2.0.5 2.1.1 2.1.2 2.1.3 2.1.4 2.1.5 2.1.6 2.1.7 2.1.8 2.1.9 2.2 2.2.1 2.2.2 2.2.3 2.2.4 2.2.5 2.2.6 2.2.7 2.2.8 2.2.9 2.3 2.3.1 2.3.2 2.3.3 2.3.4 2.3.5 2.3.6 2.3.7 2.3.8 2.3.9 2.4 2.4.1 2.4.2 2.4.3 2.4.4 2.4.5 2.4.6 2.4.7 2.4.8 2.4.9 2.5 2.5.1 2.5.2 2.5.3 2.5.4 2.5.5 2.5.6 2.5.7 2.5.8 2.5.9 2.6 2.6.1 2.6.2 2.6.3 2.6.4 2.6.5 2.6.6 2.6.7 2.6.8 2.6.9 2.7 2.7.1 2.7.2 2.7.3 2.7.4 2.7.5 2.8 2.8.1 2.8.2 2.8.3 2.8.4 2.8.5 2.8.6 2.8.7 2.8.8 2.8.9 2.9 2.9.1 2.9.2
folders / assets / css / design.css
folders / assets / css Last commit date
admin-setting.css 6 years ago design.css 6 years ago folder-icon.css 7 years ago media.css 6 years ago
design.css
1120 lines
1 .wcp-custom-menu {
2 padding-left: 0px;
3
4 }
5
6 .wcp-custom-menu {
7 position: relative;
8 }
9
10 .wcp-container ul {
11 list-style: none;
12 }
13
14 .wcp-container .route {
15 position: relative;
16 list-style-type: none;
17 border: 0;
18 margin: 0;
19 padding: 0;
20 top: 0px;
21 margin-top: 0px;
22 max-height: 100% !important;
23 width: 100%;
24 border-radius: 2px;
25 z-index: -1;
26 background: transparent;
27 }
28
29 .wcp-container .route span {
30 position: absolute;
31 top: 2px;
32 left: 0;
33 z-index: 10;
34 width: 20px;
35 height: 18px;
36 text-indent: 0;
37 font-size: 20px;
38 background: no-repeat;
39 }
40
41 .wcp-container .route .title {
42 position: absolute;
43 border: 0;
44 margin: 0;
45 padding: 0;
46 padding-top: 0px;
47 height: 30px;
48 width: 200px;
49 text-indent: 30px;
50 background: transparent;
51 border-radius: 0px;
52 box-shadow: none;
53 font-size: 14px;
54 line-height: 26px;
55 border-radius: 4px;
56 -webkit-border-radius: 4px;
57 -moz-border-radius: 4px;
58 overflow: hidden;
59 }
60
61 .wcp-container .first-title {
62 margin-left: 10px;
63 }
64
65 .wcp-container .space {
66 position: relative;
67 list-style-type: none;
68 border: 0;
69 margin: 0 0 0 20px;
70 padding: 0 0 30px 0;
71 width: 40px;
72 top: 30px;
73 height: 100%;
74 z-index: 1;
75 }
76
77 .wcp-container .first-space {
78 margin-left: 10px;
79 }
80
81 i.fa-caret-right {
82 transition: 0.1s;
83 -webkit-transition: 0.1s;
84 -moz-transition: 0.1s;
85 }
86
87 li.active > span > i.fa-caret-right {
88 transform: rotate(90deg);
89 -webkit-transform: rotate(90deg);
90 -moz-transform: rotate(90deg);
91 }
92
93 li.active > span > i.fa-folder:before {
94 content: "\f07c";
95 }
96
97 .has-sub-tree > ul.ui-sortable li {
98 display: none;
99 }
100
101 .has-sub-tree.active > ul.ui-sortable > li {
102 display: block;
103 }
104
105 .nav-icon {
106 display: none;
107 left: -20px !important;
108 }
109
110 .has-sub-tree > .nav-icon {
111 display: block;
112 }
113
114 .wcp-content {
115 position: fixed !important;
116 top: 32px;
117 left: 160px;
118 bottom: 0;
119 width: 305px;
120 box-sizing: border-box;
121 z-index: 1;
122 direction: ltr;
123 transition: all 0.15s linear;
124 -webkit-transition: all 0.15s linear;
125 -moz-transition: all 0.15s linear;
126 }
127 html[dir="rtl"] .wcp-content {
128 left: auto;
129 right: 160px;
130 }
131 body.folded .wcp-content {
132 left: 36px;
133 }
134 html[dir="rtl"] body.folded .wcp-content {
135 left: auto;
136 right: 36px;
137 }
138 body.wp-admin #wpcontent {
139 padding-left: 310px;
140 transition: all 0.15s linear;
141 -webkit-transition: all 0.15s linear;
142 -moz-transition: all 0.15s linear;
143 }
144 html[dir="rtl"] body.wp-admin #wpcontent {
145 padding-left: 0px;
146 padding-right: 320px;
147 }
148 .wcp-container {
149 padding: 20px 20px 20px 16px;
150 }
151 .form-title {
152 font-size: 23px;
153 font-weight: 400;
154 margin: 0;
155 padding: 0 0 10px 0;
156 line-height: 29px;
157 }
158 .form-operations {
159 border: solid 1px #e5e5e5;
160 border-right: none;
161 margin-bottom: 20px;
162 }
163 .form-operations ul {
164 margin: 0;
165 padding: 0 ;
166 }
167 .form-operations li {
168 display: block;
169 float: left;
170 width: 20%;
171 text-align: center;
172 background: #fff;
173 margin: 0;
174 padding: 0;
175 }
176 .form-operations li a {
177 display: block;
178 padding: 10px 0;
179 border-right: solid 1px #e5e5e5;
180 font-size: 16px;
181 color: #727272;
182 }
183 .clearfix {
184 clear: both;
185 }
186 .wcp-parent-data {
187 position: relative;
188 }
189 .wcp-parent {
190 position: absolute;
191 left: -21px;
192 font-weight: bold;
193 font-size: 14px;
194 }
195 .wcp-parent .fa {
196 font-size: 18px;
197 margin-right: 8px;
198 }
199 .wcp-form-data {
200 background: #fff;
201 border: solid 1px #f1f1f1;
202 padding: 15px;
203 display: none;
204 margin-bottom: 20px;
205 }
206 .wcp-form-title {
207 color: #727272;
208 font-size: 14px;
209 text-transform: uppercase;
210 padding: 0 0 10px 0;
211 }
212 .wcp-form-data .form-field {
213 padding: 0 0 10px 0;
214 }
215
216 .wcp-form-data .form-field input, .wcp-form-data .form-field select {
217 width: 100%;
218 }
219 button#wcp-save-folder {
220 float: right;
221 }
222 .wcp-form-message span {
223 display: block;
224 padding: 5px 10px;
225 background: #ffabab;
226 margin-bottom: 10px;
227 color: #000;
228 border: solid 1px #8c0000;
229 border-radius: 4px;
230 }
231 .wcp-container .route.active-item > h3.title {
232 background: #008ec2;
233 color: #fff;
234 border-radius: 4px;
235 }
236 .wcp-container .route span.ui-icon {
237 line-height: 24px;
238 font-size: 18px;
239 cursor: move;
240 left: 5px;
241 top: 2px;
242 }
243 .route.active-item > span.ui-icon {
244 background: #008ec2;
245 color: #fff;
246 }
247 #custom-menu.active > ul > li.route {
248 display: block;
249 }
250 .wcp-parent.active > i.fa-caret-right {
251 transform: rotate(90deg);
252 -webkit-transform: rotate(90deg);
253 -moz-transform: rotate(90deg);
254 }
255 .wcp-parent.active > i.fa-folder:before {
256 content: "\f07c";
257 }
258 .wcp-container .route .title:hover {
259 background: #dfdfdf;
260 cursor: pointer;
261 }
262 body.no-hover-css .wcp-container .route .title:hover {
263 background: transparent;
264 }
265 .add-new-folder {
266 text-decoration: none;
267 display: block;
268 float: right;
269 font-size: 14px;
270 padding: 4px 10px;
271 background: #F51366;
272 color: #fff;
273 border: solid 1px #F51366;
274 border-radius: 3px;
275 line-height: 24px;
276 -webkit-box-shadow: 0 3px 5px -3px #333333;
277 -moz-box-shadow: 0 3px 5px -3px #333333;
278 box-shadow: 0 3px 5px -3px #333333;
279 }
280 .add-new-folder:hover, .add-new-folder:focus {
281 background: #bc0f50;
282 color: #ffffff;
283 border: solid 1px #bc0f50
284 }
285 .add-new-folder span {
286 display: block;
287 float: left;
288 line-height: 20px;
289 font-size: 14px;
290 margin-right: 5px;
291 }
292 .add-new-folder span.folder-icon-create_new_folder {
293 font-size: 20px;
294 }
295 .form-options {
296 background: #fff;
297 padding: 10px 10px 0 10px;
298 margin: 10px 0 0px;
299 }
300 .form-options ul {
301 margin: 0;
302 padding: 0;
303 }
304 .form-options li {
305 display: inline-block;
306 margin: 0 5px 0 0;
307 vertical-align: top;
308 }
309 .form-options li.last {
310 margin: 0;
311 }
312 .form-options li a {
313 display: inline-block;
314 text-decoration: none;
315 padding: 5px 12px;
316 color: #000;
317 background: #ccc;
318 box-shadow: 0 1px 0 #ccc;
319 vertical-align: middle;
320 border: solid 1px #ccc;
321 border-radius: 3px;
322 margin: 0 0 10px 0;
323 }
324 .form-options li.last a {
325 padding: 3px;
326 }
327 .form-options li.last a span.icon{
328 font-size: 28px;
329 line-height: 22px;
330 }
331 a#expand-collapse-list.all-open span:before {
332 content: "\e911";
333 }
334 .form-options li a:hover {
335 background: #404040;
336 color: #ffffff;
337 border: solid 1px #404040;
338 }
339 .form-options span.icon {
340 font-size: 18px;
341 display: inline-block;
342 vertical-align: top;
343 }
344 .header-posts a, .un-categorised-items a {
345 color: #444444;
346 padding: 7px;
347 border-radius: 3px;
348 display: block;
349 text-decoration: none;
350 font-size: 14px;
351 line-height: 18px;
352 }
353 .header-posts a:hover, .un-categorised-items:hover {
354 background: #dfdfdf;
355 }
356 span.total-count {
357 float: right;
358 background: #fff;
359 padding: 0 5px;
360 border: solid 1px #cccccc;
361 font-size: 10px;
362 line-height: 16px;
363 border-radius: 2px;
364 }
365 .wcp-icon {
366 display: inline-block;
367 font-size: 16px;
368 vertical-align: top;
369 margin-right: 3px;
370 }
371 #custom-menu .wcp-icon {
372 font-size: 20px;
373 line-height: 24px;
374 }
375 .route.active > .nav-icon > .folder-icon-arrow_right {
376 transform: rotate(90deg);
377 -webkit-transform: rotate(90deg);
378 -moz-transform: rotate(90deg);
379 }
380
381 .route.active > .ui-icon > .folder-icon-folder:before {
382 content: "\e90c";
383 }
384
385 .wcp-container .route span.total-count {
386 position: relative;
387 font-size: 8px;
388 float: right;
389 text-align: center;
390 width: auto;
391 background: #fff;
392 display: block;
393 margin: 6px 3px 3px 3px;
394 color: #23282d !important;
395 line-height: 16px;
396 height: 16px;
397 }
398 .dynamic-menu {
399 position: absolute;
400 left: 50px;
401 background: #fff;
402 width: 140px;
403 padding: 0;
404 z-index: 101;
405 -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
406 -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
407 box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
408 }
409 .dynamic-menu li {
410 position: relative;
411 display: block !important;
412 padding: 2px 0;
413 margin: 0;
414 }
415 .dynamic-menu a {
416 text-decoration: none;
417 color: #848484;
418 position: relative;
419 display: block;
420 padding: 5px 10px;
421 }
422 .wcp-container .route .dynamic-menu ul > li > a > span, .wcp-container .route .dynamic-menu ul > li > a > span span {
423 position: relative;
424 top: auto;
425 display: inline-block;
426 vertical-align: top;
427 margin-right: 5px;
428 }
429 .wcp-container .route .dynamic-menu ul > li > a > span span {
430 top: auto;
431 height: auto;
432 width: auto;
433 margin: 0;
434 left: auto;
435 vertical-align: baseline;
436 display: inline;
437 }
438 .dynamic-menu li.new-folder {
439 border-bottom: solid 1px #d8d8d8;
440 }
441 .dynamic-menu a:hover {
442 background: #efefef;
443 color: #000;
444 }
445 .wcp-form-input {
446 padding-left: 35px;
447 box-sizing: border-box;
448 position: relative;
449 }
450 .wcp-form-input input {
451 width: 100%;
452 }
453 .wcp-form-btn {
454 padding: 4px 0 4px 2px;
455 }
456 .wcp-form-input:before {
457 content: "\e90d";
458 font-family: 'folder-icon' !important;
459 speak: none;
460 position: absolute;
461 left: 0;
462 font-size: 28px;
463 top: 5px;
464 }
465 .add-new-folder-btn {
466 margin-right: 5px !important;
467 }
468 .form-loader {
469 width: 100%;
470 height: 5px;
471 margin: 0 0 20px;
472 }
473 .form-loader-count {
474 width: 0;
475 height: 5px;
476 background: url("../images/form-loader.png");
477 transition: all 2.5s linear;
478 -webkit-transition: all 2s linear;
479 -moz-transition: all 2.5s linear;
480 }
481 .route.is-high > .ui-icon > i:before {
482 content: "\e900" !important
483 }
484 .route.is-high.active > .ui-icon > i:before {
485 content: "\e90c" !important;
486 z-index: 11;
487 color: #444;
488 font-size: 20px;
489 }
490 .route.is-high.active > .ui-icon > i:after {
491 content: "\e907";
492 margin-left: -1.2em;
493 color: #444;
494 font-size: 11px;
495 top: 1px;
496 position: absolute;
497 }
498 .route.is-high.active.active-item > .ui-icon > i:before, .route.is-high.active.active-item > .ui-icon > i:after {
499 color: #ffffff;
500 }
501 li.active-menu {
502 z-index: 2 !important;
503 }
504 th#wcp_move {
505 width: 20px;
506 }
507 td.wcp_move.column-wcp_move {
508 vertical-align: middle;
509 opacity: 0;
510 }
511 .wp-list-table tr:hover .column-wcp_move:hover, .wp-list-table td.wcp_move.column-wcp_move.wcp-draggable {
512 opacity: 1;
513 }
514 .wcp-drop-hover {
515 background: #0073aa !important;
516 z-index: 2 !important;
517 color: #fff !important;
518 }
519 .wcp-drop-hover span {
520 color: #fff !important;
521 }
522 .ui-draggable-dragging {
523 z-index: 1051 !important;
524 }
525
526 .wcp-hover-list {
527 background: #008ec2 !important;
528 color: #fff;
529 position: relative;
530 }
531 .wcp-hover-list a {
532 color: #fff;
533 }
534 .wcp-hover-list span.total-count {
535 color: #000;
536 }
537 span.wcp-item {
538 display: none;
539 }
540 .wcp-move-file {
541 cursor: move;
542 }
543 .wcp-drop-hover-list a.folder-view {
544 background: #008ec2;
545 color: #fff;
546 border: solid 1px #fff;
547 position: relative;
548 }
549 .tree-structure .folder-view {
550 display: block;
551 border: 1px solid #dadce0;
552 color: #404040;
553 border-radius: 4px;
554 -moz-border-radius: 4px;
555 -webkit-border-radius: 4px;
556 position: relative;
557 cursor: pointer;
558 background: #fff;
559 }
560 .tree-structure .folder-view:hover {
561 background: #008ec2;
562 color: #ffffff;
563
564 }
565 .wcp-drop-hover-list a.folder-view:before {
566 width: 100%;
567 height: 100%;
568 content: "";
569 position: absolute;
570 top: -2px;
571 left: -2px;
572 border: solid 1px #008ec2;
573 padding: 1px;
574 border-radius: 4px;
575 -moz-border-radius: 4px;
576 -webkit-border-radius: 4px;
577 }
578 .ui-draggable-dragging.wcp-move-file {
579 z-index: 5001;
580 display: inline-block;
581 border: solid 2px #0073aa;
582 padding: 5px 10px;
583 border-radius: 5px;
584 background: #e4f6ff;
585 z-index: 2001;
586 position: fixed !important;
587 max-width: 230px;
588 overflow: hidden;
589 width: auto !important;
590 }
591 .ui-draggable-dragging.wcp-move-file span {
592 display: block;
593 float: left;
594 }
595 .ui-draggable-dragging.wcp-move-file span.wcp-move {
596 margin-right: 5px;
597 display: block;
598 float: left;
599 }
600 .wcp-container .route span.title-text {
601 position: relative;
602 top: auto;
603 left: auto;
604 width: auto;
605 display: inline-block;
606 font-size: 16px;
607 line-height: 30px;
608 height: 30px;
609 }
610 .ui-resizable-handle.ui-resizable-e {
611 position: absolute;
612 top: 0;
613 height: 100%;
614 height: 100vh;
615 width: 1px;
616 right: 0;
617 border-right: 1px solid #ccc;
618 cursor: col-resize;
619 }
620 .ui-resizable-handle.ui-resizable-e:before, .ui-resizable-handle.ui-resizable-w:before {
621 content: "";
622 top: 68px;
623 width: 3px;
624 height: 53px;
625 position: absolute;
626 border-left: solid 1px #ccc;
627 border-right: solid 1px #ccc;
628 left: -1px;
629 }
630 .ui-resizable-handle.ui-resizable-w {
631 position: absolute;
632 top: 0;
633 height: 100%;
634 height: 100vh;
635 width: 1px;
636 left: 0;
637 border-right: 1px solid #ccc;
638 cursor: col-resize;
639 }
640
641 div#custom-menu {
642 padding-bottom: 120px;
643 }
644 .wcp-container .route span.star-icon {
645 position: relative;
646 top: 2px;
647 left: auto;
648 float: right;
649 font-family: 'folder-icon' !important;
650 speak: none;
651 color: #ffc90e;
652 display: none;
653 }
654 .wcp-container .route span.update-inline-record {
655 position: relative;
656 left: auto;
657 top: 2px;
658 float: right;
659 width: 0px;
660 height: 22px;
661 font-family: 'folder-icon' !important;
662 font-size: 16px;
663 overflow: hidden;
664 transition: all 0.25s linear;
665 -webkit-transition: all 0.25s linear;
666 -moz-transition: all 0.25s linear;
667 }
668 .wcp-container .route h3:hover > span.update-inline-record {
669 width: 18px;
670 }
671 .wcp-container .route span.update-inline-record:after {
672 content: "\e910";
673 }
674 .wcp-container .route.is-high > h3 > span.star-icon {
675 display: block;
676 }
677 .wcp-container .route span.star-icon:after {
678 content: "\e907";
679 }
680
681 .tree-structure li {
682 display: block;
683 width: 16.667%;
684 float: left;
685 margin: 0;
686 padding: 0;
687 }
688 .tree-structure .folder-item {
689 padding: 8px;
690 position: relative;
691 }
692 .tree-structure .folder-view {
693 display: block;
694 border: 1px solid #dadce0;
695 color: #404040;
696 border-radius: 4px;
697 -moz-border-radius: 4px;
698 -webkit-border-radius: 4px;
699 position: relative;
700 cursor: pointer;
701 background: #fff;
702 }
703 .tree-structure .folder-view span.item-name {
704 display: block;
705 padding: 10px 25px 10px 50px;
706 position: relative;
707 width: 100%;
708 overflow: hidden;
709 height: 38px;
710 font-size: 16px;
711 box-sizing: border-box;
712 }
713 .folder-view span.item-name:before {
714 content: "\e90d";
715 font-family: 'folder-icon' !important;
716 position: absolute;
717 left: 15px;
718 font-size: 24px;
719 }
720 .folder-view.is-high span.item-name:before {
721 content: "\e900";
722 }
723 .folder-view.is-post span.item-name:before {
724 content: "\e901";
725 }
726 .tree-structure span.folder-option {
727 position: absolute;
728 right: 0;
729 font-family: 'folder-icon' !important;
730 top: 0px;
731 font-size: 20px;
732 line-height: 38px;
733 z-index: 1;
734 cursor: pointer;
735 display: none;
736 }
737 .tree-structure .folder-view:hover span.folder-option {
738 display: block;
739 }
740 .tree-structure span.folder-option:hover {
741 color: #F51366;
742 }
743 .tree-structure span.folder-option:after {
744 content: "\e90a";
745 }
746 .tree-structure li {
747 position: relative;
748 }
749 .tree-structure {
750 margin-left: -8px;
751 margin-right: -8px;
752 }
753 .tree-structure .folder-view span.folder-title {
754 overflow: hidden;
755 width: 100%;
756 height: 18px;
757 display: block;
758 }
759 .swal2-popup .swal2-title {
760 line-height: 36px;
761 }
762 .attachments-browser.ui-draggable-dragging .media-sidebar, .attachments-browser.ui-draggable-dragging .uploader-inline, .attachments-browser.ui-draggable-dragging .media-toolbar, .attachments-browser.ui-draggable-dragging ul.attachments {
763 display: none;
764 }
765 .attachments.ui-sortable.ui-draggable-dragging {
766 z-index: 5000;;
767 }
768 .selected-items {
769 background: #0073aa;
770 color: #ffffff;
771 padding: 10px 20px;
772 border-radius: 5px;
773 -moz-border-radius: 5px;
774 -webkit-border-radius: 5px;
775 margin-top: 0px;
776 cursor: none;
777 }
778 .media-frame, .media-frame-content, .media-frame .attachments-browser {
779 overflow: inherit;
780 }
781 body.upload-php.eml-grid #wpbody {
782 position: relative !important;
783 top: 0px !important;
784 bottom: auto !important;
785 left: auto !important;
786 right: auto !important;;
787 height: auto;
788 }
789 span.upgrade-message {
790 padding: 0px 0 10px;
791 background: #fff;
792 display: inline-block;
793 font-size: 14px;
794 color: #000;
795 }
796 span.upgrade-message a.pink, span.upgrade-message span.pink {
797 color: #FF5983;
798 text-decoration: none;
799 font-weight: bold;
800 }
801
802 .media-toolbar.sticky-media {
803 position: fixed;
804 top: 32px;
805 right: 18px !important;
806 left: auto;
807 }
808
809 .media-position {
810 width: 1px;
811 height: 1px;
812 }
813 .media-frame.mode-grid .media-toolbar {
814 margin: 0 !important;
815 }
816 .button-disabled {
817 cursor: no-drop;
818 pointer-events: none;
819 }
820 .wcp-hide-show-buttons {
821 position: absolute;
822 top: 25px;
823 right: -20px;
824 }
825 .wcp-hide-show-buttons .toggle-buttons {
826 background: #f51366;
827 color: #fff;
828 display: inline-block;
829 margin: 0;
830 padding: 0;
831 float: left;
832 -webkit-border-top-right-radius: 50%;
833 -webkit-border-bottom-right-radius: 50%;
834 -moz-border-radius-topright: 50%;
835 -moz-border-radius-bottomright: 50%;
836 border-top-right-radius: 50%;
837 border-bottom-right-radius: 50%;
838 display: none;
839 width: 20px;
840 height: 20px;
841 cursor: pointer;
842 }
843 .wcp-hide-show-buttons .toggle-buttons:hover {
844 background: #bc0f50;
845 }
846 .hide-folders-area .wcp-content {
847 width: 0px !important;
848 }
849 .hide-folders-area .wcp-container {
850 display: none;
851 }
852
853 .wcp-hide-show-buttons .toggle-buttons.active {
854 display: block;
855 }
856 #wcp-content.no-transition .wcp-container {
857 display: none;
858 }
859 button.button.organize-button {
860 vertical-align: middle;
861 text-decoration: none;
862 display: inline-block;
863 font-size: 14px;
864 padding: 4px 10px;
865 background: #F51366;
866 color: #fff;
867 border: solid 1px #F51366;
868 border-radius: 3px;
869 line-height: 14px;
870 -webkit-box-shadow: 0 3px 5px -3px #333333;
871 -moz-box-shadow: 0 3px 5px -3px #333333;
872 box-shadow: 0 3px 5px -3px #333333;
873 }
874 button.button.organize-button:hover, button.button.organize-button:focus {
875 background: #bc0f50;
876 color: #ffffff;
877 border: solid 1px #bc0f50;
878 }
879 .tree-structure-content ul {
880 margin: 0;
881 padding: 0;
882 }
883 .tree-structure-content {
884 padding: 10px 20px 10px;
885 background: #fff;
886 margin: 10px 0 15px;
887 border-radius: 4px;
888 -moz-border-radius: 4px;
889 -webkit-border-radius: 4px;
890 border: solid 1px #cccccc;
891 }
892 .tree-structure-content .tree-structure {
893 height: 55px;
894 overflow: hidden;
895 transition: 0.1s;
896 -webkit-transition: 0.1s;
897 -moz-transition: 0.1s;
898 }
899 .tree-structure-content.active .tree-structure {
900 height: auto;
901 }
902 .folders-toggle-button {
903 height: 15px;
904 text-align: center;
905 position: relative;
906 }
907 .folders-toggle-button span {
908 background: #F51366;
909 color: #fff;
910 height: 20px;
911 width: 30px;
912 text-align: center;
913 display: block;
914 margin: 0 auto;
915 position: absolute;
916 left: 0;
917 right: 0;
918 bottom: -10px;
919 cursor: pointer;
920 font-family: dashicons;
921 font-size: 20px;
922 line-height: 20px;
923 }
924 .folders-toggle-button span:after {
925 content: "\f347";
926 }
927 .tree-structure-content.active .folders-toggle-button span:after {
928 content: "\f343";
929 }
930 span.media-info-message {
931 vertical-align: middle;
932 line-height: 50px;
933 font-weight: bold;
934 color: #f51366;
935 padding: 0 0 0 20px;
936 display: none !important;;
937 }
938 span.media-info-message.active {
939 display: inline-block !important;
940 }
941
942 /* custom popup css */
943 .folder-popup-form {
944 position: fixed;
945 width: 100%;
946 height: 100%;
947 background: rgba(0,0,0,0.5);
948 top: 0;
949 left: 0;
950 z-index: 10001;
951 display: none;
952 }
953 .folder-popup-form.disabled {
954 pointer-events: none;
955 }
956 .popup-form-content {
957 background: #ffffff;
958 min-height: 100px;
959 width: 400px;
960 text-align: center;
961 margin: 0 auto;
962 position: absolute;
963 left: 0;
964 right: 0;
965 top: 50%;
966 transform: translate(0, -50%);
967 -webkit-transform: translate(0, -50%);
968 -moz-transform: translate(0, -50%);
969 -o-transform: translate(0, -50%);
970 -ms-transform: translate(0, -50%);
971 padding: 20px;
972 -webkit-border-radius: 10px;
973 -moz-border-radius: 10px;
974 border-radius: 10px;
975 }
976 .folder-form-buttons a {
977 display: inline-block;
978 padding: 10px 20px;
979 text-decoration: none;
980 margin: 10px 3px;
981 font-size: 18px;
982 line-height: 22px;
983 border-radius: .25em;
984 color: #ffffff;
985 }
986 .folder-form-buttons a span {
987 -webkit-animation: fa-spin 0.75s infinite linear;
988 animation: fa-spin 0.75s infinite linear;
989 }
990 @-webkit-keyframes fa-spin {
991 0% {
992 -webkit-transform: rotate(0deg);
993 transform: rotate(0deg);
994 }
995 100% {
996 -webkit-transform: rotate(359deg);
997 transform: rotate(359deg);
998 }
999 }
1000 .folder-form-buttons a:hover, .folder-form-buttons a:focus {
1001 color: #ffffff;
1002 background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.1));
1003 }
1004 .folder-form-buttons a:focus {
1005 outline: 0;
1006 box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(50,100,150,.4);
1007 }
1008 .form-cancel-btn {
1009 background-color: #aaaaaa;
1010 }
1011 .form-submit-btn {
1012 background-color: #3085d6;
1013 }
1014 .add-update-folder-title {
1015 display: block;
1016 position: relative;
1017 max-width: 100%;
1018 margin: 0 0 .4em;
1019 padding: 0;
1020 color: #595959;
1021 font-size: 1.875em;
1022 font-weight: 600;
1023 text-align: center;
1024 text-transform: none;
1025 word-wrap: break-word;
1026 line-height: 30px;
1027 }
1028 .folder-form-input input {
1029 width: 100%;
1030 transition: border-color .3s,box-shadow .3s;
1031 border: 1px solid #d9d9d9;
1032 border-radius: .1875em;
1033 font-size: 1.125em;
1034 box-shadow: inset 0 1px 1px rgba(0,0,0,.06);
1035 box-sizing: border-box;
1036 height: 2.625em;
1037 padding: 0 .75em;
1038 margin: 1em auto;
1039 }
1040 .folder-form-message {
1041 font-size: 16px;
1042 line-height: 20px;
1043 margin: 25px 0;
1044 }
1045 .folder-form-errors {
1046 margin: 0 0 10px 0;
1047 padding: 8px 0;
1048 background: #ffe4e4;
1049 color: #a20000;
1050 display: none;
1051 }
1052 .folder-form-errors.active {
1053 display: block;
1054 }
1055
1056
1057 @media screen and (max-width: 1300px) {
1058 .tree-structure li {
1059 width: 20%;
1060 }
1061 }
1062 @media screen and (max-width: 960px) {
1063 .wcp-content {
1064 left: 36px;
1065 }
1066 html[dir="rtl"] .wcp-content {
1067 right: 36px;
1068 left: auto;
1069 }
1070 .tree-structure li {
1071 width: 25%;
1072 }
1073 }
1074
1075 @media screen and (max-width: 780px) {
1076 .wcp-content {
1077 left: 0px;
1078 }
1079 html[dir="rtl"] .wcp-content {
1080 right: 0px;
1081 }
1082 .tree-structure li {
1083 width: 33.33%;
1084 }
1085 }
1086
1087
1088 @media screen and (max-width: 640px) {
1089 .wcp-content {
1090 left: 0px;
1091 position: relative !important;
1092 width: 100% !important;
1093 padding-bottom: 100px;
1094 top: 0;
1095 right: 0;
1096 display: block;
1097 }
1098 .ui-resizable-handle.ui-resizable-e {
1099 display: none !important;
1100 }
1101 .hide-folders-area .wcp-container {
1102 display: block;
1103 }
1104 .wcp-hide-show-buttons {
1105 display: none;
1106 }
1107 .hide-folders-area .wcp-content {
1108 width: 100% !important;
1109 }
1110 body.wp-admin #wpcontent {
1111 padding: 0 !important;
1112 }
1113 #wpbody-content {
1114 padding-bottom: 30px;
1115 }
1116 .tree-structure li {
1117 width: 50%;
1118 }
1119 }
1120