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

511 lines 10.0 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1
2 .frm-white-body #wpbody-content {
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.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: 0px;
37 padding: 0px;
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: .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 /* position at end of flex row */
114 margin-left: auto;
115 margin-right: var(--gap-lg);
116 }
117
118 .frm-dashboard-banner > div h4 {
119 color: white;
120 font-size: var(--text-sm);
121 font-weight: 700;
122 }
123
124 .frm-dashboard-banner > div p {
125 font-size: var(--text-sm);
126 line-height: 21px;
127 color: white;
128 font-weight: 400;
129 margin: 0px;
130 }
131
132 .frm-dashboard-banner > div > div:last-child {
133 min-width: 155px;
134 }
135
136 .frm-dashboard-banner .frm-vertical-line {
137 height: var(--h-xs);
138 opacity: 0.4;
139 }
140
141 .frm-dashboard-banner:before {
142 content: '';
143 display: block;
144 width: 628px;
145 height: 628px;
146 border-radius: 628px;
147 background: #4199FD;
148 filter: blur(50px);
149 position: absolute;
150 bottom: 0;
151 right: 10%;
152 z-index: 1;
153 }
154
155 .frm-dashboard-banner:after {
156 content: '';
157 border-radius: 463px;
158 background: #F15A24;
159 mix-blend-mode: screen;
160 filter: blur(50px);
161 width: 463px;
162 height: 463px;
163 position: absolute;
164 right: -5%;
165 top: 0;
166 z-index: 1;
167 }
168
169 .frm-dashboard-banner-bg-shape {
170 display: block;
171 position: absolute;
172 z-index: 1;
173 top: 0;
174 left: 0;
175 width: 469px;
176 height: 247px;
177 border-radius: 469px;
178 background: #8B5CF6;
179 mix-blend-mode: overlay;
180 filter: blur(50px);
181 }
182
183 .frm-dashboard-container.frm-flex-box {
184 max-width: 1480px;
185 width: calc( 100% - var(--gap-md) * 2 );
186 padding-bottom: var(--gap-2xl);
187 box-sizing: border-box;
188 gap: var(--gap-md);
189 flex-wrap: wrap;
190 }
191 #frm_top_bar + .wrap.frm-dashboard-container {
192 margin-left: auto;
193 margin-right: auto;
194 }
195 .frm-dashboard-container > .frm-flex-box {
196 row-gap: var(--gap-md);
197 }
198 .frm-dashboard-container > div:first-child {
199 overflow: hidden;
200 }
201 .frm-dashboard-container > div:last-child {
202 width: max(29%, var(--big-sidebar));
203 }
204
205 /* Counter Card */
206 .frm-counter-card-wrapper {
207 position: relative;
208 }
209
210 .frm-counter-card-wrapper .frm-counter-card {
211 flex: 1;
212 }
213
214 .frm-counter-card-wrapper .frm-counter-card h4 {
215 color: var(--grey-500);
216 }
217
218 .frm-counter-card-wrapper .frm-counter-card b {
219 color: var(--grey-900);
220 font-size: var(--text-xl);
221 font-weight: 600;
222 }
223
224 .frm-counter-card-wrapper .frm-counter-card a {
225 font-weight: 500;
226 }
227 /* END Counter Card */
228
229 /* License Management */
230 .frm-dashboard-license-management {
231 display: flex;
232 flex-direction: column;
233 gap: var(--gap-xs);
234 }
235
236 .frm-dashboard-container .frm-dashboard-license-management h3 {
237 display: flex;
238 align-items: center;
239 gap: var(--gap-xs);
240 }
241 /* END License Management */
242
243 /* Entries Widget */
244 .frm-white-body .frm-dashboard-widget table.wp-list-table {
245 margin-bottom: 0px;
246 table-layout: auto;
247 }
248
249 .frm-white-body .frm-dashboard-widget table.wp-list-table .row-actions{
250 display: none;
251 }
252
253 .frm-white-body .frm-dashboard-widget table.wp-list-table th,
254 .frm-white-body .frm-dashboard-widget table.wp-list-table td,
255 .frm-dashboard-widget table.wp-list-table th,
256 .frm-dashboard-widget table.wp-list-table td {
257 padding: var(--gap-xs) var(--gap-md);
258 vertical-align: middle;
259 }
260
261 .frm-dashboard-widget table.wp-list-table td {
262 font-size: var(--text-sm);
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