PluginProbe ʕ •ᴥ•ʔ
Catch Scroll Progress Bar / trunk
Catch Scroll Progress Bar vtrunk
trunk 1.0.0 1.1 1.2 1.3 1.4 1.5 1.6 1.6.1 1.6.2 1.6.3 1.6.4 1.6.5 1.6.6 2.0 2.1 2.2
catch-scroll-progress-bar / admin / css / catch-scroll-progress-bar-admin.css
catch-scroll-progress-bar / admin / css Last commit date
catch-scroll-progress-bar-admin.css 6 years ago
catch-scroll-progress-bar-admin.css
841 lines
1 /**
2 * All of the CSS for your admin-dashboard functionality should be
3 * included in this file.
4 **/
5 #pts_post_type {
6 padding: 2px;
7 line-height: 28px;
8 height: 28px;
9 vertical-align: middle;
10 width: 100%;
11 }
12
13 .wpcatchtab.active,
14 table td strong {
15 display: block;
16 }
17
18 .show-more.button {
19 margin: 10px 0 5px 0;
20 }
21
22 .as-shortcode .new:hover .show-me,
23 .welcome-panel img,
24 .as-shortcode .new > div a,
25 .wpcatchtab.active,
26 #public-usage .content p strong,
27 table td strong {
28 display: block;
29 }
30
31 #public-usage .content {
32 display: -webkit-box;
33 display: -ms-flexbox;
34 display: flex;
35 -ms-flex-wrap: wrap;
36 flex-wrap: wrap;
37 }
38
39 #public-usage .content > .as-widget,
40 #public-usage .content > .as-shortcode {
41 -webkit-box-flex: 0;
42 -ms-flex: 0 1 100%;
43 flex: 0 1 100%;
44 }
45
46 .welcome-panel img {
47 height: 40px;
48 width: 40px;
49 vertical-align: middle;
50 margin: 0 auto 14px auto;
51 }
52
53 .welcome-panel .welcome-panel-column,
54 .welcome-panel .welcome-panel-column:first-child {
55 max-width: 980px;
56 width: 100%;
57 }
58
59 /* Form */
60 .show-more .dashicons {
61 vertical-align: middle;
62 }
63
64 .button.reset-token,
65 .button.reset-token:hover,
66 .button.reset-token:focus {
67 background-color: #d54e21;
68 border-color: #d54e21;
69 color: #fff;
70 }
71
72 .button.get-token,
73 .button.get-token:hover,
74 .button.get-token:focus {
75 background-color: #22D41A;
76 border-color: #22D41A;
77 color: #fff;
78 }
79
80 .as-shortcode .new {
81 position: relative;
82 }
83
84 .as-shortcode .new .dashicons,
85 .as-shortcode .button {
86 vertical-align: middle;
87 }
88
89 .as-shortcode .new > div a {
90 margin-bottom: 3px;
91 }
92
93 .as-shortcode .new>div {
94 display: none;
95 position: absolute;
96 right: -54px;
97 top: -1px;
98 }
99
100 #welcome-message {
101 border-radius: 4px;
102 margin-right: 20px;
103 margin-top: 10px;
104 padding: 1px 5px;
105 }
106
107 #access-token .info {
108 padding: 10px 12px;
109 }
110
111 #access-token .info,
112 #request-queries {
113 line-height: 2;
114 }
115
116 /* Custom Scripts */
117
118 .wrap {
119 position: relative;
120 margin: 25px 20px 0 10px;
121 -ms-word-wrap: break-word;
122 word-wrap: break-word;
123 }
124
125 .wrap,
126 .welcome-panel p,
127 .welcome-panel .welcome-panel-close::before,
128 .content .widefat td,
129 .content .widefat thead th {
130 color: #23282d;
131 }
132
133 .welcome-panel .welcome-panel-close::before {
134 left: inherit;
135 right: 10px;
136 z-index: 9;
137 }
138
139 .welcome-panel {
140 border-left: 4px solid #44b450;
141 margin: 21px 0;
142 padding-bottom: 21px;
143 padding-left: 21px;
144 padding-right: 21px;
145 }
146
147 .welcome-panel-content {
148 margin-left: 0;
149 }
150
151 .wrap h1,
152 .wrap h2,
153 .wrap h3,
154 .wrap h4,
155 .wrap h5,
156 .wrap h6,
157 .welcome-panel h3,
158 .wrap p,
159 .welcome-panel-column p,
160 #go-premium ul {
161 margin-top: 0;
162 }
163
164 .wrap a {
165 text-decoration: none;
166 }
167
168 .wrap a:hover,
169 .wrap a:focus {
170 opacity: 0.9;
171 }
172
173 .welcome-panel-column >:last-child,
174 #public-usage .content > div:last-child,
175 #public-usage .content .as-widget >:last-child,
176 #public-usage .content .as-shortcode >:last-child,
177 #public-usage .content .shortcode-option-container > div:last-child {
178 margin-bottom: 0;
179 }
180
181 .content-wrapper {
182 background-color: #fff;
183 position: relative;
184 }
185
186 .content-wrapper .content {
187 padding: 21px;
188 }
189
190 .content-wrapper .button.dismiss {
191 position: absolute;
192 right: 15px;
193 top: 15px;
194 background-color: transparent;
195 border: 0;
196 box-shadow: none;
197 padding: 0;
198 }
199
200 .content-wrapper h2,
201 .content-wrapper .header h3 {
202 margin: 0;
203 padding: 16px 21px;
204 }
205
206 .content-wrapper h2,
207 .content-wrapper .header h3,
208 .catch-sidebar-title,
209 .sidebar-spot-inner {
210 border-bottom: 1px solid #ddd;
211 }
212
213 .content-wrapper h2,
214 .content-wrapper .header h3,
215 .catchp-sidebar-spot h2,
216 .catchp-sidebar-full-width h2,
217 .widefat td,
218 .widefat thead th,
219 .about-text h2 {
220 font-size: 18px;
221 font-size: 1.125rem;
222 line-height: 1.5;
223 }
224
225 .welcome-panel .button {
226 border: none;
227 background: none;
228 box-shadow: none;
229 }
230
231 .welcome-panel .welcome-panel-close {
232 text-indent: -9999px;
233 }
234
235 .welcome-panel .welcome-panel-close::before {
236 font-size: 30px;
237 font-size: 1.875rem;
238 text-indent: 0;
239 }
240
241 .catchp-content-wrapper {
242 display: table;
243 width: 100%;
244 table-layout: fixed;
245 }
246
247 .wpcatchtab {
248 display: none;
249 }
250
251 .widefat thead th,
252 .table-icons {
253 font-weight: 600;
254 }
255
256 .content-wrapper .catchp-lists li strong {
257 font-weight: 700;
258 }
259
260 .wrap .content .as-shortcode .shortcode-option-container > div,
261 .about-text h2,
262 .wrap p,
263 .welcome-panel h3 {
264 margin-bottom: 14px;
265 }
266
267 .dashicons {
268 font-size: 25px;
269 font-size: 1.5625rem;
270 height: 25px;
271 width: 25px;
272 }
273
274 .sidebar-spot-inner ul li,
275 .catchp-sidebar-spot h3 {
276 margin-bottom: 7px;
277 }
278
279 .wrap .wpcatchtab,
280 #sidebar,
281 .content-wrapper {
282 margin-top: 21px;
283 }
284
285 .content-wrapper,
286 .sidebar-spot-inner,
287 .sidebar-spot-inner ul,
288 .catch-sidebar-title {
289 margin-bottom: 21px;
290 }
291
292 .catchp-sidebar-spot,
293 .catchp-sidebar-full-width {
294 float: left;
295 width: 100%;
296 box-sizing: border-box;
297 }
298
299 .sidebar-spot-inner {
300 padding-bottom: 21px;
301 }
302
303 .catchp-lists:before,
304 .catchp-lists:after,
305 .content-wrapper:before,
306 .content-wrapper:after,
307 .content-wrapper .content:before,
308 .content-wrapper .content:after {
309 content: "";
310 display: table;
311 table-layout: fixed;
312 }
313
314 .catchp-lists:after,
315 .content-wrapper:after,
316 .content-wrapper .content:after {
317 clear: both;
318 }
319
320 .catchp-lists li {
321 position: relative;
322 padding-left: 21px;
323 }
324
325 .catchp-lists li:before {
326 content:"\2713\0020";
327 left: 0;
328 font-weight: 700;
329 position: absolute;
330 }
331
332 #pro-screenshot .catchp-lists li {
333 padding-left: 0;
334 }
335
336 #pro-screenshot .catchp-lists li::before {
337 content: none;
338 }
339
340 .wp-ui-highlight {
341 background-color: #0073aa;
342 }
343
344 /*Sidebar*/
345 .catch-sidebar-title {
346 padding-bottom: 10px;
347 }
348
349 .catch-sidebar-title,
350 .catchp-sidebar-spot h3 {
351 font-size: 14px;
352 font-size: 0.875rem;
353 font-weight: 700;
354 }
355
356 .catchp-sidebar-spot h3 {
357 color: #444;
358 }
359
360 /*For Table*/
361 .table-icons {
362 font-size: 21px;
363 font-size: 1.3125rem;
364 display: inline-block;
365 }
366
367 .icon-green,
368 .highlighted {
369 color: #48a348;
370 }
371
372 .icon-red {
373 color: #c7353e;
374 }
375
376 #title,
377 #pro,
378 #free,
379 .fixed .column-free,
380 .fixed .column-pro,
381 .catchp-footer {
382 text-align: center;
383 }
384
385 img {
386 height: auto;
387 max-width: 100%;
388 }
389
390 table {
391 border-collapse: collapse;
392 border-spacing: 0;
393 }
394
395 table thead th {
396 padding: 14px;
397 }
398
399 #premium-extensions table,
400 #premium-extensions th,
401 #premium-extensions td {
402 border: 1px solid #ddd;
403 }
404
405 table td strong,
406 table td p {
407 letter-spacing: 0.01em;
408 }
409
410 dd,
411 li {
412 margin-bottom: 21px;
413 }
414
415 .widefat td p,
416 .catchp-lists li p {
417 margin-top: 7px;
418 }
419
420 .fixed .column-free,
421 .fixed .column-pro {
422 width: 15%;
423 }
424
425 .fixed .column-free,
426 .fixed .column-pro,
427 .widefat td {
428 vertical-align: middle;
429 }
430
431 .widefat td,
432 .widefat thead th {
433 padding: 14px 21px;
434 }
435
436 /*Footer*/
437 .catchp-footer {
438 margin-top: 14px;
439 border-bottom: 1px solid #fff;
440 }
441
442 .catchp-footer-menu ul li,
443 .catchp-footer-menu ul li a,
444 .catchp-footer-site-info a {
445 display: inline-block;
446 margin-bottom: 0;
447 }
448
449 .catchp-footer-menu ul {
450 margin: 0;
451 }
452
453 .catchp-footer-menu ul li a{
454 padding: 10px;
455 }
456
457 .catchp-footer-site-info {
458 border-bottom: 1px solid #ddd;
459 }
460
461 .catchp-footer-site-info a {
462 padding: 12px;
463 }
464
465 .catchp-footer-menu {
466 border-top: 1px solid #fff;
467 border-bottom: 1px solid #ddd;
468 }
469
470 .content-wrapper.col-1,
471 .content-wrapper.col-2 {
472 max-width: 735px;
473 }
474
475 #plugin-description {
476 max-width: 1200px;
477 }
478
479 /* => 667px */
480 @media screen and (min-width: 41.6875em) {
481 .shortcode-option-container {
482 display: flex;
483 flex-flow: row wrap;
484 }
485
486 .shortcode-option-container > div {
487 -webkit-box-flex: 0;
488 -ms-flex: 0 1 50%;
489 flex: 0 1 50%;
490 }
491
492 .welcome-panel h3 {
493 text-align: left;
494 }
495
496 .welcome-panel img {
497 display: inline-block;
498 margin-bottom: 0;
499 margin-right: 14px;
500 }
501
502 #public-usage .content {
503 display: -webkit-box;
504 display: -ms-flexbox;
505 display: flex;
506 -ms-flex-wrap: nowrap;
507 flex-wrap: nowrap;
508 }
509
510 #public-usage .content > .as-widget,
511 #public-usage .content > .as-shortcode {
512 -webkit-box-flex: 0;
513 -ms-flex: 0 1 50%;
514 flex: 0 1 50%;
515 }
516
517 #public-usage .content > .as-widget {
518 padding-right: 21px;
519 }
520
521 #public-usage .content > .as-shortcode {
522 border-left: 1px solid #ddd;
523 padding-left: 21px;
524 }
525
526 #public-usage .content > .as-widget,
527 #public-usage .content > .as-shortcode {
528 margin-bottom: 0;
529 }
530
531 .catchp-sidebar-spot {
532 width: 50%;
533 padding-right: 21px;
534 }
535
536 .catchp-sidebar-spot-wrapper .catchp-sidebar-spot:nth-of-type(even),
537 .col-2 .catchp-lists li:nth-of-type(even),
538 .col-3 .catchp-lists li:nth-child(2n),
539 .col-4 .catchp-lists li:nth-child(2n) {
540 padding-right: 0;
541 }
542
543 .catchp-footer {
544 margin-top: 21px;
545 }
546
547 .catchp-lists li {
548 display: inline-block;
549 float: left;
550 -webkit-box-sizing: border-box;
551 box-sizing: border-box;
552 width: 100%;
553 }
554
555 .content-wrapper.col-3 {
556 max-width: 100%;
557 width: 100%;
558 }
559
560 .col-2 .catchp-lists li,
561 .col-3 .catchp-lists li,
562 .col-4 .catchp-lists li,
563 .module-container .module-wrap {
564 width: 50%;
565 }
566
567 .col-2 .catchp-lists li,
568 .col-3 .catchp-lists li,
569 .col-4 .catchp-lists li {
570 padding-right: 21px;
571 }
572
573 .module-wrap {
574 padding-right: 21px;
575 }
576
577 .module-container .module-wrap:nth-child(2n) {
578 padding-right: 0;
579 }
580 }
581
582 /* => 783px */
583 @media screen and (min-width: 48.9375em) {
584 .wrap {
585 margin-right: 30px;
586 }
587
588 .form-table input[type="text"],
589 .form-table input[type="search"],
590 .form-table input[type="radio"],
591 .form-table input[type="tel"],
592 .form-table input[type="time"],
593 .form-table input[type="url"],
594 .form-table input[type="week"],
595 .form-table input[type="password"],
596 .form-table input[type="checkbox"],
597 .form-table input[type="color"],
598 .form-table input[type="date"],
599 .form-table input[type="datetime"],
600 .form-table input[type="datetime-local"],
601 .form-table input[type="email"],
602 .form-table input[type="month"],
603 .form-table input[type="number"],
604 .form-table select,
605 .form-table textarea {
606 margin-right: 10px;
607 display: inline-block;
608 }
609
610 .form-table td span {
611 display: inline-block;
612 }
613
614 h3.option-toggle a {
615 background-position: 99% 50%;
616 }
617
618 h3.option-active a {
619 background-position: 99% 50%;
620 }
621 }
622
623 /* => 1024px */
624 @media screen and (min-width: 64em) {
625 .catchp-sidebar-spot-wrapper .catchp-sidebar-spot,
626 .catchp-sidebar-spot-wrapper .catchp-sidebar-spot:nth-of-type(even),
627 .col-3 .catchp-lists li:nth-child(2n) {
628 padding-right: 21px;
629 }
630
631 .catchp-sidebar-spot-wrapper .catchp-sidebar-spot:nth-child(3n) {
632 padding-right: 0;
633 }
634
635 .catchp-sidebar-spot,
636 .col-3 .catchp-lists li {
637 width: 33.33%;
638 }
639
640 .col-3 .catchp-lists li:nth-child(3n) {
641 padding-right: 0;
642 }
643
644 .table-icons {
645 font-size: 30px;
646 font-size: 1.875rem;
647 }
648 }
649
650 /* => 1200px */
651 @media screen and (min-width: 75em) {
652 .welcome-panel .welcome-panel-close::before,
653 .welcome-panel .welcome-panel-close {
654 top: 50%;
655 transform: translateY(-50%);
656 }
657
658 .welcome-panel {
659 padding-right: 49px;
660 }
661
662 .catchp_widget_settings,
663 .catchp-widget-sidebar {
664 display: table-cell;
665 vertical-align: top;
666 }
667
668 .catchp_widget_settings,
669 .catchp-sidebar-spot,
670 .col-2 .sidebar-spot-inner .catchp-lists li,
671 .col-3 .sidebar-spot-inner .catchp-lists li {
672 width: 100%;
673 }
674
675 .catchp-widget-sidebar {
676 width: 245px;
677 padding: 0 0 0 200px;
678 }
679
680 #sidebar {
681 margin-top: 66px;
682 }
683
684 .col-4 .catchp-lists li,
685 .col-4 .catchp-lists li:nth-child(2n) {
686 padding-right: 21px;
687 }
688
689 .catchp-sidebar-spot,
690 .catchp-sidebar-spot-wrapper .catchp-sidebar-spot,
691 .catchp-sidebar-spot-wrapper .catchp-sidebar-spot:nth-of-type(even),
692 .col-2 .sidebar-spot-inner .catchp-lists li,
693 .col-3 .sidebar-spot-inner .catchp-lists li,
694 .col-4 .catchp-lists li:nth-child(4n) {
695 padding-right: 0;
696 }
697
698 .catchp-sidebar-spot:last-child .sidebar-spot-inner {
699 border: 0;
700 }
701
702 .catchp-footer {
703 margin-top: 160px;
704 }
705
706 .col-4 .catchp-lists li {
707 width: 25%;
708 }
709
710 .module-container .module-wrap {
711 width: 33.33%;
712 }
713
714 .module-container .module-wrap:nth-child(2n) {
715 padding-right: 21px;
716 }
717
718 .module-container .module-wrap:nth-child(3n) {
719 padding-right: 0;
720 }
721 }
722 /* jQuery UI Tooltip CSS */
723 .ui-tooltip {
724 padding: 8px;
725 position: absolute;
726 z-index: 9999;
727 max-width: 300px;
728 }
729 body .ui-tooltip {
730 border-width: 2px;
731 }
732
733 .ui-widget-content {
734 background: #ffffff;
735 }
736
737 .ui-widget.ui-widget-content {
738 border: 1px solid #c5c5c5;
739 }
740
741 .tooltip {
742 cursor: pointer;
743 }
744 /*--------------------------------------------------------------
745 # Toggle Switch
746 --------------------------------------------------------------*/
747 .catch-scroll-progress-main .switch {
748 -webkit-box-flex: 0;
749 -webkit-flex-grow: 0;
750 -moz-box-flex: 0;
751 -ms-flex-positive: 0;
752 flex-grow: 0;
753 -webkit-flex-shrink: 0;
754 -ms-flex-negative: 0;
755 flex-shrink: 0;
756 position: relative;
757 float: none;
758 right: 0;
759 top: 2px;
760 }
761
762 .catch-scroll-progress-main .module-title.active {
763 background-color: #0085c3;
764 }
765
766 .catch-scroll-progress-main .switch label {
767 background-color: #48a348;
768 border-radius: 11px;
769 cursor: pointer;
770 height: 16px;
771 right:0;
772 position: absolute;
773 top: 3px;
774 width: 30px;
775 }
776
777 .catch-scroll-progress-main .inactive .switch label {
778 background-color: #ccc;
779 }
780
781 .catch-scroll-progress-main .switch input[type="checkbox"] {
782 visibility: hidden;
783 display: none;
784 }
785
786 .catch-scroll-progress-main .switch label:after {
787 background-color: #fff;
788 border-radius: 100%;
789 content: '';
790 height: 12px;
791 left: 2px;
792 position: absolute;
793 -webkit-transition: all 0.2s ease-in-out;
794 -moz-transition: all 0.2s ease-in-out;
795 o-transition: all 0.2s ease-in-out;
796 transition: all 0.2s ease-in-out;
797 top: 2px;
798 width: 12px;
799 }
800
801 .catch-scroll-progress-main .switch input[type="checkbox"]:checked + label:after {
802 left: 16px;
803 background-color: #fff;
804 }
805
806 .catch-scroll-progress-main .loader {
807 border: 5px solid #48a348;
808 border-radius: 50%;
809 border-top: 2px solid transparent;
810 width: 20px;
811 height: 20px;
812 -webkit-animation: spin 2s linear infinite;
813 animation: spin 2s linear infinite;
814 position: absolute;
815 right: 60px;
816 display: none;
817 }
818
819 @-webkit-keyframes spin {
820 0% { -webkit-transform: rotate(0deg); }
821 100% { -webkit-transform: rotate(360deg); }
822 }
823
824 @keyframes spin {
825 0% { transform: rotate(0deg); }
826 100% { transform: rotate(360deg); }
827 }
828
829 /* Catch Themes & Plugins switch */
830 #ctp-switch .switch {
831 position: relative;
832 display: inline-block;
833 width: 60px;
834 height: 34px;
835 top: 7px;
836 }
837
838 #ctp-switch.catch-scroll-progress-main .module-header {
839 background-color: transparent;
840 }
841