PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 6.34
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v6.34
6.35 6.34 6.33.1 6.33 6.32.1 6.32 6.31 6.25 6.25.1 6.26 6.26.1 6.27 6.28 6.29 6.3 6.3.1 6.3.2 6.30 6.4 6.4.1 6.4.2 6.5 6.5.1 6.5.2 6.5.3 All 141 releases
formidable / css / admin / dashboard.css

dashboard.css in Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More 6.34, at css/admin/dashboard.css

597 lines 11.1 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .frm-white-body #wpbody-content {
2
3 /* clear float - fix the full auto height with frm-dashboard-container */
4 float: none;
5 }
6
7 .frm-dashboard-wrapper {
8 min-height: 100vh;
9 overflow: hidden;
10 }
11
12 .frm-dashboard-container h3,
13 .frm-dashboard-container h4 {
14 margin: 0;
15 padding: 0;
16 }
17
18 .frm-dashboard-container .frm-dashboard-widget h3 {
19 font-weight: 500;
20 }
21
22 .frm-dashboard-container .frm-dashboard-widget {
23 opacity: 0;
24 position: relative;
25 flex-direction: column;
26 padding-left: var(--gap-md);
27 padding-right: var(--gap-md);
28 }
29
30 .frm-dashboard-container .frm-dashboard-widget a b {
31 font-weight: 500;
32 }
33
34 .frm-counter-card-wrapper.frm-payments-placeholder p,
35 .frm-counter-card-wrapper.frm-payments-placeholder .frm-counter-card a {
36 margin: 0;
37 padding: 0;
38 }
39
40 .frm-counter-card-wrapper.frm-payments-placeholder .frm-counter-card h3,
41 .frm-dashboard-container .frm-dashboard-widget h2.frm-widget-heading {
42 font-size: var(--text-md);
43 font-weight: 600;
44 }
45
46 .frm-dashboard-container .frm-dashboard-widget .frm-widget-cta {
47 font-weight: 500;
48 }
49
50 .frm-dashboard-container .frm-dashboard-widget .frm-widget-cta,
51 .frm-dashboard-container .frm-dashboard-widget h2.frm-widget-heading {
52 padding: 0 var(--gap-md);
53 margin-bottom: 0;
54 }
55
56 .frm-dashboard-container .frm-dashboard-widget.frm-license-widget {
57 z-index: 4;
58 overflow: inherit;
59 }
60
61 .frm-dashboard-widget span.frm_inbox_count {
62 margin-right: 0;
63 line-height: 1.6;
64 background-color: var(--error-500);
65 }
66
67 .frm-yt-widget {
68 z-index: 3;
69 padding: 0 !important;
70 }
71
72 .frm-yt-widget iframe {
73 width: 100%;
74 height: 224px;
75 border-radius: var(--small-radius);
76 }
77
78
79 .frm-dashboard-banner {
80 width: 100%;
81 margin: 0 auto;
82 box-sizing: border-box;
83 position: relative;
84 overflow: hidden;
85 background: #4199fd;
86 border-radius: var(--small-radius);
87 }
88
89 .frm-dashboard-banner .frm-dashboard-banner-close {
90 position: absolute;
91 top: var(--gap-md);
92 right: var(--gap-md);
93 width: var(--h-xs);
94 height: var(--h-xs);
95 cursor: pointer;
96 z-index: 3;
97 }
98
99 .frm-dashboard-banner .frm-dashboard-banner-close svg {
100 width: 100%;
101 color: white;
102 opacity: 0.5;
103 }
104
105 .frm-dashboard-banner > div {
106 position: relative;
107 z-index: 2;
108 color: white;
109 align-items: center;
110 }
111
112 .frm-dashboard-banner .frm-shrink-0 {
113
114 /* position at end of flex row */
115 margin-left: auto;
116 margin-right: var(--gap-lg);
117 }
118
119 .frm-dashboard-banner > div h4 {
120 color: white;
121 font-size: var(--text-sm);
122 font-weight: 700;
123 }
124
125 .frm-dashboard-banner > div p {
126 font-size: var(--text-sm);
127 line-height: 21px;
128 color: white;
129 font-weight: 400;
130 margin: 0;
131 }
132
133 .frm-dashboard-banner > div > div:last-child {
134 min-width: 155px;
135 }
136
137 .frm-dashboard-banner .frm-vertical-line {
138 height: var(--h-xs);
139 opacity: 0.4;
140 }
141
142 .frm-dashboard-banner::before {
143 content: "";
144 display: block;
145 width: 628px;
146 height: 628px;
147 border-radius: 628px;
148 background: #4199fd;
149 filter: blur(50px);
150 position: absolute;
151 bottom: 0;
152 right: 10%;
153 z-index: 1;
154 }
155
156 .frm-dashboard-banner::after {
157 content: "";
158 border-radius: 463px;
159 background: #f15a24;
160 mix-blend-mode: screen;
161 filter: blur(50px);
162 width: 463px;
163 height: 463px;
164 position: absolute;
165 right: -5%;
166 top: 0;
167 z-index: 1;
168 }
169
170 .frm-dashboard-banner-bg-shape {
171 display: block;
172 position: absolute;
173 z-index: 1;
174 top: 0;
175 left: 0;
176 width: 469px;
177 height: 247px;
178 border-radius: 469px;
179 background: #8b5cf6;
180 mix-blend-mode: overlay;
181 filter: blur(50px);
182 }
183
184 .frm-dashboard-container.frm-flex-box {
185 max-width: 1480px;
186 width: calc(100% - var(--gap-md) * 2);
187 padding-bottom: var(--gap-2xl);
188 box-sizing: border-box;
189 gap: var(--gap-md);
190 flex-wrap: wrap;
191 }
192
193 #frm_top_bar + .wrap.frm-dashboard-container {
194 margin-left: auto;
195 margin-right: auto;
196 }
197
198 .frm-dashboard-container > .frm-flex-box {
199 row-gap: var(--gap-md);
200 }
201
202 .frm-dashboard-container > div:first-child {
203 overflow: hidden;
204 }
205
206 .frm-dashboard-container > div:last-child {
207 width: max(29%, var(--big-sidebar));
208 }
209
210 /* Counter Card */
211 .frm-counter-card-wrapper {
212 position: relative;
213 }
214
215 .frm-counter-card-wrapper .frm-counter-card {
216 flex: 1;
217 }
218
219 .frm-counter-card-wrapper .frm-counter-card h4 {
220 color: var(--grey-500);
221 }
222
223 .frm-counter-card-wrapper .frm-counter-card b {
224 color: var(--grey-900);
225 font-size: var(--text-xl);
226 font-weight: 600;
227 }
228
229 .frm-counter-card-wrapper .frm-counter-card a {
230 font-weight: 500;
231 }
232
233 /* END Counter Card */
234
235 /* License Management */
236 .frm-dashboard-license-management {
237 display: flex;
238 flex-direction: column;
239 gap: var(--gap-xs);
240 }
241
242 .frm-dashboard-container .frm-dashboard-license-management h3 {
243 display: flex;
244 align-items: center;
245 gap: var(--gap-xs);
246 }
247
248 /* END License Management */
249
250 /* Entries Widget */
251 .frm-white-body .frm-dashboard-widget table.wp-list-table {
252 margin-bottom: 0;
253 table-layout: auto;
254 }
255
256 .frm-white-body .frm-dashboard-widget table.wp-list-table .row-actions {
257 display: none;
258 }
259
260 .frm-white-body .frm-dashboard-widget table.wp-list-table th,
261 .frm-white-body .frm-dashboard-widget table.wp-list-table td,
262 .frm-dashboard-widget table.wp-list-table th,
263 .frm-dashboard-widget table.wp-list-table td {
264 padding: var(--gap-xs) var(--gap-md);
265 vertical-align: middle;
266 }
267
268 .frm-dashboard-widget table.wp-list-table td {
269 font-size: var(--text-sm);
270 word-break: break-word;
271 }
272
273 .frm-dashboard-widget table.wp-list-table td abbr {
274 text-decoration: none;
275 }
276
277 .frm-white-body .frm-dashboard-widget table.wp-list-table th,
278 .frm-dashboard-widget table.wp-list-table th {
279 color: var(--grey-500);
280 font-size: var(--text-xs);
281 text-transform: uppercase;
282 border-bottom: 1px solid #e9eaea;
283 }
284
285 /* End Entries Widget */
286
287 /* Chart Placeholder */
288 .frm-widget-placeholder {
289 width: 100%;
290 position: relative;
291 display: flex;
292 align-items: center;
293 justify-content: center;
294 }
295
296 .frm-widget-placeholder[data-background="chart-placeholder"] {
297 background: url("../../images/dashboard/chart-placeholder.jpg") no-repeat;
298 background-size: 100%;
299 height: 314px;
300 }
301
302 .frm-widget-placeholder[data-background="entries-placeholder"] {
303 background: url("../../images/dashboard/entries-placeholder.jpg") no-repeat;
304 background-size: 100%;
305 background-position: left -15px;
306 height: 385px;
307 }
308
309 .frm-widget-placeholder > div {
310 max-width: 337px;
311 text-align: center;
312 }
313
314 /* END Chart Placeholder */
315
316 /* Pro Features List */
317 .frm-pro-features-list {
318 padding: var(--gap-xl) var(--gap-2xl);
319 position: relative;
320 display: flex;
321 gap: var(--gap-2xl);
322 }
323
324 .frm-pro-features-list::before {
325 content: "";
326 display: block;
327 width: 100%;
328 height: 8px;
329 background: linear-gradient(90deg, #1961d5 0.76%, #e8abef 100%);
330 position: absolute;
331 top: 0;
332 left: 0;
333 border-top-right-radius: var(--small-radius);
334 border-top-left-radius: var(--small-radius);
335 }
336
337 .frm-pro-features-list-left {
338 flex: 0 0 55%;
339 }
340
341 .frm-pro-features-list h2 {
342 font-size: 24px !important;
343 font-weight: 600 !important;
344 max-width: 382px;
345 margin-bottom: var(--gap-md) !important;
346 }
347
348 .frm-pro-features-list ul {
349 padding: 0;
350 margin: 0 0 var(--gap-lg);
351 }
352
353 .frm-pro-features-list li {
354 display: flex;
355 align-items: center;
356 gap: var(--gap-xs);
357 }
358
359 .frm-testimonial {
360 border-radius: 16px;
361 border: 1px solid #eaecf0;
362 position: relative;
363 padding: 24px;
364 }
365
366 .frm-testimonial::before {
367 content: "";
368 display: block;
369 height: 12px;
370 width: calc(100% - 30px);
371 border-radius: 0 0 12px 12px;
372 border: 1px solid #eaecf0;
373 border-top: 0;
374 position: absolute;
375 left: 15px;
376 bottom: -13px;
377 }
378
379 .frm-testimonial__content {
380 font-size: 16px;
381 line-height: 1.625;
382 margin-bottom: 24px;
383 }
384
385 .frm-testimonial__author {
386 font-weight: 600;
387 font-size: 18px;
388 margin-bottom: 3px;
389 }
390
391 .frm-testimonial__rating svg {
392 height: 18px;
393 width: 18px;
394 }
395
396 .frm-testimonial__guarantee-icon img {
397 position: absolute;
398 bottom: -15px;
399 right: -27px;
400 height: 110px;
401 width: 110px;
402 }
403
404 @media (max-width: 1280px) {
405
406 .frm-pro-features-list {
407 padding-left: var(--gap-lg);
408 padding-right: var(--gap-lg);
409 gap: var(--gap-lg);
410 }
411 }
412
413 @media (max-width: 1025px) {
414
415 .frm-pro-features-list {
416 flex-direction: column;
417 }
418
419 .frm-testimonial__guarantee-icon svg {
420 right: -10px;
421 }
422 }
423
424 /* END Pro Features List */
425
426 /* Inbox */
427 .frm-tabs-navs {
428 padding: 0 var(--gap-md);
429 }
430
431 .frm-tabs-navs ul {
432 margin: 0;
433 height: var(--h-md);
434 position: relative;
435 }
436
437 .frm-tabs-navs ul li {
438 color: var(--grey-500);
439 font-weight: 400;
440 font-size: var(--text-md);
441 cursor: pointer;
442 margin-bottom: 0;
443 }
444
445 .frm-tabs-navs ul li.frm-active {
446 color: var(--primary-500);
447 font-weight: 600;
448 }
449
450 .frm-tabs-delimiter {
451 position: relative;
452 background: var(--grey-200);
453 height: 1px;
454 margin: 0;
455 }
456
457 .frm-tabs-delimiter .frm-tabs-active-underline {
458 height: 2px;
459 background: var(--primary-500);
460 position: absolute;
461 left: 24px;
462 bottom: 0;
463 width: 45px;
464 transition: 0.4s transform cubic-bezier(0.25, 0.46, 0.45, 0.94);
465 }
466
467 .frm-tabs-container {
468 position: relative;
469 overflow: hidden;
470 margin-top: var(--gap-md);
471 height: 100%;
472 }
473
474 .frm-inbox-message-heading {
475 position: relative;
476 }
477
478 .frm-inbox-wrapper .frm-inbox-message-heading a.frm_inbox_dismiss,
479 .frm-inbox-wrapper .frm-inbox-message-heading span {
480 color: var(--grey-400);
481 }
482
483 .frm-inbox-message-container {
484 padding-bottom: var(--gap-sm);
485 margin-bottom: var(--gap-sm);
486 border-bottom: 1px solid var(--grey-200);
487 }
488
489 .frm-inbox-message-container.frm-flex-col,
490 .frm-inbox-message-container .frm-flex-col {
491 gap: var(--gap-xs);
492 }
493
494 div.frm-inbox-subscribe:not(.frm_hidden) {
495 height: 100%;
496 display: flex;
497 flex-direction: column;
498 justify-content: center;
499 }
500
501 #frm_empty_inbox.frm-inbox-subscribe #frm-leave-email-modal {
502 margin: 0;
503 }
504
505 .frm-inbox-subscribe h2::before {
506 content: "";
507 display: block;
508 background: url("../../images/dashboard/bell-cross.svg") no-repeat;
509 width: 40px;
510 height: 40px;
511 margin: auto auto var(--gap-sm);
512 }
513
514 .frm-inbox-subscribe #frmapi-email-form + img {
515 display: none;
516 }
517
518 .frm-tabs-container .frm-tabs-slide-track {
519 transition: 0.4s transform cubic-bezier(0.25, 0.46, 0.45, 0.94);
520 }
521
522 #frm_empty_inbox #frm-add-my-email-address {
523 margin: var(--gap-xs) auto;
524 }
525
526 #frm_empty_inbox.frm-inbox-hide-form #frm_leave_email_wrapper,
527 #frm_empty_inbox.frm-inbox-hide-form #frm-add-my-email-address {
528 display: none;
529 }
530
531 .frm-tabs-container .frm-tabs-slide-track > div .frm-inbox-message-container:last-child {
532 border-bottom: none;
533 padding-bottom: 0;
534 margin-bottom: 0;
535 }
536
537 .frm-tabs-slide-track > div {
538 flex: 0 0 100%;
539 opacity: 0;
540 transition: 0.25s opacity linear;
541 position: relative;
542 height: auto;
543 max-height: 612px;
544 overflow: hidden;
545 box-sizing: border-box;
546 }
547
548 .frm-tabs-slide-track > div > div {
549 overflow: auto;
550 position: relative;
551 width: 100%;
552 padding: 0 var(--gap-md);
553 box-sizing: border-box;
554 }
555
556 .frm-tabs-slide-track > div > div:first-child {
557 height: 100%;
558 }
559
560 .frm-tabs-slide-track > div.frm-active {
561 opacity: 1;
562 transition: 0.35s opacity linear;
563 }
564
565 .frm-inbox-wrapper div.frm-tabs-container div.frm-inbox-message-container a.frm-button-primary,
566 .frm-inbox-message-container > a {
567 font-weight: 500;
568 color: var(--primary-500);
569 font-size: var(--text-sm);
570 margin-top: var(--gap-xs);
571 }
572
573 .frm-inbox-wrapper .frm-tabs-container .frm-inbox-message-container > .frm_inbox_dismiss {
574 display: none;
575 }
576
577 .frm-admin-page-dashboard .frm-inbox-message-container p {
578 margin: 0;
579 }
580
581 /* END Inbox */
582
583 @media only screen and ( max-width: 1250px ) {
584
585 .frm-dashboard-container > div {
586 width: 100% !important;
587 }
588
589 .frm-dashboard-container > div:last-child {
590 order: -1;
591 }
592
593 .frm-yt-widget iframe {
594 height: 400px;
595 }
596 }
597