PluginProbe
Jetpack – WP Security, Backup, Speed, & Growth / 11.5.2
Jetpack – WP Security, Backup, Speed, & Growth v11.5.2
16.2-beta 12.0.3 12.1.3 12.2.3 12.3.2 12.4.2 12.5.2 12.6.4 12.7.3 12.8.3 12.9.5 13.0.2 13.1.5 13.2.4 13.3.3 13.4.5 13.5.2 13.6.2 13.7.2 13.8.3 13.9.2 14.0.1 14.1.1 14.2.2 14.3.1 All 501 releases
jetpack / css / jetpack-admin.css

jetpack-admin.css in Jetpack – WP Security, Backup, Speed, & Growth 11.5.2, at css/jetpack-admin.css

1,367 lines 24.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .j-row {
2 width: 100%;
3 margin: 0 auto;
4 }
5 .j-row:before, .j-row:after {
6 content: " ";
7 display: table;
8 }
9 .j-row:after {
10 clear: both;
11 }
12
13 .j-col {
14 padding: 0.85em;
15 width: 100%;
16 float: left;
17 position: relative;
18 }
19
20 @media only screen {
21 .j-sm-5 {
22 width: 41.66667%;
23 }
24
25 .j-sm-7 {
26 width: 58.33333%;
27 }
28
29 .j-sm-12 {
30 width: 100%;
31 }
32 }
33 @media (min-width: 530px) {
34 .j-md-4 {
35 width: 33.33333%;
36 }
37
38 .j-md-6 {
39 width: 50%;
40 }
41
42 .j-md-8 {
43 width: 66.66667%;
44 }
45
46 .j-md-12 {
47 width: 100%;
48 }
49 }
50 @media (min-width: 782px) {
51 .j-lrg-4 {
52 width: 33.33333%;
53 }
54
55 .j-lrg-5 {
56 width: 41.66667%;
57 }
58
59 .j-lrg-6 {
60 width: 50%;
61 }
62
63 .j-lrg-7 {
64 width: 58.33333%;
65 }
66
67 .j-lrg-8 {
68 width: 66.66667%;
69 }
70
71 .j-lrg-12 {
72 width: 100%;
73 }
74 }
75 @keyframes jetpack-candy {
76 0% {
77 transform: scale(1);
78 }
79 20% {
80 transform: scale(1.15);
81 }
82 60% {
83 transform: scale(0.95);
84 }
85 100% {
86 transform: scale(1);
87 }
88 }
89 @keyframes jetpack-loading-fade {
90 0% {
91 opacity: 0.5;
92 }
93 50% {
94 opacity: 1;
95 }
96 100% {
97 opacity: 0.5;
98 }
99 }
100 @keyframes jetpack-rotate {
101 to {
102 transform: rotate(1turn);
103 }
104 }
105 .button,
106 .download-jetpack {
107 transition: all 0.1s ease-in-out;
108 }
109
110 .jp-button, .jp-button--settings {
111 display: inline-block;
112 position: relative;
113 padding: 0.7692307692em 1.4615384615em;
114 color: #efefef;
115 font-weight: bold;
116 font-size: 0.9285714286em;
117 line-height: 1;
118 text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
119 background: #6f7476;
120 border-radius: 3px;
121 }
122 .jp-button:visited, .jp-button--settings:visited {
123 color: #efefef;
124 }
125 .jp-button:hover, .jp-button--settings:hover, .jp-button:focus, .jp-button--settings:focus {
126 color: #fff;
127 background: #57972d;
128 }
129 .jp-button:active, .jp-button--settings:active {
130 background: #57972d;
131 opacity: 0.8;
132 }
133
134 .jp-button--settings {
135 background: #93b45f;
136 color: #e8eedf;
137 }
138 .jp-button--settings:visited {
139 color: #e8eedf;
140 }
141 .jp-button--settings:hover, .jp-button--settings:focus {
142 background: #9fbd72;
143 color: #fff;
144 }
145 .jp-button--settings.current {
146 background: #3c6621;
147 color: #fff;
148 box-shadow: inset 0 2px 0 #365A1F, inset 0 1px 3px #3c6621;
149 }
150
151 .download-jetpack {
152 display: inline-block;
153 position: relative;
154 padding: 0.6428571429em 1.0869565217em 0.5357142857em;
155 color: #fff;
156 font-weight: 400;
157 font-size: 20px;
158 line-height: 1;
159 background: #518d2a;
160 z-index: 3;
161 border-radius: 6px;
162 box-shadow: 0 6px 0 #3e6c20, 0 6px 3px rgba(0, 0, 0, 0.4);
163 }
164 .download-jetpack:visited {
165 color: #fff;
166 }
167 .download-jetpack:hover, .download-jetpack:focus {
168 color: #fff;
169 background: #57972d;
170 box-shadow: 0 6px 0 #3e6c20, 0 6px 3px rgba(0, 0, 0, 0.4);
171 }
172 .download-jetpack:active {
173 top: 6px;
174 box-shadow: 0 0px 0 #3e6c20, 0 0 0 rgba(0, 0, 0, 0.4);
175 }
176 .download-jetpack:active:after {
177 top: -6px;
178 }
179 .download-jetpack:before {
180 content: "";
181 display: inline-block;
182 position: relative;
183 top: -2px;
184 margin-right: 13px;
185 width: 30px;
186 height: 30px;
187 vertical-align: middle;
188 background: url(../images/connect-plug.svg) center center no-repeat;
189 background-size: 100%;
190 }
191 .download-jetpack:after {
192 content: "";
193 position: absolute;
194 top: 0;
195 left: 0;
196 width: 100%;
197 height: 100%;
198 }
199 @media (max-width: 1147px) {
200 .download-jetpack {
201 font-size: 1.2857142857em;
202 }
203 .download-jetpack:before {
204 top: -1px;
205 width: 23px;
206 height: 23px;
207 }
208 }
209 @media (max-width: 900px) {
210 .download-jetpack:active {
211 top: 0;
212 }
213 }
214 @media (max-width: 530px) {
215 .download-jetpack {
216 font-size: 1.2142857143em;
217 font-weight: 600;
218 }
219 .download-jetpack:before {
220 width: 19px;
221 height: 19px;
222 margin-right: 9px;
223 }
224 }
225
226 .jp-spinner {
227 display: flex;
228 align-items: center;
229 }
230
231 .jp-spinner__inner,
232 .jp-spinner__outer {
233 margin: auto;
234 box-sizing: border-box;
235 border: 0.1em solid transparent;
236 border-radius: 50%;
237 border-top-color: #00aadc;
238 animation: 3s linear infinite;
239 animation-name: jetpack-rotate;
240 }
241
242 .jp-spinner__outer {
243 width: 20px;
244 height: 20px;
245 font-size: 20px;
246 }
247
248 .jp-spinner__inner {
249 width: 100%;
250 height: 100%;
251 border-right-color: #00aadc;
252 opacity: 0.4;
253 }
254
255 @font-face {
256 font-family: "automatticons";
257 src: url(../_inc/fonts/automatticons/automatticons.eot);
258 src: url(../_inc/fonts/automatticons/automatticons.eot?#iefix) format("embedded-opentype"), url(../_inc/fonts/automatticons/automatticons.woff) format("woff"), url(../_inc/fonts/automatticons/automatticons.ttf) format("truetype"), url(../_inc/fonts/automatticons/automatticons.svg#automatticonsregular) format("svg");
259 font-weight: normal;
260 font-style: normal;
261 }
262 .nav-horizontal:after {
263 content: ".";
264 display: block;
265 height: 0;
266 clear: both;
267 visibility: hidden;
268 }
269 .nav-horizontal a {
270 display: inline-block;
271 }
272 .nav-horizontal li {
273 position: relative;
274 float: left;
275 }
276 .nav-horizontal ul {
277 margin: 0;
278 padding: 0;
279 }
280
281 @media (max-width: 782px) {
282 .configure .frame.top.fixed {
283 padding-left: 0;
284 }
285 }
286
287 .wrap.inner,
288 .page-content {
289 max-width: 950px;
290 margin: 0 auto;
291 }
292 .wrap.inner li,
293 .page-content li {
294 line-height: 23px;
295 }
296
297 @media (max-width: 530px) {
298 .page-content {
299 margin-top: 0;
300 }
301 }
302
303 @media (max-width: 1147px) {
304 .wrap.inner {
305 background: #f6f7f7;
306 padding: 15px;
307 }
308 }
309 @media (max-width: 530px) {
310 .wrap.inner {
311 margin-top: 1.7142857143em;
312 }
313 }
314
315 .page-content.about {
316 position: relative;
317 z-index: 10;
318 }
319 @media (max-width: 1147px) {
320 .page-content.about {
321 background: #f6f7f7;
322 padding: 15px;
323 }
324 }
325
326 @media (max-width: 1147px) {
327 .page-content.configure {
328 background: #f6f7f7;
329 }
330 }
331
332 .footer nav {
333 max-width: 550px;
334 margin: 0 auto;
335 }
336
337 .header {
338 left: 0;
339 right: 0;
340 background: #81a844;
341 }
342
343 .header-nav li {
344 line-height: 60px;
345 }
346 .header-nav a {
347 padding: 0 0.7142857143em;
348 line-height: 24px;
349 }
350 .header-nav .jetpack-logo a {
351 display: inline-block;
352 position: relative;
353 width: 214px;
354 margin-right: 6px;
355 background: url(../images/jetpack-logo.png) center center no-repeat;
356 background: url(../images/jetpack-logo.svg) center center no-repeat, none;
357 background-size: 183px auto;
358 color: #fff;
359 line-height: 60px;
360 font-weight: normal;
361 }
362 .header-nav .jetpack-logo a span {
363 text-indent: -9999px;
364 visibility: hidden;
365 }
366 .header-nav .jetpack-logo a:before {
367 content: "";
368 position: absolute;
369 top: 0;
370 left: 0;
371 width: 100%;
372 height: 100%;
373 background-size: 183px 32px;
374 }
375 .header-nav .jetpack-modules + .jetpack-modules {
376 margin-left: 15px;
377 }
378
379 .main-nav {
380 float: left;
381 }
382 .main-nav li {
383 margin: 0;
384 }
385 @media (max-width: 900px) {
386 .main-nav {
387 font-size: 13px;
388 }
389 }
390
391 .jetpack-pagestyles #screen-meta {
392 margin: 0;
393 }
394 .jetpack-pagestyles #screen-meta-links .screen-meta-toggle {
395 z-index: 2;
396 }
397 .jetpack-pagestyles #screen-options-link-wrap, .jetpack-pagestyles #contextual-help-link-wrap {
398 border: none;
399 }
400 .jetpack-pagestyles .update-nag {
401 display: none;
402 }
403
404 .loading {
405 bottom: 50%;
406 position: absolute;
407 top: 50%;
408 width: 100%;
409 }
410 .loading span {
411 color: #999;
412 }
413
414 .modal {
415 background: #fff;
416 position: fixed;
417 top: 52px;
418 bottom: 20px;
419 right: 20px;
420 left: 20px;
421 margin-left: 160px;
422 display: none;
423 box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1);
424 z-index: 500;
425 }
426 .modal .close {
427 position: absolute;
428 top: 0;
429 right: 0;
430 font: 300 1.7142857143em "genericons" !important;
431 color: #777;
432 content: "\f405";
433 display: inline-block;
434 padding: 0.2857142857em 0.7142857143em 0.4285714286em;
435 z-index: 5;
436 }
437 .modal .close:hover {
438 background: #f0f0f1;
439 opacity: 0.8;
440 }
441 .modal .close:active {
442 background: #f0f0f1;
443 opacity: 0.4;
444 }
445 .modal .content-container {
446 position: absolute;
447 top: 0;
448 right: 0;
449 bottom: 0;
450 left: 0;
451 overflow: auto;
452 padding: 2.1428571429em;
453 }
454 .modal .content {
455 margin: 0 auto;
456 max-width: 900px;
457 text-align: left;
458 }
459 .modal h2 {
460 text-align: left;
461 margin-top: 0;
462 color: #5d6d74;
463 font-weight: 300;
464 line-height: 32px;
465 text-shadow: 0 1px 1px #fff;
466 }
467 @media (max-width: 530px) {
468 .modal h2 {
469 font-size: 26px;
470 }
471 }
472 .modal h5 {
473 clear: left;
474 }
475 .modal p {
476 font-size: 1.2307692308em;
477 }
478 .modal footer {
479 position: absolute;
480 left: 0;
481 bottom: 0;
482 width: 100%;
483 padding: 12px 20px;
484 border-top: 1px solid #dcdcde;
485 background: #fff;
486 text-align: right;
487 }
488 .modal footer ul {
489 margin: 0;
490 }
491 .modal footer li {
492 display: inline-block;
493 margin: 0;
494 }
495 .modal .button-secondary,
496 .modal .button-primary:active {
497 vertical-align: baseline;
498 }
499 @media (max-width: 900px) {
500 .modal {
501 bottom: 5%;
502 margin-left: 36px;
503 font-size: 80%;
504 }
505 .modal .content {
506 top: 38px;
507 }
508 }
509 @media (max-width: 782px) {
510 .modal {
511 top: 66px;
512 margin-left: 0;
513 }
514 }
515 @media (max-width: 600px) {
516 .modal {
517 top: 10px;
518 right: 10px;
519 bottom: 10px;
520 left: 10px;
521 }
522 }
523
524 .jp-info-img {
525 float: right;
526 margin: 0 0 8px 30px;
527 }
528 .jp-info-img img {
529 border: 1px solid #dcdcde;
530 max-width: 100%;
531 height: auto;
532 }
533 .jp-info-img img:first-child {
534 margin-top: 0;
535 }
536 @media (max-width: 782px) {
537 .jp-info-img {
538 float: none;
539 margin: 0 0 15px;
540 }
541 }
542
543 .content-container.modal-footer {
544 bottom: 53px;
545 }
546
547 .shade {
548 background: #000;
549 bottom: 0;
550 cursor: pointer;
551 display: none;
552 left: 0;
553 opacity: 0.2;
554 position: fixed;
555 right: 0;
556 top: 0;
557 z-index: 11;
558 }
559
560 .footer {
561 margin-top: 1.4285714286em;
562 position: relative;
563 padding: 10em 0 4.2857142857em;
564 text-align: center;
565 }
566 .footer:before, .footer:after {
567 content: "";
568 position: absolute;
569 left: 0;
570 pointer-events: none;
571 }
572 .footer:before {
573 top: 0;
574 margin-top: -1px;
575 width: 100%;
576 height: 195px;
577 }
578 .footer:after {
579 display: none;
580 }
581 .footer .download-jetpack {
582 margin-bottom: 33px;
583 }
584 @media (min-width: 1147px) {
585 .footer {
586 padding-bottom: 35px;
587 }
588 }
589 @media (max-width: 1147px) {
590 .footer {
591 padding-top: 165px;
592 padding-bottom: 0;
593 }
594 .footer:before {
595 background-size: 160% auto;
596 }
597 .footer ul {
598 float: none;
599 overflow: hidden;
600 }
601 }
602 @media (max-width: 900px) {
603 .footer {
604 padding-top: 146px;
605 }
606 }
607 @media (max-width: 782px) {
608 .footer {
609 margin-top: 0;
610 }
611 }
612 @media (max-width: 530px) {
613 .footer {
614 margin-top: 0;
615 padding-top: 135px;
616 }
617 }
618 @media (max-width: 320px) {
619 .footer {
620 padding-top: 76px;
621 }
622 }
623
624 .footer nav {
625 max-width: 100%;
626 }
627 .footer nav a,
628 .footer nav a:visited {
629 padding: 4px 6px;
630 color: #999;
631 }
632 .footer nav a:hover, .footer nav a:focus,
633 .footer nav a:visited:hover,
634 .footer nav a:visited:focus {
635 color: #81A844;
636 }
637 @media (max-width: 1147px) {
638 .footer nav a:hover, .footer nav a:focus,
639 .footer nav a:visited:hover,
640 .footer nav a:visited:focus {
641 color: #81a844;
642 }
643 }
644 @media (max-width: 530px) {
645 .footer nav li {
646 display: block;
647 float: none;
648 margin: 0;
649 text-align: left;
650 }
651 .footer nav a {
652 display: block;
653 padding: 0 16px;
654 line-height: 44px;
655 }
656 }
657
658 .primary {
659 padding: 25px 15px 10px 15px;
660 border-bottom: 1px solid #f0f0f1;
661 }
662
663 .secondary-footer {
664 margin: 0 auto;
665 }
666 .secondary-footer li {
667 margin-right: 5px;
668 }
669 @media (min-width: 782px) {
670 .secondary-footer {
671 padding: 8px 15px 10px;
672 margin-bottom: 30px;
673 border-bottom: 1px solid #f0f0f1;
674 }
675 }
676 @media (min-width: 1147px) {
677 .secondary-footer {
678 margin-bottom: 0;
679 }
680 }
681 @media (max-width: 782px) {
682 .secondary-footer {
683 padding: 8px 15px 8px;
684 border-bottom: none;
685 }
686 }
687 @media (max-width: 530px) {
688 .secondary-footer {
689 margin: 0;
690 padding: 0;
691 border: none;
692 font-weight: 400;
693 }
694 .secondary-footer a {
695 border-top: 1px solid #f0f0f1;
696 }
697 }
698
699 .footer .a8c-attribution {
700 margin: 0;
701 padding: 0 6px;
702 color: #bbb;
703 font-size: 0.7857142857em;
704 font-family: "Gill Sans", "Gill Sans MT", Helvetica, Arial, sans-serif;
705 text-transform: uppercase;
706 }
707 .footer .a8c-attribution a {
708 display: inline-block;
709 position: relative;
710 padding: 4px 16px;
711 right: 9999px;
712 outline: 0;
713 }
714 .footer .a8c-attribution a:after {
715 content: "A";
716 position: absolute;
717 top: 2px;
718 right: -9999px;
719 height: 100%;
720 color: #999;
721 font-size: 1.5454545455em;
722 font-family: "automatticons";
723 text-align: center;
724 }
725 .footer .a8c-attribution a:hover:after {
726 animation: jetpack-candy 0.4s ease-in-out;
727 }
728
729 @media (min-width: 782px) {
730 .secondary {
731 padding: 0 15px 10px 15px;
732 border-bottom: 1px solid #f0f0f1;
733 }
734 }
735 @media (min-width: 1147px) {
736 .secondary {
737 padding: 0 15px 10px 15px;
738 border-bottom: none;
739 }
740 }
741
742 .jetpack-message {
743 background: #8eb74e;
744 border: 1px solid #73963d;
745 margin: 33px auto 0;
746 max-width: 90%;
747 position: relative;
748 z-index: 2;
749 }
750 .jetpack-message.is-opt-in {
751 margin: 50px 0 0;
752 max-width: 100%;
753 padding: 10px 15px;
754 background: #fff;
755 border: 0;
756 box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
757 font-size: 13px;
758 text-align: center;
759 }
760 .subhead .jetpack-message.is-opt-in {
761 margin: 0;
762 padding-bottom: 0;
763 background: transparent;
764 box-shadow: none;
765 }
766 .subhead .jetpack-message.is-opt-in .jp-button, .subhead .jetpack-message.is-opt-in .jp-button--settings {
767 display: inline-block;
768 }
769 .jetpack-message.is-opt-in p {
770 color: #3c4549;
771 }
772 .jetpack-message.is-opt-in .jp-button, .jetpack-message.is-opt-in .jp-button--settings {
773 margin-top: 15px;
774 display: none;
775 }
776 .jetpack-message .squeezer h2 {
777 font-size: 1em;
778 }
779 .jetpack-message h2 {
780 color: #fff;
781 margin: 0;
782 }
783 .jetpack-message p {
784 color: #fff;
785 margin: 0;
786 opacity: 0.7;
787 }
788 .jetpack-message .squeezer {
789 padding: 23px 23px 23px 80px;
790 position: relative;
791 text-align: left;
792 }
793 .jetpack-message .squeezer:before {
794 color: #fff;
795 content: "\f418";
796 font-family: "Genericons";
797 font-size: 33px;
798 height: 33px;
799 left: 25px;
800 opacity: 0.6;
801 position: absolute;
802 top: 23px;
803 top: calc( 50% - 22px );
804 }
805 @media (max-width: 530px) {
806 .jetpack-message .squeezer {
807 padding: 23px;
808 }
809 .jetpack-message .squeezer:before {
810 display: none;
811 }
812 }
813 .jetpack-message .squeezer a {
814 color: #FFF;
815 border-bottom: 1px solid #D5E4BD;
816 }
817 .jetpack-message .squeezer a:hover {
818 border-bottom: 1px solid #F1F6E9;
819 }
820 .jetpack-message.error .squeezer:before, .jetpack-message.jetpack-err .squeezer:before {
821 content: "\f414";
822 }
823
824 .configure-module .jetpack-message {
825 max-width: 100%;
826 }
827
828 @media (max-width: 530px) {
829 .wrap.inner.jp-support .jp-support-column-left {
830 width: 100%;
831 }
832 .wrap.inner.jp-support .jp-support-column-left .widget-text {
833 margin-right: 0;
834 width: 100%;
835 }
836 .wrap.inner.jp-support .jp-support-column-right {
837 width: 100%;
838 }
839 }
840 @media screen and (max-width: 515px) {
841 .jp-frame .header-nav {
842 padding-bottom: 10px;
843 }
844 .jp-frame .header-nav li {
845 line-height: 30px;
846 }
847 .jp-frame .header-nav .jetpack-logo {
848 width: 100%;
849 text-align: center;
850 }
851 .jp-frame .header-nav .jetpack-modules {
852 margin: 0;
853 width: 50%;
854 text-align: right;
855 padding: 0 5px;
856 }
857 .jp-frame .header-nav .jetpack-modules + .jetpack-modules {
858 text-align: left;
859 }
860 .jp-frame .header-nav .jetpack-modules:nth-child(4) {
861 text-align: center;
862 margin: 0 auto;
863 width: 100%;
864 }
865 .jp-frame .header-nav .jetpack-modules:nth-child(4) a {
866 padding: 0 10px;
867 }
868 }
869 #ie-legacy-notice .dops-notice__content {
870 display: inline-block;
871 margin-left: 10px;
872 }
873
874 .page-content.configure {
875 margin-top: 0;
876 }
877
878 .configure .frame.top {
879 border: none;
880 box-shadow: none;
881 padding-top: 1.4285714286em;
882 position: relative;
883 top: auto;
884 }
885 .configure .frame.top.fixed {
886 background: #f6f7f7;
887 border-bottom: 1px solid #e9e9e9;
888 padding-left: 160px;
889 margin-top: -6px;
890 position: fixed;
891 right: 0;
892 top: 32px;
893 width: 100%;
894 z-index: 4;
895 box-shadow: 0 2px 2px -2px #f0f0f1;
896 }
897 @media (max-width: 782px) {
898 .configure .frame.top.fixed {
899 border: none;
900 box-shadow: none;
901 padding-top: 1.4285714286em;
902 position: relative;
903 top: auto;
904 }
905 }
906 @media (max-width: 600px) {
907 .configure .frame.top.fixed {
908 top: 0;
909 }
910 }
911
912 .jp-frame-top-fixed .configure {
913 padding-top: 94px;
914 }
915
916 .filter-search {
917 display: none;
918 float: right;
919 margin-top: 10px;
920 }
921 @media (max-width: 782px) {
922 .filter-search {
923 display: block;
924 }
925 }
926 @media (max-width: 530px) {
927 .filter-search {
928 display: none;
929 }
930 }
931
932 .table-bordered.jetpack-modules {
933 border: none;
934 margin-bottom: 0;
935 }
936 .table-bordered.jetpack-modules tr.jetpack-module th {
937 border-left: 0;
938 padding: 14px 4px 0;
939 }
940 .table-bordered.jetpack-modules tr.jetpack-module th input {
941 display: block;
942 }
943 .table-bordered.jetpack-modules tr.jetpack-module:hover .genericon {
944 display: inline-block;
945 }
946 .table-bordered.jetpack-modules tr.jetpack-module.active th,
947 .table-bordered.jetpack-modules tr.jetpack-module.active td {
948 background: #f7fcfe;
949 }
950 .table-bordered.jetpack-modules tr.jetpack-module.active th {
951 border-left: 4px solid #2ea2cc;
952 padding-left: 0px;
953 }
954 .table-bordered.jetpack-modules tr.jetpack-module.active td:first-child {
955 border-left: 4px solid #2ea2cc;
956 }
957 .table-bordered.jetpack-modules tr.jetpack-module.unavailable input {
958 display: none;
959 }
960 .table-bordered.jetpack-modules tr.jetpack-module.deprecated span {
961 color: #888;
962 }
963 .table-bordered.jetpack-modules tr.jetpack-module.deprecated .dep-msg {
964 margin-right: 10px;
965 color: #555;
966 }
967 .table-bordered.jetpack-modules tr.jetpack-module th,
968 .table-bordered.jetpack-modules tr.jetpack-module td {
969 background: #fff;
970 margin: 0;
971 box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
972 }
973 .table-bordered.jetpack-modules tr.jetpack-module td {
974 padding: 10px 10px 8px 14px;
975 line-height: 25px;
976 }
977 .table-bordered.jetpack-modules tr.jetpack-module td:first-child {
978 border-left: 4px solid #fff;
979 }
980 .table-bordered.jetpack-modules tr.jetpack-module td .row-actions {
981 float: right;
982 padding: 0 0 1px;
983 visibility: visible;
984 position: static;
985 }
986 .table-bordered.jetpack-modules tr.jetpack-module td .row-actions span {
987 margin-left: 5px;
988 }
989 @media (max-width: 530px) {
990 .table-bordered.jetpack-modules tr.jetpack-module td .row-actions {
991 display: none;
992 }
993 }
994 @media (max-width: 782px) {
995 .table-bordered.jetpack-modules tr.jetpack-module td .row-actions {
996 display: block;
997 padding-left: 10px;
998 visibility: visible;
999 }
1000 }
1001 .table-bordered.jetpack-modules tr.jetpack-module td .row-actions span.unavailable_reason {
1002 color: #000;
1003 }
1004 .table-bordered.jetpack-modules.with-transparency tr.jetpack-module:hover td .row-actions span a {
1005 opacity: 1;
1006 }
1007 .table-bordered.jetpack-modules.with-transparency tr.jetpack-module.unavailable {
1008 opacity: 0.3;
1009 }
1010 .table-bordered.jetpack-modules > thead > tr > th {
1011 border: 0;
1012 vertical-align: middle;
1013 }
1014 .table-bordered.jetpack-modules > thead > tr > th:last-child {
1015 padding-right: 0;
1016 }
1017 @media (max-width: 782px) {
1018 .table-bordered.jetpack-modules > thead > tr > th:last-child {
1019 padding-left: 0;
1020 }
1021 }
1022 .table-bordered.jetpack-modules td {
1023 background: #fff;
1024 }
1025 .table-bordered.jetpack-modules #doaction {
1026 margin-top: 0;
1027 }
1028 @media (max-width: 782px) {
1029 .table-bordered.jetpack-modules #doaction {
1030 padding: 10px 7px;
1031 }
1032 }
1033 .table-bordered.jetpack-modules .checkall {
1034 margin-top: 1px;
1035 }
1036 .table-bordered.jetpack-modules .filter-search {
1037 margin-top: 8px;
1038 }
1039 .table-bordered.jetpack-modules .genericon {
1040 color: #999;
1041 display: none;
1042 margin: 7px 3px 0;
1043 }
1044 @media (max-width: 900px) {
1045 .table-bordered.jetpack-modules .genericon {
1046 display: inline-block;
1047 }
1048 }
1049 .table-bordered.jetpack-modules .med {
1050 width: 70px;
1051 }
1052 .table-bordered.jetpack-modules .sm {
1053 width: 30px;
1054 }
1055 @media (max-width: 782px) {
1056 .table-bordered.jetpack-modules .check-column {
1057 width: 50px;
1058 }
1059 }
1060
1061 .fixed-top .check-column {
1062 padding: 8px 10px 0 10px;
1063 width: 2.2em;
1064 }
1065
1066 .wrap {
1067 margin: 0;
1068 padding: 0 1.5em 1em;
1069 overflow: hidden;
1070 }
1071 .wrap h2 {
1072 font-size: 24px;
1073 font-weight: 400;
1074 }
1075 .wrap .manage-left {
1076 float: left;
1077 margin: 0;
1078 padding: 0;
1079 width: 63%;
1080 }
1081 .wrap .manage-left table {
1082 width: 100%;
1083 }
1084 .wrap .manage-left th {
1085 font-weight: 400;
1086 }
1087 @media (max-width: 782px) {
1088 .wrap .manage-left {
1089 width: 100%;
1090 }
1091 }
1092 .wrap .manage-right {
1093 margin: 0;
1094 padding: 0;
1095 float: right;
1096 width: 35%;
1097 z-index: 1;
1098 }
1099 .wrap .manage-right p {
1100 font-size: 12px;
1101 font-weight: bold;
1102 color: #bbb;
1103 padding-top: 2px;
1104 text-transform: uppercase;
1105 letter-spacing: 1px;
1106 clear: left;
1107 }
1108 .wrap .manage-right .bumper {
1109 margin-left: 33px;
1110 }
1111 .wrap .manage-right.show {
1112 display: block;
1113 overflow-y: auto;
1114 overflow-x: hidden;
1115 position: absolute;
1116 z-index: 100000;
1117 }
1118 .wrap .manage-right .search-bar {
1119 margin-bottom: 18px;
1120 max-width: 300px;
1121 }
1122 .wrap .manage-right p.search-box {
1123 float: none;
1124 height: auto;
1125 margin-bottom: 0;
1126 position: relative;
1127 }
1128 .wrap .manage-right p.search-box input[type=search] {
1129 padding: 0 8px;
1130 width: 90%;
1131 line-height: initial;
1132 }
1133 @media (max-width: 782px) {
1134 .wrap .manage-right p.search-box input[type=search] {
1135 float: left;
1136 padding: 9px 8px;
1137 }
1138 }
1139 .wrap .manage-right p.search-box input[type=submit] {
1140 display: none;
1141 }
1142 .wrap .manage-right .button-group .button {
1143 outline: none;
1144 }
1145 .wrap .manage-right .subsubsub {
1146 margin: 0;
1147 padding: 0;
1148 }
1149 .wrap .manage-right .subsubsub a {
1150 padding: 0;
1151 line-height: inherit;
1152 }
1153 .wrap .manage-right .subsubsub .current {
1154 padding: 1px 5px;
1155 border-radius: 2px;
1156 margin-left: -5px;
1157 background: #0D72B2;
1158 color: #fff;
1159 }
1160 .wrap .manage-right .subsubsub .current .count {
1161 color: #BCD7E7;
1162 font-weight: 200;
1163 }
1164 .wrap .manage-right .subsubsub li {
1165 display: block;
1166 text-align: left;
1167 }
1168 @media (max-width: 782px) {
1169 .wrap .manage-right {
1170 background: #fff;
1171 bottom: 0;
1172 display: none;
1173 min-width: 300px;
1174 position: fixed;
1175 right: 0;
1176 top: 0;
1177 z-index: 13;
1178 box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1);
1179 }
1180 .wrap .manage-right .bumper {
1181 margin: 13px;
1182 }
1183 .wrap .manage-right .navbar-form {
1184 margin: 0;
1185 padding: 0;
1186 }
1187 }
1188
1189 @media (max-width: 782px) {
1190 .wp-list-table tr:not(.inline-edit-row):not(.no-items) td:not(.column-primary):not(.check-column) {
1191 padding: 11px 10px;
1192 display: block;
1193 }
1194
1195 .manage-right.show .subsubsub li {
1196 padding: 5px;
1197 }
1198 }
1199 @media (max-width: 650px) {
1200 .table-bordered.jetpack-modules tr.jetpack-module.deprecated td .row-actions {
1201 float: none;
1202 padding-left: 18px;
1203 }
1204 }
1205 @media (max-width: 430px) {
1206 .table-bordered.jetpack-modules tr.jetpack-module td .row-actions {
1207 display: none;
1208 }
1209
1210 .table-bordered.jetpack-modules tr.jetpack-module.deprecated td .row-actions {
1211 display: block;
1212 }
1213 }
1214 /* 'Pages' is a temporary location for these styles, until we can break them up into their proper atmoic locations */
1215 .configure-module p {
1216 font-size: 14px;
1217 }
1218 .configure-module p.success, .configure-module p.error {
1219 color: #fff;
1220 padding: 10px;
1221 }
1222 .configure-module p.success {
1223 background-color: #81a844;
1224 }
1225 .configure-module p.error {
1226 background-color: #d94f4f;
1227 }
1228
1229 .protect-status p {
1230 font-size: 16px;
1231 }
1232 .protect-status strong {
1233 display: inline-block;
1234 margin-top: 10px;
1235 background: #fff;
1236 padding: 10px;
1237 border: 1px #dcdcde solid;
1238 font-size: 16px;
1239 color: #000;
1240 max-width: 100%;
1241 }
1242 .protect-status.attn {
1243 color: #d94f4f;
1244 }
1245 .protect-status.working {
1246 color: #81a844;
1247 }
1248
1249 .protect-whitelist textarea {
1250 width: 100%;
1251 min-height: 150px;
1252 }
1253
1254 /* btns + inputs */
1255 .configure-module input[disabled] {
1256 opacity: 0.5;
1257 }
1258 .configure-module input.button-primary {
1259 font-weight: bold;
1260 }
1261
1262 /* whitelist table */
1263 @media only screen and (min-width: 1100px) {
1264 .protect-whitelist {
1265 width: 65%;
1266 float: left;
1267 }
1268 }
1269 /* end > 1065px */
1270 @media only screen and (max-width: 400px) {
1271 .protect-status strong {
1272 font-size: 12px;
1273 overflow: auto;
1274 }
1275 }
1276 /* end < 400px */
1277 .manage__icon {
1278 width: 155px;
1279 height: 155px;
1280 margin: 20px auto;
1281 }
1282
1283 .manage-page .manage__description {
1284 max-width: 600px;
1285 text-align: center;
1286 font-size: 22px;
1287 color: #999;
1288 margin: 20px auto;
1289 }
1290 .manage-page .manage__button {
1291 font-size: 16px;
1292 padding: 0 20px;
1293 height: 40px;
1294 line-height: 40px;
1295 }
1296
1297 .manage__title .genericon {
1298 font-size: 38px;
1299 color: #81A944;
1300 }
1301
1302 .manage__link {
1303 font-size: 16px;
1304 padding: 0 20px;
1305 height: 40px;
1306 line-height: 40px;
1307 font-weight: normal;
1308 }
1309 .manage__link .genericon {
1310 font-size: 28px;
1311 vertical-align: middle;
1312 margin-top: -6px;
1313 }
1314
1315 .jp-content .hide {
1316 display: none;
1317 }
1318 .jp-content .landing {
1319 margin: 0 auto;
1320 z-index: 2;
1321 position: relative;
1322 }
1323 .jp-content h1 {
1324 font-weight: 400;
1325 line-height: 1.75em;
1326 position: relative;
1327 z-index: 3;
1328 width: 100%;
1329 text-align: center;
1330 }
1331 .jp-content h1.success {
1332 color: #81a844;
1333 }
1334 .jp-content .footer {
1335 padding-top: 0;
1336 margin-top: 0;
1337 background-image: none;
1338 }
1339 .jp-content .footer:before {
1340 height: inherit;
1341 }
1342 .jp-content .more-info:before {
1343 content: none;
1344 }
1345
1346 .landing .wpcom-connect {
1347 min-height: 400px;
1348 }
1349
1350 .wpcom-connect .j-col {
1351 padding: 0;
1352 }
1353
1354 @media (max-width: 1147px) {
1355 .jp-content .landing {
1356 padding: 0 2em;
1357 }
1358 .jp-content .footer {
1359 padding-top: 1.5em;
1360 }
1361 }
1362 @media (max-width: 530px) {
1363 .jp-content .landing {
1364 padding: 0 0.5em;
1365 }
1366 }
1367