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

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