PluginProbe ʕ •ᴥ•ʔ
Folders – Unlimited Folders to Organize Media Library Folder, Pages, Posts, File Manager / 2.3
Folders – Unlimited Folders to Organize Media Library Folder, Pages, Posts, File Manager v2.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
1159 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 height: 26px;
243 }
244 .route.active-item > span.ui-icon {
245 background: #008ec2;
246 color: #fff;
247 }
248 #custom-menu.active > ul > li.route {
249 display: block;
250 }
251 .wcp-parent.active > i.fa-caret-right {
252 transform: rotate(90deg);
253 -webkit-transform: rotate(90deg);
254 -moz-transform: rotate(90deg);
255 }
256 .wcp-parent.active > i.fa-folder:before {
257 content: "\f07c";
258 }
259 .wcp-container .route .title img {
260 display: none;
261 width: 14px;
262 height: 14px;
263 margin: 5px auto 0;
264 }
265 .wcp-container .route .title:hover {
266 background: #dfdfdf;
267 cursor: pointer;
268 }
269 .wcp-container .route .title:hover img {
270 display: block;
271 }
272 .wcp-container .route .title:hover .ui-icon i {
273 display: none;
274 }
275 body.no-hover-css .wcp-container .route .title:hover {
276 background: transparent;
277 }
278 .add-new-folder {
279 text-decoration: none;
280 display: block;
281 float: right;
282 font-size: 14px;
283 padding: 4px 10px;
284 background: #F51366;
285 color: #fff;
286 border: solid 1px #F51366;
287 border-radius: 3px;
288 line-height: 24px;
289 -webkit-box-shadow: 0 3px 5px -3px #333333;
290 -moz-box-shadow: 0 3px 5px -3px #333333;
291 box-shadow: 0 3px 5px -3px #333333;
292 }
293 .add-new-folder:hover, .add-new-folder:focus {
294 background: #bc0f50;
295 color: #ffffff;
296 border: solid 1px #bc0f50
297 }
298 .add-new-folder span {
299 display: block;
300 float: left;
301 line-height: 20px;
302 font-size: 14px;
303 margin-right: 5px;
304 }
305 .add-new-folder span.folder-icon-create_new_folder {
306 font-size: 20px;
307 }
308 .form-options {
309 background: #fff;
310 padding: 10px 10px 0 10px;
311 margin: 10px 0 0px;
312 }
313 .form-options ul {
314 margin: 0;
315 padding: 0;
316 }
317 .form-options li {
318 display: inline-block;
319 margin: 0 5px 0 0;
320 vertical-align: top;
321 }
322 .form-options li.last {
323 margin: 0;
324 }
325 .form-options li a {
326 display: inline-block;
327 text-decoration: none;
328 padding: 5px 12px;
329 color: #000;
330 background: #ccc;
331 box-shadow: 0 1px 0 #ccc;
332 vertical-align: middle;
333 border: solid 1px #ccc;
334 border-radius: 3px;
335 margin: 0 0 10px 0;
336 }
337 .form-options li.last a {
338 padding: 3px;
339 }
340 .form-options li.last a span.icon{
341 font-size: 28px;
342 line-height: 22px;
343 }
344 a#expand-collapse-list.all-open span:before {
345 content: "\e911";
346 }
347 .form-options li a:hover {
348 background: #404040;
349 color: #ffffff;
350 border: solid 1px #404040;
351 }
352 .form-options span.icon {
353 font-size: 18px;
354 display: inline-block;
355 vertical-align: top;
356 }
357 .un-categorised-items {
358 border-radius: 3px;
359 }
360 .header-posts a, .un-categorised-items a {
361 color: #444444;
362 padding: 7px;
363 border-radius: 3px;
364 display: block;
365 text-decoration: none;
366 font-size: 14px;
367 line-height: 18px;
368 }
369 .header-posts a:hover, .un-categorised-items:hover, .un-categorised-items.active-item {
370 background: #dfdfdf;
371 border-radius: 3px;
372 }
373 .header-posts a.active-item, .un-categorised-items.active-item {
374 background: #008ec2 !important;
375 color: #fff !important;
376 }
377 .un-categorised-items.active-item a {
378 color: #fff !important;
379 }
380 .un-categorised-items.active-item a span, .header-posts a.active-item span.total-count {
381 color: #444444 !important;
382 }
383 span.total-count {
384 float: right;
385 background: #fff;
386 padding: 0 5px;
387 border: solid 1px #cccccc;
388 font-size: 10px;
389 line-height: 16px;
390 border-radius: 2px;
391 }
392 .wcp-icon {
393 display: inline-block;
394 font-size: 16px;
395 vertical-align: top;
396 margin-right: 3px;
397 }
398 #custom-menu .wcp-icon {
399 font-size: 20px;
400 line-height: 24px;
401 }
402 .route.active > .nav-icon > .folder-icon-arrow_right {
403 transform: rotate(90deg);
404 -webkit-transform: rotate(90deg);
405 -moz-transform: rotate(90deg);
406 }
407
408 .route.active > .ui-icon > .folder-icon-folder:before {
409 content: "\e90c";
410 }
411
412 .wcp-container .route span.total-count {
413 position: relative;
414 font-size: 8px;
415 float: right;
416 text-align: center;
417 width: auto;
418 background: #fff;
419 display: block;
420 margin: 6px 3px 3px 3px;
421 color: #23282d !important;
422 line-height: 16px;
423 height: 16px;
424 }
425 .dynamic-menu {
426 position: absolute;
427 left: 50px;
428 background: #fff;
429 width: 140px;
430 padding: 0;
431 z-index: 101;
432 -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
433 -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
434 box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
435 }
436 .dynamic-menu li {
437 position: relative;
438 display: block !important;
439 padding: 2px 0;
440 margin: 0;
441 }
442 .dynamic-menu a {
443 text-decoration: none;
444 color: #848484;
445 position: relative;
446 display: block;
447 padding: 5px 10px;
448 }
449 .wcp-container .route .dynamic-menu ul > li > a > span, .wcp-container .route .dynamic-menu ul > li > a > span span {
450 position: relative;
451 top: auto;
452 display: inline-block;
453 vertical-align: top;
454 margin-right: 5px;
455 }
456 .wcp-container .route .dynamic-menu ul > li > a > span span {
457 top: auto;
458 height: auto;
459 width: auto;
460 margin: 0;
461 left: auto;
462 vertical-align: baseline;
463 display: inline;
464 }
465 .dynamic-menu li.new-folder {
466 border-bottom: solid 1px #d8d8d8;
467 }
468 .dynamic-menu a:hover {
469 background: #efefef;
470 color: #000;
471 }
472 .wcp-form-input {
473 padding-left: 35px;
474 box-sizing: border-box;
475 position: relative;
476 }
477 .wcp-form-input input {
478 width: 100%;
479 }
480 .wcp-form-btn {
481 padding: 4px 0 4px 2px;
482 }
483 .wcp-form-input:before {
484 content: "\e90d";
485 font-family: 'folder-icon' !important;
486 speak: none;
487 position: absolute;
488 left: 0;
489 font-size: 28px;
490 top: 5px;
491 }
492 .add-new-folder-btn {
493 margin-right: 5px !important;
494 }
495 .form-loader {
496 width: 100%;
497 height: 5px;
498 margin: 0 0 20px;
499 }
500 .form-loader-count {
501 width: 0;
502 height: 5px;
503 background: url("../images/form-loader.png");
504 transition: all 2.5s linear;
505 -webkit-transition: all 2s linear;
506 -moz-transition: all 2.5s linear;
507 }
508 .route.is-high > .ui-icon > i:before {
509 content: "\e900" !important
510 }
511 .route.is-high.active > .ui-icon > i:before {
512 content: "\e90c" !important;
513 z-index: 11;
514 color: #444;
515 font-size: 20px;
516 }
517 .route.is-high.active > .ui-icon > i:after {
518 content: "\e907";
519 margin-left: -1.2em;
520 color: #444;
521 font-size: 11px;
522 top: 1px;
523 position: absolute;
524 }
525 .route.is-high.active.active-item > .ui-icon > i:before, .route.is-high.active.active-item > .ui-icon > i:after {
526 color: #ffffff;
527 }
528 li.active-menu {
529 z-index: 2 !important;
530 }
531 th#wcp_move {
532 width: 20px;
533 }
534 .wp-list-table tr td .wcp-move-file {
535 vertical-align: middle;
536 opacity: 0;
537 }
538 .wp-list-table tr:hover td .wcp-move-file, .wp-list-table td.wcp_move.column-wcp_move.wcp-draggable {
539 opacity: 1;
540 }
541 .wcp-drop-hover {
542 background: #0073aa !important;
543 z-index: 2 !important;
544 color: #fff !important;
545 }
546 .wcp-drop-hover span {
547 color: #fff !important;
548 }
549 .ui-draggable-dragging {
550 z-index: 1051 !important;
551 }
552
553 .wcp-hover-list {
554 background: #008ec2 !important;
555 color: #fff;
556 position: relative;
557 }
558 .wcp-hover-list a {
559 color: #fff;
560 }
561 .wcp-hover-list span.total-count {
562 color: #000;
563 }
564 span.wcp-item {
565 display: none;
566 }
567 .wcp-move-file {
568 cursor: move;
569 }
570 .wcp-drop-hover-list a.folder-view {
571 background: #008ec2;
572 color: #fff;
573 border: solid 1px #fff;
574 position: relative;
575 }
576 .tree-structure .folder-view {
577 display: block;
578 border: 1px solid #dadce0;
579 color: #404040;
580 border-radius: 4px;
581 -moz-border-radius: 4px;
582 -webkit-border-radius: 4px;
583 position: relative;
584 cursor: pointer;
585 background: #fff;
586 }
587 .tree-structure .folder-view:hover {
588 background: #008ec2;
589 color: #ffffff;
590
591 }
592 .wcp-drop-hover-list a.folder-view:before {
593 width: 100%;
594 height: 100%;
595 content: "";
596 position: absolute;
597 top: -2px;
598 left: -2px;
599 border: solid 1px #008ec2;
600 padding: 1px;
601 border-radius: 4px;
602 -moz-border-radius: 4px;
603 -webkit-border-radius: 4px;
604 }
605 .ui-draggable-dragging.wcp-move-file {
606 z-index: 5001;
607 display: inline-block;
608 border: solid 2px #0073aa;
609 padding: 5px 10px;
610 border-radius: 5px;
611 background: #e4f6ff;
612 z-index: 2001;
613 position: fixed !important;
614 max-width: 230px;
615 overflow: hidden;
616 width: auto !important;
617 }
618 .ui-draggable-dragging.wcp-move-file span {
619 display: block;
620 float: left;
621 }
622 .ui-draggable-dragging.wcp-move-file span.wcp-move {
623 margin-right: 5px;
624 display: block;
625 float: left;
626 }
627 .wcp-container .route span.title-text {
628 position: relative;
629 top: auto;
630 left: auto;
631 width: auto;
632 display: inline-block;
633 font-size: 16px;
634 line-height: 30px;
635 height: 30px;
636 }
637 .ui-resizable-handle.ui-resizable-e {
638 position: absolute;
639 top: 0;
640 height: 100%;
641 height: 100vh;
642 width: 1px;
643 right: 0;
644 border-right: 1px solid #ccc;
645 cursor: col-resize;
646 }
647 .ui-resizable-handle.ui-resizable-e:before, .ui-resizable-handle.ui-resizable-w:before {
648 content: "";
649 top: 68px;
650 width: 3px;
651 height: 53px;
652 position: absolute;
653 border-left: solid 1px #ccc;
654 border-right: solid 1px #ccc;
655 left: -1px;
656 }
657 .ui-resizable-handle.ui-resizable-w {
658 position: absolute;
659 top: 0;
660 height: 100%;
661 height: 100vh;
662 width: 1px;
663 left: 0;
664 border-right: 1px solid #ccc;
665 cursor: col-resize;
666 }
667
668 div#custom-menu {
669 padding-bottom: 120px;
670 }
671 .wcp-container .route span.star-icon {
672 position: relative;
673 top: 2px;
674 left: auto;
675 float: right;
676 font-family: 'folder-icon' !important;
677 speak: none;
678 color: #ffc90e;
679 display: none;
680 }
681 .wcp-container .route span.update-inline-record {
682 position: relative;
683 left: auto;
684 top: 2px;
685 float: right;
686 width: 0px;
687 height: 22px;
688 font-family: 'folder-icon' !important;
689 font-size: 16px;
690 overflow: hidden;
691 transition: all 0.25s linear;
692 -webkit-transition: all 0.25s linear;
693 -moz-transition: all 0.25s linear;
694 }
695 .wcp-container .route h3:hover > span.update-inline-record {
696 width: 18px;
697 }
698 .wcp-container .route span.update-inline-record:after {
699 content: "\e910";
700 }
701 .wcp-container .route.is-high > h3 > span.star-icon {
702 display: block;
703 }
704 .wcp-container .route span.star-icon:after {
705 content: "\e907";
706 }
707
708 .tree-structure li {
709 display: block;
710 width: 16.667%;
711 float: left;
712 margin: 0;
713 padding: 0;
714 }
715 .tree-structure .folder-item {
716 padding: 8px;
717 position: relative;
718 }
719 .tree-structure .folder-view {
720 display: block;
721 border: 1px solid #dadce0;
722 color: #404040;
723 border-radius: 4px;
724 -moz-border-radius: 4px;
725 -webkit-border-radius: 4px;
726 position: relative;
727 cursor: pointer;
728 background: #fff;
729 }
730 .tree-structure .folder-view span.item-name {
731 display: block;
732 padding: 10px 25px 10px 50px;
733 position: relative;
734 width: 100%;
735 overflow: hidden;
736 height: 38px;
737 font-size: 16px;
738 box-sizing: border-box;
739 }
740 .folder-view span.item-name:before {
741 content: "\e90d";
742 font-family: 'folder-icon' !important;
743 position: absolute;
744 left: 15px;
745 font-size: 24px;
746 }
747 .folder-view.is-high span.item-name:before {
748 content: "\e900";
749 }
750 .folder-view.is-post span.item-name:before {
751 content: "\e901";
752 }
753 .tree-structure span.folder-option {
754 position: absolute;
755 right: 0;
756 font-family: 'folder-icon' !important;
757 top: 0px;
758 font-size: 20px;
759 line-height: 38px;
760 z-index: 1;
761 cursor: pointer;
762 display: none;
763 }
764 .tree-structure .folder-view:hover span.folder-option {
765 display: block;
766 }
767 .tree-structure span.folder-option:hover {
768 color: #F51366;
769 }
770 .tree-structure span.folder-option:after {
771 content: "\e90a";
772 }
773 .tree-structure li {
774 position: relative;
775 }
776 .tree-structure {
777 margin-left: -8px;
778 margin-right: -8px;
779 }
780 .tree-structure .folder-view span.folder-title {
781 overflow: hidden;
782 width: 100%;
783 height: 18px;
784 display: block;
785 }
786 .swal2-popup .swal2-title {
787 line-height: 36px;
788 }
789 .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 {
790 display: none;
791 }
792 .attachments.ui-sortable.ui-draggable-dragging {
793 z-index: 5000;;
794 }
795 .selected-items {
796 background: #0073aa;
797 color: #ffffff;
798 padding: 10px 20px;
799 border-radius: 5px;
800 -moz-border-radius: 5px;
801 -webkit-border-radius: 5px;
802 margin-top: 0px;
803 cursor: none;
804 font-size: 12px;
805 }
806 .media-frame, .media-frame-content, .media-frame .attachments-browser {
807 overflow: inherit;
808 }
809 body.upload-php.eml-grid #wpbody {
810 position: relative !important;
811 top: 0px !important;
812 bottom: auto !important;
813 left: auto !important;
814 right: auto !important;;
815 height: auto;
816 }
817 span.upgrade-message {
818 padding: 0px 0 10px;
819 background: #fff;
820 display: inline-block;
821 font-size: 14px;
822 color: #000;
823 }
824 span.upgrade-message a.pink, span.upgrade-message span.pink {
825 color: #FF5983;
826 text-decoration: none;
827 font-weight: bold;
828 }
829
830 .media-toolbar.sticky-media {
831 position: fixed;
832 top: 32px;
833 right: 18px !important;
834 left: auto;
835 }
836
837 .media-position {
838 width: 1px;
839 height: 1px;
840 }
841 .media-frame.mode-grid .media-toolbar {
842 margin: 0 !important;
843 }
844 .button-disabled {
845 cursor: no-drop;
846 pointer-events: none;
847 }
848 .wcp-hide-show-buttons {
849 position: absolute;
850 top: 25px;
851 right: -20px;
852 }
853 .wcp-hide-show-buttons .toggle-buttons {
854 background: #f51366;
855 color: #fff;
856 display: inline-block;
857 margin: 0;
858 padding: 0;
859 float: left;
860 -webkit-border-top-right-radius: 50%;
861 -webkit-border-bottom-right-radius: 50%;
862 -moz-border-radius-topright: 50%;
863 -moz-border-radius-bottomright: 50%;
864 border-top-right-radius: 50%;
865 border-bottom-right-radius: 50%;
866 display: none;
867 width: 20px;
868 height: 20px;
869 cursor: pointer;
870 }
871 .wcp-hide-show-buttons .toggle-buttons:hover {
872 background: #bc0f50;
873 }
874 .hide-folders-area .wcp-content {
875 width: 0px !important;
876 }
877 .hide-folders-area .wcp-container {
878 display: none;
879 }
880
881 .wcp-hide-show-buttons .toggle-buttons.active {
882 display: block;
883 }
884 #wcp-content.no-transition .wcp-container {
885 display: none;
886 }
887 button.button.organize-button {
888 vertical-align: middle;
889 text-decoration: none;
890 display: inline-block;
891 font-size: 14px;
892 padding: 4px 10px;
893 background: #F51366;
894 color: #fff;
895 border: solid 1px #F51366;
896 border-radius: 3px;
897 line-height: 14px;
898 -webkit-box-shadow: 0 3px 5px -3px #333333;
899 -moz-box-shadow: 0 3px 5px -3px #333333;
900 box-shadow: 0 3px 5px -3px #333333;
901 }
902 button.button.organize-button:hover, button.button.organize-button:focus {
903 background: #bc0f50;
904 color: #ffffff;
905 border: solid 1px #bc0f50;
906 }
907 .tree-structure-content ul {
908 margin: 0;
909 padding: 0;
910 }
911 .tree-structure-content {
912 padding: 10px 20px 10px;
913 background: #fff;
914 margin: 10px 0 15px;
915 border-radius: 4px;
916 -moz-border-radius: 4px;
917 -webkit-border-radius: 4px;
918 border: solid 1px #cccccc;
919 }
920 .tree-structure-content .tree-structure {
921 height: 55px;
922 overflow: hidden;
923 transition: 0.1s;
924 -webkit-transition: 0.1s;
925 -moz-transition: 0.1s;
926 }
927 .tree-structure-content.active .tree-structure {
928 height: auto;
929 }
930 .folders-toggle-button {
931 height: 15px;
932 text-align: center;
933 position: relative;
934 }
935 .folders-toggle-button span {
936 background: #F51366;
937 color: #fff;
938 height: 20px;
939 width: 30px;
940 text-align: center;
941 display: block;
942 margin: 0 auto;
943 position: absolute;
944 left: 0;
945 right: 0;
946 bottom: -10px;
947 cursor: pointer;
948 font-family: dashicons;
949 font-size: 20px;
950 line-height: 20px;
951 }
952 .folders-toggle-button span:after {
953 content: "\f347";
954 }
955 .tree-structure-content.active .folders-toggle-button span:after {
956 content: "\f343";
957 }
958 span.media-info-message {
959 vertical-align: middle;
960 line-height: 50px;
961 font-weight: bold;
962 color: #f51366;
963 padding: 0 0 0 20px;
964 display: none !important;;
965 }
966 span.media-info-message.active {
967 display: inline-block !important;
968 }
969
970 /* custom popup css */
971 .folder-popup-form {
972 position: fixed;
973 width: 100%;
974 height: 100%;
975 background: rgba(0,0,0,0.5);
976 top: 0;
977 left: 0;
978 z-index: 10001;
979 display: none;
980 }
981 .folder-popup-form.disabled {
982 pointer-events: none;
983 }
984 .popup-form-content {
985 background: #ffffff;
986 min-height: 100px;
987 width: 400px;
988 text-align: center;
989 margin: 0 auto;
990 position: absolute;
991 left: 0;
992 right: 0;
993 top: 50%;
994 transform: translate(0, -50%);
995 -webkit-transform: translate(0, -50%);
996 -moz-transform: translate(0, -50%);
997 -o-transform: translate(0, -50%);
998 -ms-transform: translate(0, -50%);
999 padding: 20px;
1000 -webkit-border-radius: 10px;
1001 -moz-border-radius: 10px;
1002 border-radius: 10px;
1003 }
1004 .folder-form-buttons a {
1005 display: inline-block;
1006 padding: 10px 20px;
1007 text-decoration: none;
1008 margin: 10px 3px;
1009 font-size: 18px;
1010 line-height: 22px;
1011 border-radius: .25em;
1012 color: #ffffff;
1013 }
1014 .folder-form-buttons a span {
1015 -webkit-animation: fa-spin 0.75s infinite linear;
1016 animation: fa-spin 0.75s infinite linear;
1017 }
1018 @-webkit-keyframes fa-spin {
1019 0% {
1020 -webkit-transform: rotate(0deg);
1021 transform: rotate(0deg);
1022 }
1023 100% {
1024 -webkit-transform: rotate(359deg);
1025 transform: rotate(359deg);
1026 }
1027 }
1028 .folder-form-buttons a:hover, .folder-form-buttons a:focus {
1029 color: #ffffff;
1030 background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.1));
1031 }
1032 .folder-form-buttons a:focus {
1033 outline: 0;
1034 box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(50,100,150,.4);
1035 }
1036 .form-cancel-btn {
1037 background-color: #aaaaaa;
1038 }
1039 .form-submit-btn {
1040 background-color: #3085d6;
1041 }
1042 .add-update-folder-title {
1043 display: block;
1044 position: relative;
1045 max-width: 100%;
1046 margin: 0 0 .4em;
1047 padding: 0;
1048 color: #595959;
1049 font-size: 1.875em;
1050 font-weight: 600;
1051 text-align: center;
1052 text-transform: none;
1053 word-wrap: break-word;
1054 line-height: 30px;
1055 }
1056 .folder-form-input input {
1057 width: 100%;
1058 transition: border-color .3s,box-shadow .3s;
1059 border: 1px solid #d9d9d9;
1060 border-radius: .1875em;
1061 font-size: 1.125em;
1062 box-shadow: inset 0 1px 1px rgba(0,0,0,.06);
1063 box-sizing: border-box;
1064 height: 2.625em;
1065 padding: 0 .75em;
1066 margin: 1em auto;
1067 }
1068 .folder-form-message {
1069 font-size: 16px;
1070 line-height: 20px;
1071 margin: 25px 0;
1072 }
1073 .folder-form-errors {
1074 margin: 0 0 10px 0;
1075 padding: 8px 0;
1076 background: #ffe4e4;
1077 color: #a20000;
1078 display: none;
1079 }
1080 .folder-form-errors.active {
1081 display: block;
1082 }
1083
1084 .sticky-menu #adminmenuwrap {
1085 position: relative !important;
1086 }
1087 span.folder-loader-ajax {
1088 float: right;
1089 margin: 0px 8px 0 0;
1090 line-height: 30px;
1091 display:none;
1092 }
1093 .folder-loader-ajax.active {
1094 display: inline-block;
1095 }
1096 @media screen and (max-width: 1300px) {
1097 .tree-structure li {
1098 width: 20%;
1099 }
1100 }
1101 @media screen and (max-width: 960px) {
1102 .wcp-content {
1103 left: 36px;
1104 }
1105 html[dir="rtl"] .wcp-content {
1106 right: 36px;
1107 left: auto;
1108 }
1109 .tree-structure li {
1110 width: 25%;
1111 }
1112 }
1113
1114 @media screen and (max-width: 780px) {
1115 .wcp-content {
1116 left: 0px;
1117 }
1118 html[dir="rtl"] .wcp-content {
1119 right: 0px;
1120 }
1121 .tree-structure li {
1122 width: 33.33%;
1123 }
1124 }
1125
1126
1127 @media screen and (max-width: 640px) {
1128 .wcp-content {
1129 left: 0px;
1130 position: relative !important;
1131 width: 100% !important;
1132 padding-bottom: 100px;
1133 top: 0;
1134 right: 0;
1135 display: block;
1136 }
1137 .ui-resizable-handle.ui-resizable-e {
1138 display: none !important;
1139 }
1140 .hide-folders-area .wcp-container {
1141 display: block;
1142 }
1143 .wcp-hide-show-buttons {
1144 display: none;
1145 }
1146 .hide-folders-area .wcp-content {
1147 width: 100% !important;
1148 }
1149 body.wp-admin #wpcontent {
1150 padding: 0 !important;
1151 }
1152 #wpbody-content {
1153 padding-bottom: 30px;
1154 }
1155 .tree-structure li {
1156 width: 50%;
1157 }
1158 }
1159