PluginProbe
Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) / 1.8.13
Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) v1.8.13
1.8.13 1.8.12.3 1.8.12.2 1.8.12.1 1.8.12 1.8.11.3 1.8.11.2 1.8.11.1 1.8.11 1.6.6 1.6.60 1.6.7 1.6.8 1.6.9 1.7.0 1.7.0.1 1.7.0.11 1.7.0.12 1.7.0.14 1.7.0.2 1.7.0.3 1.7.0.5 1.7.0.6 1.7.0.7 1.7.0.9 All 211 releases
charitable / assets / css / admin / charitable-admin-addons-directory.css

charitable-admin-addons-directory.css in Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) 1.8.13, at assets/css/admin/charitable-admin-addons-directory.css

1,272 lines 25.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* addon settings */
2
3 .charitable-clear:before {
4 content: ' ';
5 display: table;
6 }
7 .charitable-clear:after {
8 clear: both;
9 content: ' ';
10 display: table;
11 }
12
13 .charitable-admin-wrap {
14 margin: 0;
15 }
16
17 #charitable-admin-addons *,
18 #charitable-admin-addons *::before,
19 #charitable-admin-addons *::after {
20 -webkit-box-sizing: border-box;
21 -moz-box-sizing: border-box;
22 box-sizing: border-box;
23 }
24 #charitable-admin-addons #charitable-admin-addons-list .list {
25 display: flex;
26 flex-wrap: wrap;
27 align-items: stretch;
28 margin-left: -20px;
29 margin-right: -20px;
30 }
31 #charitable-admin-addons #charitable-admin-addons-list .list .action-button button {
32 background: none;
33 border: 1px solid #ddd;
34 border-radius: 3px;
35 box-shadow: none;
36 font-weight: 600;
37 width: 140px;
38 text-align: center;
39 padding: 8px 5px;
40 }
41 #charitable-admin-addons #charitable-admin-addons-list .list .action-button button:hover,
42 #charitable-admin-addons #charitable-admin-addons-list .list .action-button button:focus,
43 #charitable-admin-addons #charitable-admin-addons-list .list .action-button button.loading {
44 background-color: #e9e9e9;
45 }
46 #charitable-admin-addons #charitable-admin-addons-list .list .action-button button:focus {
47 border-color: #2271b1;
48 box-shadow: 0 0 0 1px #2271b1;
49 outline: none;
50 }
51 #charitable-admin-addons .addons-container {
52 display: flex;
53 flex-wrap: wrap;
54 align-items: stretch;
55 margin-left: -20px;
56 margin-right: -20px;
57 }
58 #charitable-admin-addons .unlock-msg {
59 padding: 0;
60 margin-top: -20px;
61 clear: both;
62 }
63 #charitable-admin-addons .unlock-msg h4 {
64 margin: 1.5em 0 8px;
65 }
66 #charitable-admin-addons .unlock-msg p {
67 margin: 0 0 1.5em;
68 }
69 #charitable-admin-addons #charitable-admin-addons-search {
70 background-color: #fff;
71 border: 1px solid #ddd;
72 border-radius: 3px;
73 box-shadow: none;
74 color: #333;
75 vertical-align: middle;
76 padding: 2px 12px 2px 35px;
77 margin: -2px -10px 0 0;
78 width: 200px;
79 min-height: 30px;
80 float: right;
81 }
82 #charitable-admin-addons #charitable-admin-addons-search:focus {
83 border-color: #bbb;
84 }
85 #charitable-admin-addons .addon-container {
86 padding: 0 20px;
87 width: 33.333333%;
88 margin-bottom: 20px;
89 }
90 @media (max-width: 1249px) {
91 #charitable-admin-addons .addon-container {
92 width: 50%;
93 }
94 }
95 @media (max-width: 767px) {
96 #charitable-admin-addons .addon-container {
97 width: 100%;
98 }
99 }
100 #charitable-admin-addons h4 {
101 font-size: 17px;
102 font-weight: 700;
103 }
104 #charitable-admin-addons .addon-item {
105 background-color: #fff;
106 border: 1px solid #ddd;
107 border-radius: 3px;
108 margin: 0;
109 height: 100%;
110 display: flex;
111 flex-direction: column;
112 justify-content: space-between;
113 overflow: hidden;
114 position: relative;
115 }
116 #charitable-admin-addons .addon-item img {
117 border: 1px solid #eee;
118 }
119 #charitable-admin-addons .addon-item h5 {
120 margin: 0 0 0 0;
121 font-size: 16px;
122 }
123 #charitable-admin-addons .addon-item h5 a {
124 color: #444;
125 display: inline-block;
126 margin: 0 10px 10px 0;
127 text-decoration: none;
128 }
129 #charitable-admin-addons .addon-item h5 a:hover {
130 color: #006799;
131 }
132 #charitable-admin-addons .addon-item p {
133 margin: 0 0 0 0;
134 }
135 #charitable-admin-addons .addon-item .details {
136 padding: 30px 20px;
137 }
138 #charitable-admin-addons .addon-item .actions {
139 display: flex;
140 align-items: center;
141 background-color: #f7f7f7;
142 border-top: 1px solid #ddd;
143 padding: 20px;
144 min-height: 75px;
145 position: relative;
146 }
147 #charitable-admin-addons .addon-item .actions .msg {
148 background-color: #f7f7f7;
149 border: none;
150 position: absolute;
151 text-align: center;
152 font-weight: 600;
153 top: 0;
154 left: 0;
155 height: 100%;
156 width: 100%;
157 margin: 0;
158 z-index: 99;
159 padding: 20px;
160 display: flex;
161 align-items: center;
162 justify-content: center;
163 }
164 #charitable-admin-addons .addon-item .actions .msg.success {
165 color: #2a9b39;
166 }
167 #charitable-admin-addons .addon-item .actions .msg.error {
168 color: red;
169 }
170 #charitable-admin-addons .addon-item .actions .msg p {
171 margin: 0;
172 }
173 #charitable-admin-addons .addon-item .actions .msg a,
174 #charitable-admin-addons .addon-item .actions .msg a:hover {
175 color: inherit;
176 }
177 #charitable-admin-addons .addon-item .status {
178 flex-grow: 1;
179 }
180 #charitable-admin-addons .addon-item .status .status-missing,
181 #charitable-admin-addons .addon-item .status .status-go-to-url {
182 color: #666;
183 }
184 #charitable-admin-addons .addon-item .status .status-installed {
185 color: red;
186 }
187 #charitable-admin-addons .addon-item .status .status-active {
188 color: #2a9b39;
189 }
190 #charitable-admin-addons .addon-item .upgrade-button {
191 text-align: center;
192 }
193 #charitable-admin-addons .addon-item .upgrade-button a {
194 font-weight: 600;
195 width: 140px;
196 text-align: center;
197 padding: 8px 5px;
198 }
199 #charitable-admin-addons .addon-item .action-button button {
200 width: 140px;
201 }
202 #charitable-admin-addons .addon-item .charitable-addon-recommended {
203 background-color: #00a32a;
204 border-radius: 4px;
205 color: #ffffff;
206 font-size: 10px;
207 font-weight: 700;
208 line-height: 1;
209 padding: 4px 5px;
210 margin-bottom: 5px;
211 display: inline-block;
212 position: relative;
213 top: -2px;
214 text-transform: uppercase;
215 cursor: default;
216 }
217 #charitable-admin-addons .addon-item .charitable-addon-recommended i {
218 opacity: 0.8;
219 }
220 .addon-item .status {
221 flex-grow: 1;
222 }
223 .addon-item .status .status-inactive {
224 color: red;
225 }
226 .addon-item .status .status-active {
227 color: #2a9b39;
228 }
229 .addon-item .upgrade-button {
230 text-align: center;
231 }
232 .addon-item .upgrade-button a {
233 font-weight: 600;
234 width: 140px;
235 text-align: center;
236 padding: 8px 5px;
237 }
238 .addon-item .action-button button {
239 cursor: pointer;
240 }
241 .addon-item .action-button button .fa {
242 margin-right: 8px;
243 }
244 .addon-item .action-button button .fa.fa-spinner {
245 margin-right: 0;
246 }
247 .addon-item .action-button button.status-active .fa {
248 color: #2a9b39;
249 }
250 .addon-item .action-button button.status-inactive .fa {
251 color: red;
252 }
253 .addon-item .action-button button.status-missing .fa {
254 color: #999;
255 }
256 .addon-item .action-button button.disabled {
257 cursor: default;
258 pointer-events: none;
259 }
260 .addon-item .action-button button.loading {
261 cursor: default;
262 }
263 .addon-item .action-button button.loading .fa {
264 color: #666;
265 }
266 .addon-item .action-button a {
267 text-decoration: none;
268 }
269 #charitable-admin-addons .addon-item .recommended {
270 position: absolute;
271 background: green;
272 padding: 10px 15px;
273 color: White;
274 font-size: 14px;
275 font-weight: 700;
276 top: 1px;
277 left: 1px;
278 }
279 body.charitable_page_charitable-addons #charitable-addons {
280 margin-top: 20px;
281 }
282 body.charitable_page_charitable-addons #charitable-settings h1 {
283 display: none;
284 }
285 body.charitable_page_charitable-addons #charitable-settings .charitable-addons-header h1.charitable-addons-header-title,
286 body.charitable_page_charitable-addons #charitable-settings h1.page-title {
287 display: flex;
288 margin: 0;
289 flex-direction: row;
290 gap: 20px;
291 align-content: center;
292 }
293
294 .charitable-addons-top-bar {
295 display: none;
296 }
297
298 /* cta settings */
299
300 #charitable-settings .settings-lite-cta {
301 background-color: #fff;
302 border: 1px solid #dadada;
303 padding: 25px 20px;
304 margin: 10px 0 40px 0;
305 position: relative;
306 }
307 #charitable-settings .settings-lite-cta .dismiss {
308 position: absolute;
309 top: 10px;
310 right: 10px;
311 color: #666;
312 font-size: 16px;
313 }
314 #charitable-settings .settings-lite-cta h5 {
315 margin: 0 0 16px;
316 font-size: 18px;
317 font-weight: 700;
318 }
319 #charitable-settings .settings-lite-cta h6 {
320 font-weight: 700;
321 font-size: 14px;
322 margin: 0 0 16px;
323 }
324 #charitable-settings .settings-lite-cta p {
325 color: #555;
326 font-size: 14px;
327 margin: 0 0 16px;
328 }
329 #charitable-settings .settings-lite-cta p:last-of-type {
330 margin: 0;
331 }
332 #charitable-settings .settings-lite-cta p a {
333 color: #e27730;
334 }
335 #charitable-settings .settings-lite-cta p a:hover {
336 color: #b85a1b;
337 }
338 #charitable-settings .settings-lite-cta ul {
339 margin: 0;
340 padding: 0;
341 width: 50%;
342 float: left;
343 }
344 @media (max-width: 600px) {
345 #charitable-settings .settings-lite-cta ul {
346 width: 100%;
347 float: none;
348 }
349 }
350 #charitable-settings .settings-lite-cta ul li {
351 margin: 0;
352 padding: 0 0 2px 16px;
353 color: #555;
354 font-size: 14px;
355 position: relative;
356 }
357 #charitable-settings .settings-lite-cta ul li:before {
358 content: '+';
359 position: absolute;
360 top: -1px;
361 left: 0;
362 }
363 #charitable-settings .settings-lite-cta .list {
364 margin: 0 0 16px 0;
365 overflow: auto;
366 max-width: 900px;
367 }
368 #charitable-settings .settings-lite-cta .green {
369 color: #218900;
370 font-weight: 700;
371 }
372 #charitable-settings .settings-lite-cta .fa-star {
373 color: #ff982d;
374 }
375 #charitable-settings .tablenav .tablenav-pages a,
376 #charitable-settings .tablenav-pages-navspan {
377 min-width: 28px;
378 height: auto;
379 }
380 .charitable-admin-wrap #charitable-settings .notice {
381 margin-left: 0 !important;
382 margin-right: 0 !important;
383 }
384
385 .charitable-addons-header {
386 padding: 15px 20px;
387 background: #ffffff;
388 margin-bottom: 20px;
389 display: flex;
390 align-items: center;
391 justify-content: space-between;
392 border: 1px solid #c3c4c7;
393 }
394
395 @media (max-width: 599px) {
396 .charitable-addons-header {
397 flex-direction: column;
398 align-items: flex-start;
399 }
400 }
401
402 .charitable-addons-header-title {
403 font-size: 22px;
404 font-weight: 400;
405 color: #101517;
406 display: flex;
407 gap: 20px;
408 align-items: center;
409 margin: 0;
410 }
411
412 @media (max-width: 599px) {
413 .charitable-addons-header-title {
414 margin-bottom: 20px;
415 }
416 }
417
418 .charitable-addons-header-search {
419 position: relative;
420 }
421
422 @media (max-width: 599px) {
423 .charitable-addons-header-search {
424 width: 100%;
425 }
426 }
427
428 .charitable-addons-header-search:before {
429 font-family: dashicons;
430 content: "�
431 �";
432 color: #a7aaad;
433 font-size: 20px;
434 text-align: center;
435 position: absolute;
436 left: 10px;
437 top: 50%;
438 transform: translateY(-50%);
439 }
440
441 .charitable-addons-header-search input[type="search"] {
442 width: 250px;
443 height: 36px;
444 padding: 10px 10px 10px 40px;
445 font-size: 14px;
446 font-weight: 400;
447 margin: 0;
448 float: none;
449 vertical-align: baseline;
450 }
451
452 .charitable-addons-header-search input[type="search"]::placeholder {
453 color: #a7aaad;
454 }
455
456 @media (max-width: 599px) {
457 .charitable-addons-header-search input[type="search"] {
458 width: 100%;
459 }
460 }
461
462 .charitable-addons-link {
463 color: #0073aa;
464 text-align: center;
465 font-size: 13px;
466 font-weight: 400;
467 line-height: 20px;
468 text-decoration: none;
469 }
470
471 .charitable-addons-link:hover {
472 color: #00a0d2;
473 }
474
475 /* new css */
476
477 .charitable-addons-header {
478 padding: 15px 20px !important;
479 background: #ffffff;
480 margin-bottom: 20px !important;
481 display: flex !important;
482 align-items: center;
483 justify-content: space-between;
484 }
485
486 @media (max-width: 599px) {
487 .charitable-addons-header {
488 flex-direction: column;
489 align-items: flex-start;
490 }
491 }
492
493 .charitable-addons-header-title {
494 font-size: 22px;
495 font-weight: 400;
496 color: #101517;
497 display: flex;
498 gap: 20px;
499 align-items: center;
500 }
501
502 @media (max-width: 599px) {
503 .charitable-addons-header-title {
504 margin-bottom: 20px;
505 }
506 }
507
508 .charitable-addons-header-search {
509 position: relative;
510 }
511
512 @media (max-width: 599px) {
513 .charitable-addons-header-search {
514 width: 100%;
515 }
516 }
517
518 .charitable-addons-header-search:before {
519 font-family: FontAwesome, sans-serif;
520 content: "\f002";
521 color: #a7aaad;
522 font-size: 16px;
523 text-align: center;
524 position: absolute;
525 left: 10px;
526 top: 50%;
527 transform: translateY(-50%);
528 }
529
530 .charitable-addons-header-search #charitable-addons-search {
531 width: 250px;
532 height: 36px;
533 padding: 10px 10px 10px 30px;
534 font-size: 14px;
535 font-weight: 400;
536 }
537
538 .charitable-addons-header-search #charitable-addons-search::placeholder {
539 color: #a7aaad;
540 }
541
542 @media (max-width: 599px) {
543 .charitable-addons-header-search #charitable-addons-search {
544 width: 100%;
545 }
546 }
547
548 .charitable-addons-list-section:first-child {
549 margin-bottom: 20px;
550 }
551
552 .charitable-addons-list-section-title {
553 font-size: 16px;
554 font-weight: 500;
555 color: #101517;
556 margin-bottom: 20px;
557 margin-top: 0;
558 }
559
560 .charitable-addons-list {
561 display: grid;
562 grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
563 grid-gap: 20px;
564 }
565
566 /* Dashboard Recommended Addons - 2x2 Grid Layout */
567 .charitable-dashboard-recommended-addons-section-content {
568 display: grid;
569 grid-template-columns: repeat(2, 1fr);
570 grid-gap: 20px;
571 width: 100%;
572 }
573
574 /* Ensure equal height cards in dashboard */
575 .charitable-dashboard-recommended-addons-section-content .charitable-addons-list-item {
576 height: 100%;
577 display: flex;
578 flex-direction: column;
579 justify-content: space-between;
580 min-height: 200px; /* Ensure minimum height for consistency */
581 }
582
583 /* Responsive design for dashboard */
584 @media (max-width: 782px) {
585 .charitable-dashboard-recommended-addons-section-content {
586 grid-template-columns: 1fr;
587 }
588 }
589
590 /* Dashboard Popular Badge Styling */
591 .charitable-dashboard-recommended-addons-section-content .charitable-addons-list-item-header-icon {
592 position: relative;
593 display: flex;
594 flex-direction: column;
595 align-items: center;
596 gap: 8px;
597 margin-right: 15px;
598 }
599
600 .charitable-dashboard-recommended-addons-section-content .charitable-addons-list-item-header-icon img {
601 width: 48px;
602 height: 48px;
603 object-fit: contain;
604 }
605
606 .charitable-dashboard-recommended-addons-section-content .charitable-addons-list-item-header-icon .charitable-badge {
607 margin: 0;
608 flex-shrink: 0;
609 }
610
611 /* Dashboard View More Button Styling */
612 .charitable-dashboard-recommended-addons-section-content .charitable-view-more-button {
613 margin-left: 10px;
614 font-size: 13px;
615 line-height: 2.15384615;
616 min-height: 30px;
617 padding: 0 10px;
618 text-decoration: none;
619 display: inline-block;
620 color: #2271b1;
621 border-color: #2271b1;
622 background: #f6f7f7;
623 border-width: 1px;
624 border-style: solid;
625 border-radius: 3px;
626 white-space: nowrap;
627 box-sizing: border-box;
628 cursor: pointer;
629 -webkit-appearance: none;
630 }
631
632 .charitable-dashboard-recommended-addons-section-content .charitable-view-more-button:hover {
633 color: #135e96;
634 border-color: #135e96;
635 background: #f0f0f1;
636 }
637
638 .charitable-dashboard-recommended-addons-section-content .charitable-addons-list-item-footer > div {
639 display: flex;
640 align-items: center;
641 justify-content: space-between;
642 width: 100%;
643 }
644
645
646 /* Search highlighting styles */
647 .charitable-addons-list-item mark {
648 background-color: #ffeb3b;
649 color: #000;
650 padding: 2px 4px;
651 border-radius: 2px;
652 font-weight: bold;
653 }
654
655 .charitable-addons-list-item .addon-link mark {
656 background-color: #ffeb3b;
657 color: #000;
658 padding: 1px 3px;
659 border-radius: 2px;
660 font-weight: bold;
661 }
662
663 .charitable-addons-list-item .addon-description mark {
664 background-color: #fff3cd;
665 color: #856404;
666 padding: 1px 3px;
667 border-radius: 2px;
668 font-weight: normal;
669 }
670
671 @media (max-width: 782px) {
672 .charitable-addons-list {
673 grid-template-columns: 1fr;
674 }
675 }
676
677 .charitable-addons-list-item {
678 margin: 0;
679 height: 100%;
680 display: flex;
681 flex-direction: column;
682 justify-content: space-between;
683 overflow: hidden;
684 align-items: flex-start;
685 border-radius: 6px;
686 border: 1px solid #c3c4c7;
687 background: #ffffff;
688 box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.07);
689 }
690
691 .charitable-addons-list-item-header {
692 padding: 20px;
693 display: flex;
694 gap: 20px;
695 }
696
697 .charitable-addons-list-item-header img {
698 width: 80px;
699 height: 80px;
700 max-width: 80px !important;
701 border: 1px solid rgba(195, 196, 199, 0.5);
702 border-radius: 6px;
703 }
704
705 .charitable-addons-list-item-header-meta-title {
706 margin-bottom: 5px;
707 display: flex;
708 align-items: center;
709 gap: 10px;
710 }
711
712 @media (max-width: 600px) {
713 .charitable-addons-list-item-header-meta-title {
714 align-items: flex-start;
715 flex-direction: column;
716 }
717 }
718
719 .charitable-addons-list-item-header-meta-title a {
720 color: #2c3338;
721 font-size: 16px;
722 font-weight: 500;
723 line-height: 22px;
724 text-decoration-line: underline;
725 text-underline-offset: 2px;
726 }
727
728 .charitable-addons-list-item-header-meta-excerpt {
729 color: #646970;
730 font-size: 14px;
731 font-weight: 400;
732 line-height: 18px;
733 }
734
735 .charitable-addons-list-item-error-msg {
736 color: #b32d2e;
737 font-weight: 500;
738 }
739
740 .charitable-addons-list-item-footer {
741 padding: 20px;
742 display: flex;
743 background: #f6f6f6;
744 width: 100%;
745 justify-content: space-between;
746 box-sizing: border-box;
747 align-items: center;
748 min-height: 70px;
749 }
750
751 .charitable-addons-list-item-footer-missing .charitable-toggle-control {
752 display: none;
753 }
754
755 .charitable-addons-list-item-footer-active .charitable-addons-list-item-footer-settings-link {
756 display: block;
757 }
758
759 .charitable-addons-list-item-footer-with-error .charitable-addons-list-item-footer-actions {
760 display: none;
761 }
762
763 .charitable-addons-list-item-footer-settings-link {
764 display: none;
765 }
766
767 .charitable-addons-list-item-footer-error {
768 width: 100%;
769 color: #646970;
770 }
771
772 .charitable-addons-list-item-footer-error p {
773 margin: 0;
774 }
775
776 .charitable-addons #charitable-addons-list-section-all .charitable-addons-list .charitable-addons-list-item.has-badge {
777 border: 2px solid #8c8f94;
778 box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
779 }
780
781 .charitable-addons .charitable-notice.notice-info {
782 padding: 20px;
783 border: none;
784 margin-bottom: 20px;
785 border-radius: 6px;
786 box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.07);
787 }
788
789 .charitable-addons .charitable-notice.notice-info strong {
790 color: #1d2327;
791 font-size: 20px;
792 font-weight: 500;
793 line-height: 18px;
794 }
795
796 .charitable-addons .charitable-notice.notice-info p {
797 margin-top: 0;
798 font-size: 15px;
799 font-weight: 400;
800 line-height: 20px;
801 color: rgba(44, 51, 56, 0.8);
802 }
803
804 .charitable-addons .charitable-notice.notice-info p:last-child {
805 margin-bottom: 0;
806 }
807
808 .charitable-addons .charitable-notice.notice-info p.notice-title {
809 margin-bottom: 0;
810 color: #1d2327;
811 }
812
813 .charitable-addons .charitable-notice.notice-info .notice-buttons {
814 display: flex;
815 gap: 10px;
816 }
817
818 @media (max-width: 782px) {
819 .charitable-addons .charitable-notice {
820 margin: 20px !important;
821 }
822 }
823
824 .charitable-addons .charitable-notice .charitable-btn {
825 box-sizing: border-box;
826 }
827
828 .charitable-addons #charitable-addons-no-results {
829 display: none;
830 font-size: 14px;
831 }
832
833 .charitable-addons .charitable-addons-link {
834 color: #a7aaad;
835 text-align: center;
836 font-size: 13px;
837 font-weight: 400;
838 line-height: 20px;
839 text-decoration-line: underline;
840 }
841
842 .charitable-addons .charitable-addons-link:hover {
843 color: #2c3338;
844 }
845
846 #charitable-admin-addons *,
847 #charitable-admin-addons *::before,
848 #charitable-admin-addons *::after {
849 -webkit-box-sizing: border-box;
850 -moz-box-sizing: border-box;
851 box-sizing: border-box;
852 }
853
854 #charitable-admin-addons #charitable-admin-addons-list .list {
855 display: flex;
856 flex-wrap: wrap;
857 align-items: stretch;
858 margin-left: -20px;
859 margin-right: -20px;
860 }
861
862 #charitable-admin-addons #charitable-admin-addons-list .list .action-button button {
863 background: none;
864 border: 1px solid #ddd;
865 border-radius: 3px;
866 box-shadow: none;
867 font-weight: 600;
868 width: 140px;
869 text-align: center;
870 padding: 8px 5px;
871 }
872
873 #charitable-admin-addons #charitable-admin-addons-list .list .action-button button:hover, #charitable-admin-addons #charitable-admin-addons-list .list .action-button button:focus, #charitable-admin-addons #charitable-admin-addons-list .list .action-button button.loading {
874 background-color: #e9e9e9;
875 }
876
877 #charitable-admin-addons #charitable-admin-addons-list .list .action-button button:focus {
878 border-color: #2271b1;
879 box-shadow: 0 0 0 1px #2271b1;
880 outline: none;
881 }
882
883 #charitable-admin-addons .addons-container {
884 display: flex;
885 flex-wrap: wrap;
886 align-items: stretch;
887 margin-left: -20px;
888 margin-right: -20px;
889 }
890
891 #charitable-admin-addons .unlock-msg {
892 padding: 0;
893 margin-top: -20px;
894 clear: both;
895 }
896
897 #charitable-admin-addons .unlock-msg h4 {
898 margin: 1.5em 0 8px;
899 }
900
901 #charitable-admin-addons .unlock-msg p {
902 margin: 0 0 1.5em;
903 }
904
905 #charitable-admin-addons #charitable-admin-addons-search:focus {
906 border-color: #bbb;
907 }
908
909 #charitable-admin-addons .addon-container {
910 padding: 0 20px;
911 width: 33.333333%;
912 margin-bottom: 20px;
913 }
914
915 @media (max-width: 1249px) {
916 #charitable-admin-addons .addon-container {
917 width: 50%;
918 }
919 }
920
921 @media (max-width: 767px) {
922 #charitable-admin-addons .addon-container {
923 width: 100%;
924 }
925 }
926
927 #charitable-admin-addons h4 {
928 font-size: 17px;
929 font-weight: 700;
930 }
931
932 #charitable-admin-addons .addon-item {
933 background-color: #fff;
934 border: 1px solid #ddd;
935 border-radius: 6px;
936 margin: 0;
937 height: 100%;
938 display: flex;
939 flex-direction: column;
940 justify-content: space-between;
941 overflow: hidden;
942 }
943
944 #charitable-admin-addons .addon-item img {
945 border: 1px solid #eee;
946 float: left;
947 max-width: 75px;
948 }
949
950 #charitable-admin-addons .addon-item h5 {
951 margin: 0 0 0 100px;
952 font-size: 16px;
953 }
954
955 #charitable-admin-addons .addon-item h5 a {
956 color: #444;
957 display: inline-block;
958 margin: 0 10px 10px 0;
959 }
960
961 #charitable-admin-addons .addon-item h5 a:hover {
962 color: #006799;
963 }
964
965 #charitable-admin-addons .addon-item p {
966 margin: 0 0 0 100px;
967 }
968
969 #charitable-admin-addons .addon-item .details {
970 padding: 30px 20px;
971 }
972
973 #charitable-admin-addons .addon-item .actions {
974 display: flex;
975 align-items: center;
976 background-color: #f7f7f7;
977 border-top: 1px solid #ddd;
978 padding: 20px;
979 min-height: 75px;
980 position: relative;
981 }
982
983 #charitable-admin-addons .addon-item .actions .msg {
984 background-color: #f7f7f7;
985 border: none;
986 position: absolute;
987 text-align: center;
988 font-weight: 600;
989 top: 0;
990 left: 0;
991 height: 100%;
992 width: 100%;
993 margin: 0;
994 z-index: 99;
995 padding: 20px;
996 display: flex;
997 align-items: center;
998 justify-content: center;
999 }
1000
1001 #charitable-admin-addons .addon-item .actions .msg.success {
1002 color: #008a20;
1003 }
1004
1005 #charitable-admin-addons .addon-item .actions .msg.error {
1006 color: red;
1007 }
1008
1009 #charitable-admin-addons .addon-item .actions .msg p {
1010 margin: 0;
1011 }
1012
1013 #charitable-admin-addons .addon-item .actions .msg a,
1014 #charitable-admin-addons .addon-item .actions .msg a:hover {
1015 color: inherit;
1016 }
1017
1018 #charitable-admin-addons .addon-item .status {
1019 flex-grow: 1;
1020 }
1021
1022 #charitable-admin-addons .addon-item .status .status-missing,
1023 #charitable-admin-addons .addon-item .status .status-go-to-url {
1024 color: #666;
1025 }
1026
1027 #charitable-admin-addons .addon-item .status .status-installed {
1028 color: red;
1029 }
1030
1031 #charitable-admin-addons .addon-item .status .status-active {
1032 color: #008a20;
1033 }
1034
1035 #charitable-admin-addons .addon-item .upgrade-button {
1036 text-align: center;
1037 }
1038
1039 #charitable-admin-addons .addon-item .upgrade-button a {
1040 font-weight: 600;
1041 width: 140px;
1042 text-align: center;
1043 padding: 8px 5px;
1044 }
1045
1046 #charitable-admin-addons .addon-item .action-button button {
1047 width: 140px;
1048 }
1049
1050 #charitable-admin-addons .addon-item .charitable-addon-recommended {
1051 background-color: #00a32a;
1052 border-radius: 4px;
1053 color: #ffffff;
1054 font-size: 10px;
1055 font-weight: 700;
1056 line-height: 1;
1057 padding: 4px 5px;
1058 margin-bottom: 5px;
1059 display: inline-block;
1060 position: relative;
1061 top: -2px;
1062 text-transform: uppercase;
1063 cursor: default;
1064 }
1065
1066 #charitable-admin-addons .addon-item .charitable-addon-recommended i {
1067 opacity: 0.8;
1068 }
1069
1070 .addon-item .status {
1071 flex-grow: 1;
1072 }
1073
1074 .addon-item .status .status-inactive {
1075 color: red;
1076 }
1077
1078 .addon-item .status .status-active {
1079 color: #008a20;
1080 }
1081
1082 .addon-item .upgrade-button {
1083 text-align: center;
1084 }
1085
1086 .addon-item .upgrade-button a {
1087 font-weight: 600;
1088 width: 140px;
1089 text-align: center;
1090 padding: 8px 5px;
1091 }
1092
1093 .addon-item .action-button button {
1094 cursor: pointer;
1095 }
1096
1097 .addon-item .action-button button .fa {
1098 margin-right: 8px;
1099 }
1100
1101 .addon-item .action-button button .fa.fa-spinner {
1102 margin-right: 0;
1103 }
1104
1105 .addon-item .action-button button.status-active .fa {
1106 color: #008a20;
1107 }
1108
1109 .addon-item .action-button button.status-inactive .fa {
1110 color: red;
1111 }
1112
1113 .addon-item .action-button button.status-missing .fa {
1114 color: #999;
1115 }
1116
1117 .addon-item .action-button button.disabled {
1118 cursor: default;
1119 pointer-events: none;
1120 }
1121
1122 .addon-item .action-button button.loading {
1123 cursor: default;
1124 }
1125
1126 .addon-item .action-button button.loading .fa {
1127 color: #666;
1128 }
1129
1130 .addon-item .action-button a {
1131 text-decoration: none;
1132 }
1133
1134 #charitable-admin-addons *, #charitable-admin-addons ::before, #charitable-admin-addons ::after {
1135 -webkit-box-sizing: border-box;
1136
1137 -moz-box-sizing: border-box;
1138
1139 box-sizing: border-box;
1140
1141 }
1142 .charitable-badge-green {
1143 color: #30b450;
1144
1145 background-color: #e5f6e9;
1146
1147 }
1148 .charitable-badge-rounded {
1149 border-radius: 3px;
1150
1151 }
1152 .charitable-badge-inline {
1153 display: inline-block;
1154
1155 }
1156 .charitable-badge-sm {
1157 font-size: 8px;
1158
1159 letter-spacing: 0.4px;
1160
1161 padding: 6px 8px;
1162
1163 }
1164 .charitable-badge {
1165 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1166 text-transform: uppercase;
1167 font-weight: 700;
1168 text-align: center;
1169 line-height: 6px;
1170 user-select: none;
1171 transition-property: all;
1172 transition-duration: 0.15s;
1173 transition-timing-function: ease-out;
1174 }
1175
1176 .charitable-badge-titanium {
1177 color: #8c8f94;
1178 background-color: #e5e5e6;
1179 }
1180 .charitable-badge-orange {
1181 color: #e79055;
1182 background-color: #fdf2eb;
1183 }
1184 .charitable-badge-lg {
1185 font-size: 10px;
1186 letter-spacing: 0.5px;
1187 padding: 8px 10px;
1188 }
1189
1190 .charitable-addons-list .charitable-addons-list-item.has-badge {
1191 border: 2px solid #8c8f94;
1192 box-shadow: 0 2px 4px 0 rgba(0,0,0,0.15);
1193 }
1194
1195 .charitable-addons-link {
1196 color: #a7aaad;
1197 text-align: center;
1198 font-size: 13px;
1199 font-weight: 400;
1200 line-height: 20px;
1201 text-decoration-line: underline;
1202 }
1203
1204 .charitable-addons-section {
1205 margin-bottom: 20px;
1206 }
1207
1208 .charitable-addons-section-header {
1209 background: none;
1210 padding: 0 0 15px 0;
1211 border: none;
1212 display: flex;
1213 justify-content: space-between;
1214 align-items: center;
1215 }
1216
1217 .charitable-addons-section-header:not(.charitable-addons-section-header-featured) {
1218 cursor: pointer;
1219 }
1220
1221 .charitable-addons-section-title {
1222 font-size: 20px;
1223 font-weight: 500;
1224 }
1225
1226 .charitable-addons-section-toggle {
1227 background: #fff;
1228 border-radius: 50%;
1229 border: 1px solid #000;
1230 width: 30px;
1231 height: 30px;
1232 display: flex;
1233 align-items: center;
1234 justify-content: center;
1235 }
1236
1237 .charitable-addons-section-toggle .dashicons {
1238 transition: transform 0.2s ease-in-out;
1239 }
1240
1241 .charitable-addons-section-header.open .charitable-addons-section-toggle .dashicons {
1242 transform: rotate(90deg);
1243 }
1244
1245 /* Disabled button styles for invalid URLs */
1246 #charitable-admin-addons .action-button button.disabled,
1247 #charitable-admin-addons .action-button button[disabled] {
1248 opacity: 0.6;
1249 cursor: not-allowed;
1250 background-color: #f0f0f0 !important;
1251 color: #666 !important;
1252 border-color: #ccc !important;
1253 }
1254
1255 #charitable-admin-addons .action-button button.disabled:hover,
1256 #charitable-admin-addons .action-button button[disabled]:hover {
1257 background-color: #f0f0f0 !important;
1258 color: #666 !important;
1259 border-color: #ccc !important;
1260 box-shadow: none !important;
1261 }
1262
1263 /* Warning notice styling */
1264 .charitable-license-warning {
1265 border-left-color: #dba617 !important;
1266 }
1267
1268 .charitable-license-warning .notice-dismiss {
1269 display: none;
1270 }
1271
1272