PluginProbe
Document Gallery / trunk
Document Gallery vtrunk
trunk 0.8 0.8.5 1.0 1.0.1 1.0.2 1.0.3 1.0.4 1.1 1.2 1.2.1 1.3 1.3.1 1.4 1.4.1 1.4.2 1.4.3 2.0 2.0.1 2.0.10 2.0.2 2.0.3 2.0.4 2.0.5 2.0.6 All 94 releases
document-gallery / src / assets / css / admin.css

admin.css in Document Gallery trunk, at src/assets/css/admin.css

838 lines 18.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 @media screen and (max-width: 782px) {
2 .column-title {
3 width: 150px;
4 }
5
6 .column-date {
7 display: table-cell !important;
8 width: auto !important;
9 }
10
11 .nav-tab-wrapper {
12 padding-left: 5px !important;
13 padding-right: 5px !important;
14 }
15
16 .top .tablenav-pages {
17 display: none;
18 }
19
20 .bottom .tablenav-pages {
21 width: auto !important;
22 margin-top: 0 !important;
23 }
24
25 .bottom .displaying-num {
26 position: inherit !important;
27 }
28 }
29
30 @media screen and (max-width: 979px) {
31 .column-thumbupload {
32 display: none;
33 }
34
35 .thumbs-list-wrapper {
36 margin-top: 0 !important;
37 }
38 }
39
40 div.thumbs-list-wrapper, div.log-list-wrapper {
41 text-align: center;
42 margin-top: 1.5em;
43 }
44
45 div.thumbs-list-wrapper > div, div.log-list-wrapper > div {
46 margin: 0 auto;
47 display: inline-block;
48 }
49
50 #ThumbsTable, #LogTable {
51 border: none;
52 box-shadow: none;
53 -webkit-box-shadow: none;
54 -moz-box-shadow: none;
55 border-radius: 10px;
56 -webkit-border-radius: 10px;
57 -moz-border-radius: 10px;
58 background: #B9C9FE;
59 color: #039;
60 width: 100%;
61 margin: 10px auto;
62 }
63
64 #ThumbsTable tbody, #LogTable tbody {
65 background: #E8EdFF;
66 color: #669;
67 }
68
69 #ThumbsTable > tbody > tr:hover, #LogTable > tbody > tr:hover {
70 background: #D0DAFD;
71 }
72
73 #ThumbsTable > tbody > tr:not(:last-child) td, #LogTable > tbody > tr:not(:last-child) td {
74 border-bottom: 1px solid #B9C9FE;
75 }
76
77 #ThumbsTable td, #ThumbsTable th, #LogTable td, #LogTable th {
78 text-align: center;
79 vertical-align: middle;
80 margin: 0;
81 padding: 4px;
82 }
83
84 #LogTable td {
85 text-align: left;
86 }
87
88 td.title.column-title, .column-thumbupload {
89 text-align: left !important;
90 }
91
92 td.column-icon.media-icon {
93 height: 70px;
94 }
95
96 td.media-icon img {
97 width: auto;
98 height: auto;
99 max-width: 80px;
100 max-height: 60px;
101 border: none;
102 }
103
104 #ThumbsTable img {
105 display: block;
106 margin: 5px auto;
107 }
108
109 #LogTable td > pre, .spoiler-body > pre, .expander pre, .collapser pre {
110 margin: 0;
111 display: inline-block;
112 white-space: pre-line;
113 }
114
115 tr.selected {
116 background: #B6ADCE;
117 }
118
119 tr.selected:hover {
120 background: #D8D3E5 !important;
121 }
122
123 .check-column, .column-icon {
124 white-space: nowrap;
125 width: 80px;
126 }
127
128 .column-entry, .column-title {
129 /*width: 100%;*/
130 }
131
132 .column-thumbupload {
133 white-space: nowrap;
134 width: 35%;
135 }
136
137 #document_gallery_gen_box .column-thumbupload {
138 width: auto;
139 padding-left: 7em;
140 }
141
142 .nav-tab:before, .deleteSelected:before, .clearLog:before, .expandAll:before, .collapseAll:before, .logLabel.date:before, .collapser:after, .expander:after {
143 display: inline-block;
144 -webkit-font-smoothing: antialiased;
145 font: normal 20px/1 'dashicons';
146 vertical-align: text-bottom;
147 padding-right: 5px;
148 }
149
150 #general-tab-header:before {
151 content: '\f108';
152 }
153
154 #thumber-co-tab-header:before {
155 content: '\f529';
156 }
157
158 #thumbnail-management-tab-header:before {
159 content: '\f233';
160 }
161
162 #logging-tab-header:before {
163 content: '\f163';
164 }
165
166 #advanced-tab-header:before {
167 content: '\f332';
168 }
169
170 .deleteSelected:before, .clearLog:before {
171 content: '\f182';
172 }
173
174 .expandAll:before {
175 content: '\f211';
176 }
177
178 .collapseAll:before {
179 content: '\f506';
180 }
181
182 .expandAll, .collapseAll {
183 display: none;
184 }
185
186 #ThumbsTable .title a:after, #LogTable > tbody a:after {
187 content: '\f504';
188 display: inline-block;
189 -webkit-font-smoothing: antialiased;
190 font-family: 'dashicons';
191 font-size: inherit;
192 font-style: normal;
193 font-variant: normal;
194 font-weight: normal;
195 line-height: 1;
196 vertical-align: inherit;
197 padding-left: 5px;
198 }
199
200 #LogTable > tbody a {
201 -webkit-transition: none;
202 transition: none;
203 text-decoration: none;
204 outline: 0;
205 }
206
207 #LogTable > tbody pre strong {
208 font-weight: bolder;
209 }
210
211 #LogTable > tbody a:active, #LogTable > tbody a:hover {
212 color: #2ea2cc;
213 }
214
215 .levelSelector {
216 float: right;
217 }
218
219 .logLabel {
220 padding: 0 10px;
221 color: #fff !important;
222 text-decoration: none;
223 font-weight: bolder;
224 border: none !important;
225 float: left;
226 margin-left: 1px;
227 margin-top: 1px;
228 -webkit-border-radius: 100px;
229 -moz-border-radius: 100px;
230 border-radius: 100px;
231 cursor: context-menu;
232 }
233
234 .logLabel.warning {
235 background: #F89406;
236 }
237
238 .logLabel.detail {
239 background: #3A87AD;
240 }
241
242 .logLabel.error {
243 background: #CC0000;
244 }
245
246 .logLabel.date {
247 background: #999999;
248 /*white-space: nowrap;*/
249 font-weight: inherit;
250 }
251
252 .logLabel.date:before {
253 font-size: inherit;
254 vertical-align: middle;
255 padding-bottom: 0.2em;
256 content: '\f469';
257 }
258
259 .spoiler-body {
260 padding: 1px 6px 2px;
261 display: none;
262 border-top: 1px solid #C3CBD1;
263 background: #F5F5F5;
264 }
265
266 .column-entry {
267 text-align: left !important;
268 }
269
270 .expander pre, .collapser pre {
271 vertical-align: middle;
272 float: left;
273 white-space: pre-wrap;
274 }
275
276 .expander, .collapser {
277 display: table;
278 vertical-align: middle;
279 width: 100%;
280 cursor: pointer;
281 }
282
283 .expander > div, .collapser > div {
284 display: table-cell;
285 vertical-align: middle;
286 height: 100%;
287 }
288
289 .dashicons.dashicons-arrow-down-alt2, .dashicons.dashicons-arrow-up-alt2 {
290 float: right;
291 padding-right: 15px;
292 }
293
294 .levelSelector > *, .dashicons {
295 -webkit-touch-callout: none;
296 -webkit-user-select: none;
297 -khtml-user-select: none;
298 -moz-user-select: none;
299 -ms-user-select: none;
300 user-select: none;
301 }
302
303 .levelSelector > input[type=checkbox] {
304 display: none;
305 }
306
307 .levelSelector > input[type=checkbox] + label {
308 color: #6B6B6B;
309 font-weight: bolder;
310 margin: 4px 0;
311 overflow: auto;
312 text-align: center;
313 padding: 3px 8px;
314 display: table-cell;
315 background-color: #F5F5F5;
316 background-image: -moz-linear-gradient(top, #FFF, #E6E6E6);
317 background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FFF), to(#E6E6E6));
318 background-image: -webkit-linear-gradient(top, #FFF, #E6E6E6);
319 background-image: -o-linear-gradient(top, #FFF, #E6E6E6);
320 background-image: linear-gradient(to bottom, #FFF, #E6E6E6);
321 background-repeat: repeat-x;
322 border: 1px solid #CCC;
323 border-color: #E6E6E6 #E6E6E6 #BFBFBF;
324 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
325 border-bottom-color: #B3B3B3;
326 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFE6E6E6', GradientType=0);
327 filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
328 -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
329 -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
330 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
331 }
332
333 .levelSelector > input[type=checkbox] + label:first-of-type {
334 border-top-left-radius: 4px;
335 border-bottom-left-radius: 4px;
336 }
337
338 .levelSelector > input[type=checkbox] + label:last-of-type {
339 border-top-right-radius: 4px;
340 border-bottom-right-radius: 4px;
341 }
342
343 .levelSelector > input[type=checkbox]:checked + label {
344 background-image: none;
345 outline: 0;
346 -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
347 -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
348 box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
349 }
350
351 .levelSelector > input[type=checkbox] + label.errorLevel {
352 color: #CC0000;
353 }
354
355 .levelSelector > input[type=checkbox]:checked + label.errorLevel {
356 background-color: #CC0000;
357 color: #FFF;
358 }
359
360 .levelSelector > input[type=checkbox] + label.warningLevel {
361 color: #F89406;
362 }
363
364 .levelSelector > input[type=checkbox]:checked + label.warningLevel {
365 background-color: #F89406;
366 color: #FFF;
367 }
368
369 .levelSelector > input[type=checkbox] + label.detailLevel {
370 color: #3A87AD;
371 }
372
373 .levelSelector > input[type=checkbox]:checked + label.detailLevel {
374 background-color: #3A87AD;
375 color: #FFF;
376 }
377
378 .noLog {
379 font-size: x-large;
380 display: block;
381 width: 100%;
382 text-align: center;
383 margin-top: 20ex;
384 line-height: 150%;
385 }
386
387 .loggingON, .loggingOFF {
388 font-weight: bolder;
389 }
390
391 .loggingON {
392 color: green;
393 }
394
395 .loggingOFF {
396 color: red;
397 }
398
399 th input {
400 margin-left: 0 !important;
401 margin-top: 1px !important;
402 }
403
404 td input {
405 margin-right: 0 !important;
406 }
407
408 textarea[readonly], input[readonly], select[readonly] {
409 background-color: #DCDCDC;
410 }
411
412 .nowrap {
413 white-space: nowrap;
414 }
415
416 .column-level {
417 white-space: nowrap;
418 width: 6em;
419 }
420
421 .column-date {
422 width: 16em !important;
423 }
424
425 .column-thumbupload {
426 -webkit-user-select: none;
427 -moz-user-select: none;
428 -ms-user-select: none;
429 user-select: none;
430 cursor: default;
431 }
432
433 .column-thumbupload > * {
434 visibility: hidden;
435 }
436
437 .column-thumbupload .dashicons {
438 font-size: x-large;
439 padding-top: 2px;
440 padding-left: 16px;
441 padding-right: 10px;
442 vertical-align: text-bottom;
443 }
444
445 /*Attempt to add fancy shadows*/
446 /*#ThumbsTable tr:hover {
447 z-index: 3;
448 border-color: #ccc;
449 -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
450 -moz-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
451 -ms-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
452 box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
453 }*/
454 #ThumbsTable tr:hover .column-thumbupload > *, #document_gallery_gen_box #ThumbsTable tr .column-thumbupload > * {
455 visibility: visible;
456 }
457
458 .dragover {
459 outline: 3px dashed #83b4d8;
460 }
461
462 .html5dndmarker span {
463 padding: 0 10px;
464 }
465
466 .buttons-area input:first-child, .invis {
467 display: none !important;
468 }
469
470 #document_gallery_gen_box h3 span {
471 font-weight: 100;
472 }
473
474 #document_gallery_gen_box h3 span i b {
475 font-weight: 500;
476 }
477
478 th.column-description {
479 text-align: left !important;
480 }
481
482 .editable-description {
483 max-height: 70px;
484 overflow-y: auto;
485 text-align: justify;
486 }
487
488 .column-description textarea {
489 height: 65px;
490 width: 100%;
491 }
492
493 td.column-title, td.column-description {
494 position: relative;
495 }
496
497 td.column-title.trans, td.column-description.trans {
498 background-color: inherit;
499 transition: background-color 1s linear;
500 -o-transition: background-color 1s linear;
501 -moz-transition: background-color 1s linear;
502 -webkit-transition: background-color 1s linear;
503 }
504
505 td .dashicons-edit, td .edit-controls {
506 display: none;
507 position: absolute;
508 top: 5px;
509 right: 12px;
510 }
511
512 td .dashicons-edit, .edit-controls .dashicons-yes, .edit-controls .dashicons-no, .edit-controls .dashicons-update {
513 z-index: 100;
514 font-size: x-large;
515 cursor: pointer;
516 width: auto;
517 height: auto;
518 }
519
520 td .dashicons-edit, .edit-controls .dashicons-update {
521 color: #0074A2;
522 }
523
524 .edit-controls:hover, .edit-controls.waiting {
525 opacity: 1;
526 }
527
528 .edit-controls {
529 opacity: 0.1;
530 }
531
532 .edit-controls .dashicons-yes {
533 color: green;
534 }
535
536 .edit-controls .dashicons-no {
537 color: red;
538 }
539
540 .edit-controls.waiting .dashicons-yes, .edit-controls.waiting .dashicons-no {
541 display: none;
542 }
543
544 .edit-controls .dashicons-update {
545 display: none;
546 cursor: default;
547 }
548
549 .edit-controls.waiting .dashicons-update, .deleteSelected.waiting:before {
550 display: block;
551 -webkit-animation: spin 1s linear infinite;
552 -moz-animation: spin 1s linear infinite;
553 animation: spin 1s linear infinite;
554 }
555
556 .deleteSelected.waiting:before {
557 content: '\f463';
558 width: auto;
559 height: auto;
560 display: inline-block;
561 padding: 0;
562 }
563
564 @-moz-keyframes spin {
565 100% {
566 -moz-transform: rotate(360deg);
567 }
568 }
569
570 @-webkit-keyframes spin {
571 100% {
572 -webkit-transform: rotate(360deg);
573 }
574 }
575
576 @keyframes spin {
577 100% {
578 -webkit-transform: rotate(360deg);
579 transform: rotate(360deg);
580 }
581 }
582
583 .responseSuccess {
584 background-color: greenyellow !important;
585 }
586
587 .responseFail {
588 background-color: crimson !important;
589 }
590
591 td.column-title .dashicons-edit, td.column-description .dashicons-edit {
592 height: 0;
593 opacity: 0;
594 display: block;
595 overflow: hidden;
596 transition: opacity 1s ease-out;
597 -o-transition: opacity 1s ease-out;
598 -moz-transition: opacity 1s ease-out;
599 -webkit-transition: opacity 1s ease-out;
600 }
601
602 td.column-title:hover .dashicons-edit, td.column-description:hover .dashicons-edit {
603 opacity: 1;
604 height: auto;
605 }
606
607 td.column-title input {
608 width: 75%;
609 }
610
611 .manual-download {
612 display: block;
613 text-align: center;
614 }
615
616 .editable-description::-webkit-scrollbar, .column-description textarea::-webkit-scrollbar {
617 width: 5px;
618 height: 5px;
619 }
620
621 .editable-description::-webkit-scrollbar-track-piece, .column-description textarea::-webkit-scrollbar-track-piece {
622 background-color: #FFFFFF;
623 -webkit-border-radius: 5px;
624 -moz-border-radius: 5px;
625 border-radius: 5px;
626 }
627
628 .editable-description::-webkit-scrollbar-thumb:vertical, .column-description textarea::-webkit-scrollbar-thumb:vertical {
629 height: 5px;
630 background-color: #9B9B9B;;
631 -webkit-border-radius: 5px;
632 }
633
634 .dg-settings label.setting {
635 margin: 2px 0;
636 }
637
638 .dg-settings label.setting table {
639 width: 100%;
640 padding-right: 8px;
641 }
642
643 .dg-settings label.setting table tr td:last-of-type, .dg-settings label.setting table tr td:last-of-type * {
644 text-align: right !important;
645 float: none !important;
646 margin: auto 0 !important;
647 }
648
649 .dg-settings label.setting table tr td:last-of-type select {
650 max-width: none !important;
651 }
652
653 .dg-settings label.setting table tr td span {
654 text-align: left !important;
655 float: none !important;
656 }
657
658 .progress {
659 border: 0;
660 width: 100%;
661 height: 18px;
662 position: relative;
663 background-color: #F1F1F1; /*#F3F3F3*/
664 -webkit-border-radius: 9px;
665 -moz-border-radius: 9px;
666 border-radius: 9px;
667 -webkit-box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 0.3);
668 -moz-box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 0.3);
669 box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 0.3);
670 }
671
672 .column-thumbupload .progress {
673 visibility: visible !important;
674 }
675
676 .progress > span {
677 border: 0;
678 height: 100%;
679 display: block;
680 overflow: hidden;
681 position: relative;
682 -webkit-transition: width 0.5s linear;
683 -moz-transition: width 0.5s linear;
684 -o-transition: width 0.5s linear;
685 transition: width 0.5s linear;
686 background-color: #7AD03A; /*#0074A2*/
687 -webkit-border-radius: 9px;
688 -moz-border-radius: 9px;
689 border-radius: 9px;
690 background-image: linear-gradient(
691 90deg,
692 rgb(43, 194, 83) 37%,
693 rgb(84, 240, 84) 69%
694 );
695 background-image: -moz-linear-gradient(
696 90deg,
697 rgb(43, 194, 83) 37%,
698 rgb(84, 240, 84) 69%
699 );
700 background-image: -o-linear-gradient(
701 90deg,
702 rgb(43, 194, 83) 37%,
703 rgb(84, 240, 84) 69%
704 );
705 background-image: -webkit-gradient(
706 linear,
707 left bottom,
708 left top,
709 color-stop(0, rgb(43, 194, 83)),
710 color-stop(1, rgb(84, 240, 84))
711 );
712 -webkit-box-shadow: inset 0 2px 9px rgba(255, 255, 255, 0.3),
713 inset 0 -2px 6px rgba(0, 0, 0, 0.4);
714 -moz-box-shadow: inset 0 2px 9px rgba(255, 255, 255, 0.3),
715 inset 0 -2px 6px rgba(0, 0, 0, 0.4);
716 box-shadow: inset 0 2px 9px rgba(255, 255, 255, 0.3),
717 inset 0 -2px 6px rgba(0, 0, 0, 0.4);
718 }
719
720 .progress > span:after, .progress.animate > span > span {
721 top: 0;
722 left: 0;
723 right: 0;
724 bottom: 0;
725 z-index: 1;
726 content: '';
727 overflow: hidden;
728 position: absolute;
729 -webkit-border-radius: 9px;
730 -moz-border-radius: 9px;
731 border-radius: 9px;
732 background-image: -webkit-gradient(
733 linear, 0 0, 100% 100%,
734 color-stop(.25, rgba(255, 255, 255, .2)),
735 color-stop(.25, transparent), color-stop(.5, transparent),
736 color-stop(.5, rgba(255, 255, 255, .2)),
737 color-stop(.75, rgba(255, 255, 255, .2)),
738 color-stop(.75, transparent), to(transparent)
739 );
740 background-image: -moz-linear-gradient(
741 315deg,
742 rgba(255, 255, 255, .2) 25%,
743 transparent 25%,
744 transparent 50%,
745 rgba(255, 255, 255, .2) 50%,
746 rgba(255, 255, 255, .2) 75%,
747 transparent 75%,
748 transparent
749 );
750 background-image: -o-linear-gradient(
751 315deg,
752 rgba(255, 255, 255, .2) 25%,
753 transparent 25%,
754 transparent 50%,
755 rgba(255, 255, 255, .2) 50%,
756 rgba(255, 255, 255, .2) 75%,
757 transparent 75%,
758 transparent
759 );
760 background-image: linear-gradient(
761 315deg,
762 rgba(255, 255, 255, .2) 25%,
763 transparent 25%,
764 transparent 50%,
765 rgba(255, 255, 255, .2) 50%,
766 rgba(255, 255, 255, .2) 75%,
767 transparent 75%,
768 transparent
769 );
770 -webkit-background-size: 50px 50px;
771 -moz-background-size: 50px 50px;
772 background-size: 50px 50px;
773 -webkit-animation: move 2s linear infinite;
774 -moz-animation: move 2s linear infinite;
775 -ms-animation: move 2s linear infinite;
776 animation: move 2s linear infinite;
777 }
778
779 @-webkit-keyframes move {
780 0% {
781 background-position: 0 0;
782 }
783 100% {
784 background-position: 50px 50px;
785 }
786 }
787
788 @-moz-keyframes move {
789 0% {
790 background-position: 0 0;
791 }
792 100% {
793 background-position: 50px 50px;
794 }
795 }
796
797 @-ms-keyframes move {
798 0% {
799 background-position: 0 0;
800 }
801 100% {
802 background-position: 50px 50px;
803 }
804 }
805
806 @keyframes move {
807 0% {
808 background-position: 0 0;
809 }
810 100% {
811 background-position: 50px 50px;
812 }
813 }
814
815 .progress.animate > span:after {
816 display: none;
817 }
818
819 .progress.success > span {
820 background-color: green;
821 width: 100% !important;
822 background-image: none !important;
823 }
824
825 .progress.fail > span {
826 background-color: red;
827 background-image: none !important;
828 }
829
830 .progress.nostripes > span > span, .progress.nostripes > span:after,
831 .progress.success > span > span, .progress.success > span:after,
832 .progress.fail > span > span, .progress.fail > span:after {
833 -webkit-animation: none;
834 -moz-animation: none;
835 -ms-animation: none;
836 animation: none;
837 background-image: none;
838 }