PluginProbe
Essential Widgets / 1.2.2
Essential Widgets v1.2.2
3.2.1 3.3 3.2 trunk 1.0.0 1.0.1 1.1 1.2 1.2.1 1.2.2 1.3 1.4 1.4.1 1.5 1.6 1.7 1.7.1 1.7.2 1.7.3 1.7.4 1.8 1.9 2.0 2.1 2.2 All 31 releases
essential-widgets / admin / css / essential-widgets-dasbhoard-admin.css

essential-widgets-dasbhoard-admin.css in Essential Widgets 1.2.2, at admin/css/essential-widgets-dasbhoard-admin.css

745 lines 14.6 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * All of the CSS for your admin-specific functionality should be
3 * included in this file.
4 */
5 /*--------------------------------------------------------------
6 >>> TABLE OF CONTENTS:
7 ----------------------------------------------------------------
8 # Typography
9 # Layout
10 # Clearing
11 # Lists
12 # Media
13 # Links
14 # Header
15 # Content
16 # Toggle Switch
17 # Other Products
18 # Footer
19 # Media Queries
20 ## >= 320px
21 ## >= 768px
22 ## >= 1024px
23 ## >= 1280px
24 --------------------------------------------------------------*/
25
26 /*--------------------------------------------------------------
27 # Typography
28 --------------------------------------------------------------*/
29 .ew-main,
30 .ew-main button,
31 .ew-main input,
32 .ew-main selcatchids,
33 .ew-main textarea,
34 .ew-main p {
35 color: #1a1a1a;
36 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
37 font-size: 16px;
38 font-size: 1rem;
39 font-weight: 400;
40 line-height: 1.5;
41 word-wrap: break-word;
42 -webkit-hyphens: auto;
43 -moz-hyphens: auto;
44 -ms-hyphens: auto;
45 hyphens: auto;
46 }
47
48 .ew-main h1 {
49 font-size: 24px;
50 font-size: 1.5rem;
51 }
52
53 .ew-main h2 {
54 font-size: 20px;
55 font-size: 1.25rem;
56 }
57
58 .ew-main h3 {
59 font-size: 18px;
60 font-size: 1.125rem;
61 }
62
63 .ew-main h4 {
64 font-size: 16px;
65 font-size: 1rem;
66 }
67
68 .ew-main h5 {
69 font-size: 14px;
70 font-size: 0.875rem;
71 }
72
73 .ew-main h6 {
74 font-size: 13px;
75 font-size: 0.8125rem;
76 }
77
78 .ew-main p {
79 margin: 0 0 1.5em;
80 }
81
82 /*--------------------------------------------------------------
83 # Layout
84 --------------------------------------------------------------*/
85
86 .ew-main {
87 -webkit-box-sizing: border-box;
88 -moz-box-sizing: border-box;
89 box-sizing: border-box;
90 }
91
92 .ew-main *,
93 .ew-main *:before,
94 .ew-main *:after {
95 -webkit-box-sizing: inherit;
96 -moz-box-sizing: inherit;
97 box-sizing: inherit;
98 }
99
100 .ew-main {
101 background-color: #fff;
102 }
103
104 /*--------------------------------------------------------------
105 # Clearing
106 --------------------------------------------------------------*/
107
108 .ew-main .clear:before,
109 .ew-main .clear:after {
110 content: "";
111 display: table;
112 }
113
114 .ew-main .clear:after {
115 clear: both;
116 }
117
118 /*--------------------------------------------------------------
119 # Lists
120 --------------------------------------------------------------*/
121 .ew-main .ul,
122 .ew-main ol {
123 margin: 0 0 1.5em 2em;
124 padding: 0;
125 }
126
127 .ew-main li {
128 margin: 0;
129 }
130
131 .ew-main ul {
132 list-style: disc;
133 }
134
135 .ew-main ol {
136 list-style: decimal;
137 }
138
139 .ew-main li > ul,
140 .ew-main li > ol {
141 margin-top: 0.55em;
142 margin-left: 1.5em;
143 margin-bottom: 0;
144 }
145
146 .ew-main li {
147 margin-bottom: 0.55em;
148 }
149
150 .ew-main dt {
151 font-weight: 700;
152 }
153
154 .ew-main dd {
155 margin: 0 1.5em 1.5em;
156 }
157
158 /*--------------------------------------------------------------
159 # Media
160 --------------------------------------------------------------*/
161 .ew-main img {
162 height: auto; /* Make sure images are scaled corrcatchidsly. */
163 max-width: 100%; /* Adhere to container width. */
164 vertical-align: middle;
165 }
166
167 /*--------------------------------------------------------------
168 # Links
169 --------------------------------------------------------------*/
170
171 .ew-main a {
172 color: #0085c3;
173 cursor: pointer;
174 text-decoration: none;
175 }
176
177 .ew-main a:hover,
178 .ew-main a:focus,
179 .ew-main a:active {
180 color: #444;
181 text-decoration: underline;
182 }
183
184 .ew-main a:focus {
185 outline: thin dotted;
186 }
187
188 .ew-main a:hover,
189 .ew-main a:active {
190 outline: 0;
191 }
192
193 /*--------------------------------------------------------------
194 # Header
195 --------------------------------------------------------------*/
196
197 .ew-main #masthead {
198 background: #00618d;
199 background: -webkit-radial-gradient(circle farthest-side at center bottom, #0085c3, #00618d 110%);
200 background: -o-radial-gradient(circle farthest-side at center bottom, #0085c3, #00618d 110%);
201 background: -moz-radial-gradient(circle farthest-side at center bottom, #0085c3, #00618d 110%);
202 background: radial-gradient(circle farthest-side at center bottom, #0085c3, #00618d 110%);
203 }
204
205 .ew-main #masthead .wrapper {
206 display: -webkit-box;
207 display: -ms-flexbox;
208 display: flex;
209 -ms-flex-flow: column wrap;
210 flex-flow : column wrap;
211 }
212
213 .ew-main #plugin-description {
214 margin: 0 auto;
215 max-width: 960px;
216 padding-bottom: 20px;
217 text-align: center;
218 }
219
220 .ew-main #plugin-description p:last-child {
221 margin-bottom: 0;
222 }
223
224 .ew-main #site-branding {
225 display: block;
226 order: 1;
227 padding: 30px 20px;
228 text-align: center;
229 width: 100%;
230 }
231
232 .ew-main .site-title {
233 font-family: "Trebuchet MS", Helvetica, sans-serif;
234 text-transform: capitalize;
235 }
236
237 .ew-main .site-title a {
238 color: #fff;
239 }
240
241 .ew-main .site-title a:hover,
242 .ew-main .site-title a:focus {
243 text-decoration: none;
244 }
245
246 .ew-main .site-title-additional {
247 color: #006ea4;
248 }
249
250 .ew-main .setting {
251 padding: 0 7px;
252 color: #fff;
253 }
254
255 /*--------------------------------------------------------------
256 # Content
257 --------------------------------------------------------------*/
258
259 .ew-main .container {
260 display: -webkit-box;
261 display: -ms-flexbox;
262 display: flex;
263 -ms-flex-flow: column wrap;
264 flex-flow: column wrap;
265 justify-content: center;
266 margin: 0 auto;
267 max-width: 680px;
268 }
269
270 .ew-main .module-container {
271 display: -webkit-box;
272 display: -ms-flexbox;
273 display: flex;
274 -ms-flex-flow: column wrap;
275 flex-flow: column wrap;
276 -webkit-box-pack: flex-start;
277 -ms-flex-pack: flex-start;
278 justify-content:flex-start;
279 }
280
281 .cwt .ew-options {
282 border-top: 1px solid #dfdfdf;
283 padding-top: 20px;
284 margin-top: 20px;
285 }
286
287 #module-status {
288 margin-bottom: 0;
289 }
290
291 #module-status .module-header {
292 background-color: transparent;
293 padding-top: 0;
294 padding-bottom: 0;
295 justify-content: flex-start;
296 }
297
298 #module-status .module-header h3 {
299 margin-right: 90px;
300 }
301
302 #module-status .loader {
303 right: inherit;
304 left: 170px;
305 }
306
307 .ew-main .module-header {
308 background-color: #f3f3f3;
309 display: -webkit-box;
310 display: -ms-flexbox;
311 display: flex;
312 -ms-flex-flow: column wrap;
313 flex-flow: column wrap;
314 padding: 11px 18px;
315 position: relative;
316 }
317
318 .ew-main .module-header.active {
319 -webkit-transition: all 0.2s ease;
320 -moz-transition: all 0.2s ease;
321 o-transition: all 0.2s ease;
322 transition: all 0.2s ease;
323 }
324
325 .ew-main .module-header.inactive {
326 -webkit-transition: all 0.2s ease;
327 -moz-transition: all 0.2s ease;
328 o-transition: all 0.2s ease;
329 transition: all 0.2s ease;
330 }
331
332 .ew-main .module-title,
333 .ew-main .other-catchthemes-products .module-content {
334 color: #23282d;
335 font-family: "Trebuchet MS", Helvetica, sans-serif;
336 font-weight: normal;
337 }
338
339 .ew-main .catch-modules {
340 display: -webkit-box;
341 display: -ms-flexbox;
342 display: flex;
343 -ms-flex-flow: column wrap;
344 flex-flow: column wrap;
345 margin-bottom: 20px;
346 }
347
348 .ew-main #module-disabled {
349 margin-bottom: 0;
350 }
351
352 .ew-main #module-disabled.catch-modules {
353 -webkit-box-flex: 0;
354 -ms-flex: 0 1 100%;
355 flex: 0 1 100%
356 }
357
358 .ew-main .catch-module-long {
359 background-color: #f9f9f9;
360 border-radius: 3px;
361 border: 2px solid #ccc;
362 border-top: 0;
363 display: -webkit-box;
364 display: -ms-flexbox;
365 display: flex;
366 -ms-flex-flow: column wrap;
367 flex-flow:column wrap;
368 }
369
370 .ew-main .module-content p:last-child {
371 margin-bottom: 0;
372 }
373
374 .ew-main #main-nav .dashicons {
375 line-height: 2.7;
376 }
377
378 /*--------------------------------------------------------------
379 # Toggle Switch
380 --------------------------------------------------------------*/
381
382 .ew-main .switch {
383 -webkit-box-flex: 0;
384 -webkit-flex-grow: 0;
385 -moz-box-flex: 0;
386 -ms-flex-positive: 0;
387 flex-grow: 0;
388 -webkit-flex-shrink: 0;
389 -ms-flex-negative: 0;
390 flex-shrink: 0;
391 position: relative;
392 float: none;
393 right: 0;
394 top: 2px;
395 }
396
397 .ew-main .module-title.active {
398 background-color: #0085c3;
399 }
400
401 .ew-main .switch label {
402 background-color: #48a348;
403 border-radius: 11px;
404 cursor: pointer;
405 height: 16px;
406 right:0;
407 position: absolute;
408 top: 3px;
409 width: 30px;
410 }
411
412 .ew-main .inactive .switch label {
413 background-color: #ccc;
414 }
415
416 .ew-main .switch input[type="checkbox"] {
417 visibility: hidden;
418 display: none;
419 }
420
421 .ew-main .switch label:after {
422 background-color: #fff;
423 border-radius: 100%;
424 content: '';
425 height: 12px;
426 left: 2px;
427 position: absolute;
428 -webkit-transition: all 0.2s ease-in-out;
429 -moz-transition: all 0.2s ease-in-out;
430 o-transition: all 0.2s ease-in-out;
431 transition: all 0.2s ease-in-out;
432 top: 2px;
433 width: 12px;
434 }
435
436 .ew-main .switch input[type="checkbox"]:checked + label:after {
437 left: 16px;
438 background-color: #fff;
439 }
440
441 .ew-main .loader {
442 border: 5px solid #48a348;
443 border-radius: 50%;
444 border-top: 2px solid transparent;
445 width: 20px;
446 height: 20px;
447 -webkit-animation: spin 2s linear infinite;
448 animation: spin 2s linear infinite;
449 position: absolute;
450 right: 60px;
451 display: none;
452 }
453
454 .ew-main p.info,
455 .ew-main p.info a {
456 font-size: 13px;
457 line-height: 2;
458 padding: 10px 12px;
459 }
460
461 @-webkit-keyframes spin {
462 0% { -webkit-transform: rotate(0deg); }
463 100% { -webkit-transform: rotate(360deg); }
464 }
465
466 @keyframes spin {
467 0% { transform: rotate(0deg); }
468 100% { transform: rotate(360deg); }
469 }
470
471 /*--------------------------------------------------------------
472 # Other Products
473 --------------------------------------------------------------*/
474
475 .ew-main .other-catchthemes-products {
476 background-color: #f9f9f9;
477 clear: both;
478 display: block;
479 }
480
481 .ew-main .other-catchthemes-products .module-content {
482 border: none;
483 padding: 0;
484 position: relative;
485 text-align: center;
486 }
487
488 .ew-main .other-catchthemes-products .catch-modules {
489 background-color: #fff;
490 border: 1px solid #dedede;
491 }
492
493 .ew-main .other-catchthemes-products .catch-modules a {
494 color: #444;
495 display: block;
496 padding: 1em;
497 }
498
499 .ew-main .other-catchthemes-products .catch-modules a:hover,
500 .ew-main .other-catchthemes-products .catch-modules a:focus {
501 color: #0085c3;
502 text-decoration: none;
503 }
504
505 .ew-main .other-catchthemes-products .catch-modules .more-details {
506 background-color: #00618d;
507 color: #fff;
508 padding: 16px;
509 position: absolute;
510 left: 25%;
511 font-size: 15px;
512 font-size: 0.9375rem;
513 right: 25%;
514 text-align: center;
515 top: 35%;
516 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
517 opacity: 0;
518 -webkit-transition: opacity 0.1s ease-in-out;
519 transition: opacity 0.1s ease-in-out;
520 }
521
522 .ew-main .other-catchthemes-products .module-content:hover .more-details,
523 .ew-main .other-catchthemes-products .module-content:focus .more-details {
524 color: #fff;
525 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
526 opacity: 1;
527 text-decoration: none;
528 }
529
530 .ew-main .other-catchthemes-products .catch-modules .modules-thumbnail {
531 padding: 0;
532 }
533
534 /*--------------------------------------------------------------
535 # Footer
536 --------------------------------------------------------------*/
537
538 .ew-main .footer-navigation {
539 font-family: "Trebuchet MS", Helvetica, sans-serif;
540 }
541
542 .ew-main .menu-footer-container {
543 padding: 10px 20px 30px;
544 }
545
546 .ew-main .footer-navigation ul {
547 list-style: none;
548 }
549
550 .ew-main .footer-navigation a {
551 color: #444;
552 text-transform: capitalize;
553 padding: 10px 8px 10px 6px;
554 display: block;
555 }
556
557 .ew-main .footer-navigation a:hover,
558 .ew-main .footer-navigation a:focus {
559 color: #0085c3;
560 text-decoration: none;
561 }
562
563 .ew-main .site-footer .menu-footer {
564 display: -webkit-box;
565 display: -ms-flexbox;
566 display: flex;
567 -ms-flex-flow: row wrap;
568 flex-flow: row wrap;
569 -webkit-box-pack: center;
570 -ms-flex-pack: center;
571 justify-content: center;
572 align-items: center;
573 margin: 0;
574 }
575
576 .ew-main .site-footer .menu-footer li {
577 margin: 0;
578 }
579
580 .ew-options.module-container .catch-modules {
581 border: none;
582 }
583
584 /*--------------------------------------------------------------
585 # Media Queries
586 --------------------------------------------------------------*/
587
588 /*--------------------------------------------------------------
589 ## >= 320px
590 --------------------------------------------------------------*/
591
592 @media screen and (min-width: 20em) {
593 .ew-main .module-header {
594 display: -webkit-box;
595 display: -ms-flexbox;
596 display: flex;
597 -ms-flex-flow: row wrap;
598 flex-flow: row wrap;
599 -webkit-box-pack: space-between;
600 -ms-flex-pack: space-between;
601 justify-content: space-between;
602 }
603
604 .ew-main .module-title {
605 margin-bottom: 0;
606 }
607 }
608
609 /*--------------------------------------------------------------
610 ## >= 768px
611 --------------------------------------------------------------*/
612 @media screen and (min-width: 48em) {
613 .ew-main .container {
614 max-width: 100%;
615 }
616
617 .ew-main .module-container {
618 -ms-flex-flow: row wrap;
619 flex-flow: row wrap;
620 -webkit-box-pack: space-between;
621 -ms-flex-pack: space-between;
622 justify-content: space-between;
623 }
624
625 .ew-main #plugin-description {
626 padding-bottom: 30px;
627 }
628
629 .ew-main .catch-modules {
630 -webkit-box-flex: 0;
631 -ms-flex: 0 1 50%;
632 flex: 0 1 50%
633 }
634
635 .ew-options .catch-modules {
636 padding-right: 21px;
637 }
638
639 .ew-options .catch-modules:nth-child(2n) {
640 padding-right: 0;
641 }
642
643 .ew-main .menu-footer-container {
644 padding: 10px 40px 30px;
645 }
646 }
647
648 /*--------------------------------------------------------------
649 ## >= 1024px
650 --------------------------------------------------------------*/
651
652 @media screen and (min-width: 64em) {
653 .ew-main h1 {
654 font-size: 32px;
655 font-size: 2rem;
656 }
657
658 .ew-main h2 {
659 font-size: 22px;
660 font-size: 1.375rem;
661 }
662
663 .ew-main #site-branding {
664 padding: 40px;
665 }
666
667 .ew-main .module-container {
668 -webkit-box-pack: flex-start;
669 -ms-flex-pack: flex-start;
670 justify-content: flex-start;
671 }
672
673 .ew-main .module-container .wrapper {
674 display: -webkit-box;
675 display: -ms-flexbox;
676 display: flex;
677 -webkit-flex-wrap:wrap;
678 -ms-flex-wrap: wrap;
679 flex-wrap: wrap;
680 -webkit-box-pack: flex-start;
681 -ms-flex-pack: flex-start;
682 justify-content: flex-start;
683 }
684
685 .ew-main .menu-footer-container {
686 padding: 25px 40px;
687 }
688
689 .ew-main .footer-navigation a {
690 padding: 10px;
691 }
692 }
693
694 /*--------------------------------------------------------------
695 ## >= 1280px
696 --------------------------------------------------------------*/
697
698 @media screen and (min-width: 80em) {
699 .ew-main,
700 .ew-main button,
701 .ew-main input,
702 .ew-main selcatchids,
703 .ew-main textarea,
704 .ew-main p {
705 font-size: 18px;
706 font-size: 1.1875rem;
707 }
708
709 .ew-main h1 {
710 font-size: 48px;
711 font-size: 3rem;
712 }
713
714 .ew-main h2 {
715 font-size: 24px;
716 font-size: 1.5rem;
717 }
718
719 .ew-main #plugin-description {
720 padding-bottom: 40px;
721 }
722
723 .ew-main #site-branding {
724 padding: 50px;
725 }
726
727 .ew-main .footer-navigation a {
728 padding: 10px 10px 10px 13px;
729 }
730
731 .ew-main .catch-modules {
732 -webkit-box-flex: 0;
733 -ms-flex: 0 1 33.33%;
734 flex: 0 1 33.33%
735 }
736
737 .ew-options .catch-modules:nth-child(2n) {
738 padding-right: 21px;
739 }
740
741 .ew-options .catch-modules:nth-child(3n) {
742 padding-right: 0;
743 }
744 }
745