PluginProbe
Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) / 1.8.11
Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) v1.8.11
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 / scss / admin / charitable-admin-splash.scss

charitable-admin-splash.scss in Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) 1.8.11, at assets/scss/admin/charitable-admin-splash.scss

487 lines 14.0 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 body.charitable-splash-modal div.jconfirm .jconfirm-box-container .jconfirm-box.jconfirm-type-default {
2 max-width: 1000px;
3 }
4 body.charitable-splash-modal.post-type-campaign .jconfirm .jconfirm-box div.jconfirm-content-pane {
5 margin: 0 !important;
6 width: 100% !important;
7 }
8
9 #charitable-splash-modal header {
10 display: flex;
11 align-items: center;
12 gap: 30px;
13 padding: 50px 100px;
14 background: linear-gradient(180deg, #f6f7f7 0%, rgba(246, 247, 247, 0) 100%);
15 .charitable-splash-header-content {
16 text-align: left !important;
17 }
18 }
19
20 #charitable-splash-modal header h2 {
21 color: #1d2327;
22 font-size: 24px;
23 font-weight: 700;
24 margin: 0 0 5px;
25 }
26
27 #charitable-splash-modal header img {
28 max-width: 80px !important;
29 max-height: 80px;
30 border: 4px solid #ffffff;
31 border-radius: 40px;
32 box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
33 min-height: 70px;
34 }
35
36 #charitable-splash-modal main .charitable-splash-section {
37 display: flex;
38 align-items: center;
39 gap: 50px;
40 margin-bottom: 75px;
41 padding: 0 120px;
42 }
43
44 #charitable-splash-modal main .charitable-splash-section .charitable-splash-badge {
45 border-radius: 3px;
46 background-color: #edfaef;
47 padding: 8px 10px;
48 color: #00ba37;
49 text-align: center;
50 font-size: 10px;
51 font-weight: 700;
52 line-height: 10px;
53 letter-spacing: 0.5px;
54 text-transform: uppercase;
55 cursor: default;
56 }
57
58 #charitable-splash-modal main .charitable-splash-section h3 {
59 color: #1d2327;
60 font-size: 28px;
61 font-weight: 500;
62 line-height: 36px;
63 margin: 15px 0 10px;
64 }
65
66 #charitable-splash-modal main .charitable-splash-section p {
67 line-height: 25px !important;
68 opacity: 0.9;
69 }
70
71 #charitable-splash-modal main .charitable-splash-section ul {
72 list-style: revert;
73 margin-left: 2em;
74 }
75
76 #charitable-splash-modal main .charitable-splash-section .charitable-splash-section-buttons {
77 display: flex;
78 align-items: flex-start;
79 gap: 20px;
80 margin-top: 20px;
81 }
82
83 #charitable-splash-modal main .charitable-splash-section .charitable-splash-section-buttons .charitable-btn {
84 padding: 10px 15px;
85 font-size: 14px;
86 line-height: normal;
87 font-weight: 500;
88 }
89
90 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-fifty-fifty .charitable-splash-section-content {
91 text-align: left !important;
92 flex: 1;
93 }
94
95 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-fifty-fifty .charitable-splash-section-image {
96 flex: 1;
97 }
98
99 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-one-third-two-thirds .charitable-splash-section-content {
100 flex: 2;
101 text-align: right !important;
102 .charitable-splash-section-buttons {
103 justify-content: end !important;
104 }
105 }
106
107 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-one-third-two-thirds .charitable-splash-section-image {
108 flex: 1;
109 }
110
111 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-one-third-two-thirds-flipped .charitable-splash-section-content {
112 flex: 2;
113 text-align: left !important;
114 .charitable-splash-section-buttons {
115 justify-content: start !important;
116 }
117 }
118
119 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-one-third-two-thirds-flipped .charitable-splash-section-image {
120 flex: 1;
121 }
122
123 #charitable-splash-modal main .charitable-splash-section:nth-child(odd) .charitable-splash-section-content {
124 order: 2;
125 }
126
127 #charitable-splash-modal main .charitable-splash-section.no-order .charitable-splash-section-content {
128 order: revert;
129 }
130
131 #charitable-splash-modal main .charitable-splash-section:nth-child(odd) .charitable-splash-section-image {
132 order: 1;
133 }
134
135 #charitable-splash-modal main .charitable-splash-section .charitable-splash-section-image {
136 flex: 0 0 auto;
137 align-self: center;
138 justify-self: center;
139 img {
140 max-width: 100%;
141 height: auto;
142 }
143 }
144
145 #charitable-splash-modal main .charitable-splash-section .charitable-splash-section-image.charitable-image-shadow-apply img {
146 box-shadow: 0 15px 50px 0 rgba(0, 0, 0, 0.15);
147 }
148
149 #charitable-splash-modal main .charitable-splash-section .charitable-splash-section-image.charitable-image-shadow-yes img {
150 max-width: calc(100% + 60px);
151 margin: -18px 0 -38px -30px;
152 }
153
154 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width {
155 flex-direction: column;
156 align-items: center;
157 gap: 0;
158 text-align: center;
159 padding: 0;
160 }
161
162 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width .charitable-splash-section-content,
163 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width .charitable-splash-section-image {
164 flex: revert;
165 order: revert;
166 }
167
168 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width .charitable-splash-section-content {
169 width: fit-content;
170 background-color: #f6f7f7;
171 padding: 50px 100px;
172 }
173
174 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width .charitable-splash-section-content .charitable-splash-badge {
175 background-color: #ffffff;
176 }
177
178 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width .charitable-splash-section-content h3 {
179 font-size: 32px;
180 }
181
182 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width .charitable-splash-section-image {
183 width: 100%;
184 background: linear-gradient(180deg, #f6f7f7 50%, #ffffff 50%);
185 }
186
187 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width .charitable-splash-section-image img {
188 max-width: 760px;
189 padding: 10px;
190 background: #ffffff;
191 border-radius: 9px;
192 box-shadow: 0 15px 50px rgba(0, 0, 0, 0.15);
193 }
194
195 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width .charitable-splash-section-buttons {
196 justify-content: center;
197 }
198
199 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width h3 {
200 margin-top: 20px;
201 }
202
203 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width p {
204 font-size: 18px !important;
205 line-height: 28px !important;
206 }
207
208 #charitable-splash-modal footer {
209 display: flex;
210 padding: 50px 100px;
211 align-items: center;
212 gap: 50px;
213 background: #2c3338;
214 box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.05);
215 .charitable-splash-footer-content {
216 text-align: left !important;
217 }
218 }
219
220 #charitable-splash-modal footer h2 {
221 margin: 0 0 10px;
222 color: #ffffff;
223 font-size: 28px;
224 font-weight: 500;
225 line-height: 36px;
226 }
227
228 #charitable-splash-modal footer a {
229 padding: 11px 17px;
230 font-size: 16px;
231 font-weight: 500;
232 }
233
234 #charitable-splash-modal footer p {
235 color: rgba(255, 255, 255, 0.8) !important;
236 line-height: 25px !important;
237 opacity: 0.9;
238 }
239
240 #charitable-splash-modal .charitable-btn {
241 border: 1px;
242 border-style: solid;
243 border-radius: 4px;
244 cursor: pointer;
245 display: inline-block;
246 margin: 0;
247 text-decoration: none;
248 text-align: center;
249 vertical-align: middle;
250 white-space: nowrap;
251 box-shadow: none;
252 }
253
254 #charitable-splash-modal .charitable-btn.inactive {
255 cursor: no-drop;
256 pointer-events: none;
257 box-shadow: none;
258 opacity: 0.5;
259 }
260
261 #charitable-splash-modal .charitable-btn-orange {
262 background-color: #e27730;
263 border-color: #e27730;
264 color: #ffffff;
265 }
266
267 #charitable-splash-modal .charitable-btn-orange:hover, #charitable-splash-modal .charitable-btn-orange:active, #charitable-splash-modal .charitable-btn-orange:focus {
268 background-color: #cd6622;
269 border-color: #cd6622;
270 color: #ffffff;
271 }
272
273 #charitable-splash-modal .charitable-btn-orange:focus {
274 box-shadow: 0 0 0 2px #cd6622;
275 border-color: #ffffff;
276 outline: 0;
277 }
278
279 #charitable-splash-modal .charitable-btn-bordered {
280 background-color: #ffffff;
281 color: #50575e;
282 border-color: #8c8f94;
283 }
284
285 #charitable-splash-modal .charitable-btn-bordered:hover, #charitable-splash-modal .charitable-btn-bordered:focus {
286 color: #2c3338;
287 border-color: #50575e;
288 }
289
290 #charitable-splash-modal .charitable-btn-bordered:focus {
291 background-color: #ffffff;
292 box-shadow: 0 0 0 1px #50575e;
293 outline: 0;
294 }
295
296 #charitable-splash-modal .charitable-btn-green {
297 background-color: #008a20;
298 color: #ffffff;
299 border-color: #008a20;
300 }
301
302 #charitable-splash-modal .charitable-btn-green:hover, #charitable-splash-modal .charitable-btn-green:focus {
303 background-color: #00a32a;
304 color: #ffffff;
305 }
306
307 body.charitable-splash-modal {
308 overflow: hidden;
309 margin-right: var(--charitable-body-scrollbar-width);
310 }
311
312 body.charitable-splash-modal #wpadminbar {
313 width: calc( 100vw - var( --charitable-body-scrollbar-width ));
314 }
315
316 body.charitable-splash-modal .jconfirm {
317 overflow: hidden;
318 bottom: revert;
319 min-height: 100vh;
320 backdrop-filter: blur(4px);
321 -webkit-backdrop-filter: blur(4px);
322 }
323
324 body.charitable-splash-modal .jconfirm .jconfirm-cell {
325 vertical-align: top;
326 overflow-y: auto;
327 max-height: 100vh;
328 height: 100vh;
329 display: flex;
330 justify-content: center;
331 align-items: center;
332 }
333
334 body.charitable-splash-modal .jconfirm .jconfirm-cell::-webkit-scrollbar {
335 background: transparent;
336 width: 15px;
337 height: 15px;
338 }
339
340 body.charitable-splash-modal .jconfirm .jconfirm-cell::-webkit-scrollbar-track {
341 background: transparent;
342 }
343
344 body.charitable-splash-modal .jconfirm .jconfirm-cell::-webkit-scrollbar-thumb {
345 box-shadow: inset 0 0 5px 5px rgba(0, 0, 0, 0.05);
346 background: transparent;
347 border-radius: 15px;
348 border: solid 4px transparent;
349 }
350
351 body.charitable-splash-modal .jconfirm .jconfirm-cell::-webkit-resizer, body.charitable-splash-modal .jconfirm .jconfirm-cell::-webkit-scrollbar-button, body.charitable-splash-modal .jconfirm .jconfirm-cell::-webkit-scrollbar-corner {
352 display: none;
353 }
354
355 @-moz-document url-prefix() {
356 body.charitable-splash-modal .jconfirm .jconfirm-cell {
357 scrollbar-color: rgba(0, 0, 0, 0.05) transparent;
358 scrollbar-gutter: initial !important;
359 scrollbar-width: thin;
360 }
361 }
362
363 body.charitable-splash-modal .jconfirm .jconfirm-cell:hover::-webkit-scrollbar {
364 background: transparent;
365 width: 15px;
366 height: 15px;
367 }
368
369 body.charitable-splash-modal .jconfirm .jconfirm-cell:hover::-webkit-scrollbar-track {
370 background: transparent;
371 }
372
373 body.charitable-splash-modal .jconfirm .jconfirm-cell:hover::-webkit-scrollbar-thumb {
374 box-shadow: inset 0 0 5px 5px rgba(0, 0, 0, 0.3);
375 background: transparent;
376 border-radius: 15px;
377 border: solid 4px transparent;
378 }
379
380 body.charitable-splash-modal .jconfirm .jconfirm-cell:hover::-webkit-resizer, body.charitable-splash-modal .jconfirm .jconfirm-cell:hover::-webkit-scrollbar-button, body.charitable-splash-modal .jconfirm .jconfirm-cell:hover::-webkit-scrollbar-corner {
381 display: none;
382 }
383
384 @-moz-document url-prefix() {
385 body.charitable-splash-modal .jconfirm .jconfirm-cell:hover {
386 scrollbar-color: rgba(0, 0, 0, 0.3) transparent;
387 scrollbar-gutter: initial !important;
388 scrollbar-width: thin;
389 }
390 }
391
392 body.charitable-splash-modal .jconfirm .jconfirm-cell .jc-bs3-container {
393 padding-bottom: 50px;
394 }
395
396 body.charitable-splash-modal .jconfirm .jconfirm-cell .jconfirm-holder {
397 width: 100%;
398 padding: 0 !important;
399 }
400
401 body.charitable-splash-modal .jconfirm.jconfirm-open .jconfirm-bg {
402 position: sticky;
403 height: 100%;
404 }
405
406 body.charitable-splash-modal .jconfirm.jconfirm-open .jconfirm-scrollpane {
407 margin-top: -100vh;
408 }
409
410 body.charitable-splash-modal .jconfirm.jconfirm-modern .jconfirm-bg {
411 background-color: #72777c;
412 opacity: 0.75;
413 }
414
415 body.charitable-splash-modal .jconfirm-box {
416 max-width: 1000px;
417 width: 100% !important;
418 }
419
420 body.charitable-splash-modal .jconfirm-box-container {
421 opacity: 0;
422 padding: 0 50px;
423 }
424
425 body.charitable-splash-modal div.jconfirm .jconfirm-box-container .jconfirm-box {
426 border-radius: 12px;
427 box-shadow: 0 15px 50px rgba(0, 0, 0, 0.15);
428 }
429
430 body.charitable-splash-modal div.jconfirm .jconfirm-box-container .jconfirm-box.jconfirm-type-default {
431 padding: 0;
432 transition-duration: initial !important;
433 }
434
435 body.charitable-splash-modal .jconfirm.jconfirm-modern .jconfirm-box div.jconfirm-content {
436 text-align: revert;
437 }
438
439 body.charitable-splash-modal div.jconfirm .jconfirm-box-container .jconfirm-box .jconfirm-content-pane {
440 display: block;
441 margin-bottom: 0;
442 max-height: none !important;
443 }
444
445 body.charitable-splash-modal div.jconfirm .jconfirm-box-container .jconfirm-box .jconfirm-content-pane .jconfirm-content {
446 color: #444444;
447 font-size: 16px;
448 line-height: 24px;
449 margin-bottom: 0;
450 overflow: inherit;
451 }
452
453 body.charitable-splash-modal div.jconfirm .jconfirm-box-container .jconfirm-box .jconfirm-content-pane .jconfirm-content p {
454 color: #50575e;
455 font-size: 16px;
456 font-weight: 400;
457 line-height: 22px;
458 margin-block: 0;
459 }
460
461 body.charitable-splash-modal div.jconfirm .jconfirm-box-container .jconfirm-box .jconfirm-closeIcon {
462 top: 20px !important;
463 right: 20px !important;
464 }
465
466 body.charitable-splash-modal div.jconfirm .jconfirm-box-container .jconfirm-box .jconfirm-closeIcon:after {
467 font-size: 20px;
468 }
469
470 @media screen and (max-width: 1024px) {
471 #charitable-splash-modal header, #charitable-splash-modal footer {
472 padding: 50px;
473 }
474 #charitable-splash-modal main .charitable-splash-section {
475 padding: 0 50px;
476 }
477 #charitable-splash-modal main .charitable-splash-section.charitable-splash-section-full-width .charitable-splash-section-content {
478 padding: 50px;
479 }
480 }
481
482 @media screen and (max-width: 768px) {
483 body.charitable-splash-modal .jconfirm {
484 display: none;
485 }
486 }
487