PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 6.21
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v6.21
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.21, at css/admin/dashboard.css

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