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

511 lines 10.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 }
311
312 .frm-pro-features-list:before {
313 content: '';
314 display: block;
315 width: 100%;
316 height: 8px;
317 background: linear-gradient(90deg, #1961D5 0.76%, #E8ABEF 100%);
318 position: absolute;
319 top: 0; left: 0;
320 border-top-right-radius: var(--small-radius);
321 border-top-left-radius: var(--small-radius);
322 }
323
324 .frm_wrap .frm-dashboard-container .frm-pro-features-list h2 {
325 font-size: 24px;
326 font-weight: 600;
327 max-width: 382px;
328 margin-bottom: var(--gap-md);
329 }
330
331 .frm-pro-features-list ul {
332 padding: 0;
333 margin: 0 0 var(--gap-lg);
334 }
335
336 .frm-pro-features-list li {
337 display: flex;
338 align-items: center;
339 gap: var(--gap-xs);
340 }
341 /* END Pro Features List */
342
343 /* Inbox */
344 .frm-tabs-navs {
345 padding: 0 var(--gap-md);
346 }
347
348 .frm-tabs-navs ul {
349 margin: 0;
350 height: var(--h-md);
351 position: relative;
352 }
353
354 .frm-tabs-navs ul li {
355 color: var( --grey-500 );
356 font-weight: 400;
357 font-size: var(--text-md);
358 cursor: pointer;
359 margin-bottom: 0px;
360 }
361
362 .frm-tabs-navs ul li.frm-active {
363 color: var(--primary-500);
364 font-weight: 600;
365 }
366
367 .frm-tabs-delimiter {
368 position: relative;
369 background: var(--grey-200);
370 height: 1px;
371 margin: 0;
372 }
373
374 .frm-tabs-delimiter .frm-tabs-active-underline {
375 height: 2px;
376 background: var(--primary-500);
377 position: absolute;
378 left: 24px; bottom: 0;
379 width: 45px;
380 transition: 0.4s transform cubic-bezier(0.25, 0.46, 0.45, 0.94);
381 }
382
383 .frm-tabs-container {
384 position: relative;
385 overflow: hidden;
386 margin-top: var(--gap-md);
387 height: 100%;
388 }
389
390 .frm-inbox-message-heading {
391 position: relative;
392 }
393
394 .frm-inbox-wrapper .frm-inbox-message-heading a.frm_inbox_dismiss,
395 .frm-inbox-wrapper .frm-inbox-message-heading span {
396 color: var(--grey-400);
397 }
398
399 .frm-inbox-message-container {
400 padding-bottom: var(--gap-sm);
401 margin-bottom: var(--gap-sm);
402 border-bottom: 1px solid var(--grey-200);
403 }
404
405 .frm-inbox-message-container.frm-flex-col,
406 .frm-inbox-message-container .frm-flex-col {
407 gap: var(--gap-xs);
408 }
409
410 div.frm-inbox-subscribe:not(.frm_hidden) {
411 height: 100%;
412 display: flex;
413 flex-direction: column;
414 justify-content: center;
415 }
416
417 #frm_empty_inbox.frm-inbox-subscribe #frm-leave-email-modal {
418 margin: 0;
419 }
420
421 .frm-inbox-subscribe h2:before {
422 content:'';
423 display:block;
424 background: url( '../../images/dashboard/bell-cross.svg' ) no-repeat;
425 width: 40px;
426 height: 40px;
427 margin: auto auto var(--gap-sm);
428 }
429
430 .frm-inbox-subscribe #frmapi-email-form + img{
431 display: none;
432 }
433
434 .frm-tabs-container .frm-tabs-slide-track {
435 transition: 0.4s transform cubic-bezier(0.25, 0.46, 0.45, 0.94);
436 }
437
438 #frm_empty_inbox #frm-add-my-email-address {
439 margin: var(--gap-xs) auto;
440 }
441
442 #frm_empty_inbox.frm-inbox-hide-form #frm_leave_email_wrapper,
443 #frm_empty_inbox.frm-inbox-hide-form #frm-add-my-email-address {
444 display: none;
445 }
446
447 .frm-tabs-container .frm-tabs-slide-track > div .frm-inbox-message-container:last-child {
448 border-bottom: none;
449 padding-bottom: 0;
450 margin-bottom: 0;
451 }
452
453 .frm-tabs-slide-track > div {
454 flex: 0 0 100%;
455 opacity: 0.0;
456 transition: 0.25s opacity linear;
457 position: relative;
458 height: auto;
459 max-height: 612px;
460 overflow: hidden;
461 box-sizing: border-box;
462 }
463
464 .frm-tabs-slide-track > div > div {
465 overflow: auto;
466 position: relative;
467 width:100%;
468 padding: 0 var(--gap-md);
469 box-sizing: border-box;
470 }
471
472 .frm-tabs-slide-track > div > div:first-child {
473 height: 100%;
474 }
475
476 .frm-tabs-slide-track > div.frm-active {
477 opacity: 1.0;
478 transition: 0.35s opacity linear;
479 }
480
481 .frm-inbox-wrapper div.frm-tabs-container div.frm-inbox-message-container a.frm-button-primary,
482 .frm-inbox-message-container > a {
483 font-weight: 500;
484 color: var(--primary-500);
485 font-size: var(--text-sm);
486 margin-top: var(--gap-xs);
487 }
488
489 .frm-inbox-wrapper .frm-tabs-container .frm-inbox-message-container > .frm_inbox_dismiss {
490 display: none;
491 }
492
493 .frm-admin-page-dashboard .frm-inbox-message-container p {
494 margin: 0;
495 }
496 /* END Inbox */
497
498 @media only screen and ( max-width: 1250px ) {
499 .frm-dashboard-container > div {
500 width: 100% !important;
501 }
502
503 .frm-dashboard-container > div:last-child {
504 order: -1;
505 }
506
507 .frm-yt-widget iframe {
508 height: 400px;
509 }
510 }
511