PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 5.0.08
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v5.0.08
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
← All changes | css/frm_admin.css +1563 -2373 6.55.0.08 View file →
@@ -1,102 +1,33 @@
1 1 @import url(font_icons.css);
2 2
3 3 :root,
4 -.frm-white-body,
5 4 .frm_wrap {
6 - --grey-900: #101828;
7 - --grey-800: #1D2939;
8 - --grey-700: #344054;
9 - --grey-500: #667085; /* Roughly 65% opacity */
10 - --grey-400: #98A2B3;
11 - --grey-300: #D0D5DD;
12 - --grey-200: #EAECF0;
13 - --grey-100: #F2F4F7;
14 - --grey-50: #F9FAFB;
15 - --grey-25: #FCFCFD;
16 - --darkest-grey: var(--grey-900); /* Deprecated */
17 - --dark-grey: var(--grey-700); /* Deprecated */
5 + --light-blue: rgba(188, 224, 253, .2);
6 + --blue-border: rgb(188, 224, 253);
7 + --darkest-grey: rgb(40, 47, 54);
8 + --dark-grey: rgba(40, 47, 54, .85);
18 9 --medium-grey: rgba(40, 47, 54, .65);
19 - --grey: var(--grey-500); /* Deprecated */
20 - --grey-border: var(--grey-300); /* Deprecated */
10 + --grey: rgba(40, 47, 54, .45);
11 + --grey-border: rgba(40, 47, 54, .2);
21 12 --lightest-grey: rgb(250, 250, 250);
22 - --sidebar-color: var(--grey-50);
23 - --sidebar-hover: var(--grey-200);
24 - --primary-700: #2B66A9;
25 - --primary-500: #4199FD;
26 - --primary-25: #F5FAFF;
27 - --primary-color: var(--primary-500); /* Deprecated */
28 - --primary-hover: var(--primary-700); /* Deprecated */
29 - --light-blue: var(--primary-25); /* Deprecated */
30 - --blue-border: rgb(188, 224, 253);
31 - --error-500: #F04438;
32 - --error-700: #B42318;
13 + --sidebar-color: rgb(246, 247, 251);
14 + --sidebar-hover: rgb(227, 232, 235);
15 + --primary-color: rgb(65, 153, 253);
16 + --primary-hover: rgb(49, 119, 199);
33 17 --green: rgb(63, 172, 37);
34 18 --orange: #F15A24;
35 19 --pink: rgb(226, 42, 110);
36 20 --purple: rgb(141, 53, 245);
37 21 --border-radius: 35px;
38 - --small-radius: 8px;
22 + --small-radius: 6px;
39 23 --small-sidebar: 275px;
40 24 --medium-sidebar: 350px;
41 25 --big-sidebar: 390px;
42 26 --biggest-sidebar: 450px;
43 - --text-xs: 12px;
44 - --text-sm: 14px;
45 - --text-md: 16px;
46 - --text-lg: 18px;
47 - --text-xl: 20px;
48 - --h-xs: 24px;
49 - --h-sm: 30px;
50 - --h-md: 36px;
51 - --leading: 1.5;
52 - --gap-2xs: 4px;
53 - --gap-xs: 8px;
54 - --gap-sm: 16px;
55 - --gap-md: 24px;
56 - --gap-lg: 32px;
57 - --gap-xl: 40px;
58 - --gap-2xl: 48px;
59 - --box-shadow-sm: 0px 0.470745px 1.41223px rgba(16, 24, 40, 0.1), 0px 0.470745px 0.941489px rgba(16, 24, 40, 0.06);
60 - --box-shadow-md: 0px 1.88298px 3.76596px -0.941489px rgba(16, 24, 40, 0.1), 0px 0.941489px 1.88298px -0.941489px rgba(16, 24, 40, 0.06);
61 - --box-shadow-lg: 0px 6px 8px -2px rgba(16, 24, 40, 0.08), 0px 1.88298px 4px -1px rgba(16, 24, 40, 0.03), 0px 0.470745px 1.41223px rgba(16, 24, 40, 0.1), 0px 0.470745px 0.941489px rgba(16, 24, 40, 0.06);
62 - --box-shadow-xl: 0px 9.41489px 11.2979px -1.88298px rgba(16, 24, 40, 0.08), 0px 3.76596px 3.76596px -1.88298px rgba(16, 24, 40, 0.03);
63 27 }
64 28
65 -@font-face {
66 - font-family: 'Inter';
67 - src: url('../fonts/Inter-VariableFont_slnt,wght.ttf?v=1') format('truetype');
68 -}
69 -
70 -.with_frm_style,
71 -.frm-white-body .wpbody-content,
72 -.frm_wrap {
73 - font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
74 -}
75 -
76 -/* Safari 11+ */
77 -@media not all and (min-resolution:.001dpcm) {
78 - @supports (-webkit-appearance:none) and (stroke-color:transparent) {
79 - .with_frm_style,
80 - .frm-white-body .wpbody-content,
81 - .frm_wrap {
82 - -webkit-font-smoothing: antialiased;
83 - }
84 - }
85 -}
86 -
87 -.frm-white-body,
88 -.frm-white-body p,
89 -.frm_wrap,
90 -.frm_wrap p,
91 -.frm-modal,
92 -.frm-white-body .postbox .inside {
93 - font-size: var(--text-sm);
94 - color: var(--grey-500);
95 - line-height: var(--leading);
96 -}
97 -
98 -body:not(.frm-admin-page-styles):not(.frm-admin-page-style) .with_frm_style .frm_form_fields > fieldset {
29 +body:not(.frm-admin-page-styles) .with_frm_style .frm_form_fields > fieldset {
99 30 --fieldset-padding: 15px 0;
100 31 }
101 32
102 33 a, .widget .widget-top, .stuffbox h3, .frm-collapsed {
@@ -103,13 +34,12 @@
103 34 cursor: pointer;
104 35 text-decoration: none;
105 36 }
106 37
107 -.post-type-frm_display .wrap > #posts-filter,
108 38 .wrap.frm-with-margin,
109 39 #frm_top_bar + .wrap,
110 40 .frm_wrap > .wrap {
111 - margin: var(--gap-sm) var(--gap-md) var(--gap-md);
41 + margin: 10px 40px 30px;
112 42 }
113 43
114 44 .frm-full-screen #wpbody-content > .wrap {
115 45 margin: 0;
@@ -118,12 +48,23 @@
118 48 .post-type-frm_display .wrap {
119 49 margin: 0;
120 50 }
121 51
52 +.columns-2 .frm-right-panel + #post-body-content {
53 + padding-bottom: 26px;
54 + border-left: 1px solid var(--sidebar-hover);
55 +}
56 +
122 57 .toplevel_page_formidable #post-body-content {
123 58 overflow-x: visible;
124 59 }
125 60
61 +.formidable_page_formidable-pro-upgrade #wpfooter,
62 +.toplevel_page_formidable #wpfooter {
63 + border-top: 1px solid #ddd;
64 + background: #fff;
65 +}
66 +
126 67 .frm-full-screen {
127 68 height: 100%;
128 69 overflow: hidden;
129 70 }
@@ -133,57 +74,37 @@
133 74 .frm-full-screen.post-type-frm_display {
134 75 overflow: auto;
135 76 }
136 77
137 -.frm-full-screen #wpadminbar,
138 -.frm-full-screen #adminmenumain,
139 78 .frm-full-screen .wp-header-end {
140 79 display: none;
141 80 }
142 81
143 -body.frm-white-body:not(.frm-full-screen) .mce-fullscreen {
144 - top: 32px;
145 - left: 160px;
146 -}
147 -
148 82 .frm-full-screen #wpbody-content,
149 83 .frm-full-screen #wpbody,
150 84 .frm-full-screen #wpcontent {
151 - padding: 0;
85 + padding-bottom: 0;
152 86 overflow: hidden;
153 - margin: 0 !important;
154 87 }
155 88
156 -.frm-white-body #wpbody-content {
157 - position: relative; /* For screen meta links */
158 - padding-bottom: 0;
159 -}
160 -
161 89 .post-new-php.post-type-frm_display #screen-meta-links,
162 -.post-php.post-type-frm_display #screen-meta-links {
90 +.post-php.post-type-frm_display #screen-meta-links,
91 +.frm-full-screen #wpfooter {
163 92 display: none;
164 93 }
165 94
166 -.frm-white-body #screen-meta-links {
167 - position: fixed;
168 - bottom: 0;
169 - right: 20px;
95 +.frm-white-body #screen-meta-links .screen-meta-toggle {
96 + position: absolute;
97 + right: 160px;
98 + box-shadow: none;
99 + border-bottom-left-radius: var(--small-radius);
100 + border-bottom-right-radius: var(--small-radius);
170 101 }
171 102
172 -.frm-full-screen #screen-meta-links .screen-meta-toggle {
173 - right: 55px;
174 -}
175 -
176 103 .frm-white-body #screen-meta-links .show-settings {
177 - border-radius: var(--small-radius) var(--small-radius) 0 0;
178 - border: 1px solid var(--grey-300);
179 - border-bottom: none;
104 + box-shadow: none;
180 105 }
181 106
182 -.frm-white-body.frm-lite #screen-meta-links .screen-meta-toggle {
183 - right: 125px; /* Don't cover the lite upgrade button */
184 -}
185 -
186 107 .frm-white-body #screen-meta {
187 108 margin: 0;
188 109 }
189 110
@@ -191,9 +112,9 @@
191 112 color: var(--grey);
192 113 }
193 114
194 115 .frm-white-body .columns-2 {
195 - border-bottom: 1px solid var(--grey-300);
116 + border-bottom: 1px solid var(--grey-border);
196 117 }
197 118
198 119 .frm-full-screen .columns-2 {
199 120 border: none;
@@ -223,13 +144,8 @@
223 144 .frm_wrap .tablenav {
224 145 margin-bottom: 10px;
225 146 }
226 147
227 -.frm-white-body .tablenav .actions select,
228 -.wp-admin .frm_wrap .tablenav select {
229 - margin-right: var(--gap-xs);
230 -}
231 -
232 148 .tablenav .actions .button {
233 149 margin-top: 1px;
234 150 }
235 151
@@ -245,17 +161,17 @@
245 161 background: #fff;
246 162 }
247 163
248 164 .frm-white-body table.widefat th {
249 - font-size: var(--text-md);
165 + font-size: 16px;
250 166 }
251 167
252 168 .frm-white-body table.widefat th a {
253 - color: var(--grey-700);
169 + color: var(--dark-grey);
254 170 }
255 171
256 172 .frm-white-body table.widefat strong a {
257 - color: var(--primary-700);
173 + color: var(--primary-hover);
258 174 }
259 175
260 176 .frm-scroll-box {
261 177 clear: both;
@@ -260,9 +176,9 @@
260 176 .frm-scroll-box {
261 177 clear: both;
262 178 overflow: auto;
263 179 max-height: 405px;
264 - border: 1px solid var(--grey-300);
180 + border: 1px solid var(--grey-border);
265 181 border-radius: var(--small-radius);
266 182 }
267 183
268 184 .frm_form_field.frm_scroll_box .frm_opt_container {
@@ -267,9 +183,9 @@
267 183
268 184 .frm_form_field.frm_scroll_box .frm_opt_container {
269 185 height: 100px;
270 186 overflow: auto;
271 - border: 1px solid var(--grey-300);
187 + border: 1px solid var(--grey-border);
272 188 }
273 189
274 190 .frm-short-list {
275 191 overflow: auto;
@@ -276,9 +192,9 @@
276 192 max-height: 190px;
277 193 }
278 194
279 195 .frm-white-body table.frm-border td {
280 - font-size: var(--text-sm);
196 + font-size: 14px;
281 197 }
282 198
283 199 .frm-white-body .striped > tbody > :nth-child(odd) {
284 200 background-color: #fff;
@@ -292,149 +208,56 @@
292 208 float: right;
293 209 }
294 210
295 211 #frm_top_bar {
296 - display: flex;
297 - gap: var(--gap-sm);
212 + display: block;
298 213 width: 100%;
299 - height: 72px;
214 + max-height: 100px;
215 + padding: 25px 40px 25px;
300 216 margin: 0;
301 217 box-sizing: border-box;
302 218 text-align: center;
303 - padding: 0 var(--gap-md);
304 219 }
305 220
306 -#frm_top_bar > .frm-full-close:last-child,
307 -#frm_top_bar > #frm-publishing:last-child {
308 - margin-left: auto;
309 -}
310 -
311 -#frm_top_bar {
312 - border-bottom: 1px solid var(--grey-300);
313 - padding: 0 var(--gap-md);
221 +.post-type-frm_display:not(.edit-php) #frm_top_bar,
222 +.frm-full-screen.post-type-frm_display #frm_top_bar,
223 +.frm_page_container #frm_top_bar {
224 + border-bottom: 1px solid var(--grey-border);
225 + padding: 0 20px;
314 226 overflow: visible;
315 227 }
316 228
317 -.frm-white-body h1,
318 -.frm-white-body h2,
319 -.frm-white-body h3,
320 -.frm-white-body h4 {
321 - color: var(--grey-900);
322 - font-weight: 400;
323 - line-height: var(--leading) !important;
229 +.frm-full-screen #frm_top_bar {
230 + padding: 0 15px !important;
324 231 }
325 232
326 -.frm-white-body .wrap h1,
327 -.frm-white-body h1 {
328 - font-size: var(--text-xl);
329 -}
330 -
331 -.frm-white-body .wrap h2,
332 -.frm-white-body h2 {
333 - font-size: var(--text-lg);
334 -}
335 -
336 -.frm-white-body .wrap h3,
337 -.frm-white-body h3 {
338 - font-size: var(--text-md);
339 -}
340 -
341 -.frm-white-body .wrap h4,
342 -.frm-white-body h4 {
343 - font-size: var(--text-sm);
344 - font-weight: 500;
345 -}
346 -
347 -/* Override CSS in Views plugin. */
348 -.frm-views-editor-body .frm_page_container #frm_top_bar h1 {
349 - padding: 0 !important;
350 - color: var(--grey-900);
351 - font-size: var(--text-xl) !important;
352 -}
353 -
354 -.post-type-frm_display .frm_top_left {
355 - padding-bottom: 0 !important;
356 -}
357 -
358 -.frm-new-table-view-option.frm-selected-table-view-option {
359 - border-radius: var(--small-radius);
360 - background: var(--primary-25);
361 -}
362 -
363 -.frm-views-editor-body #frm_adv_info .tabs-panel { /* Views sidebar */
364 - padding-left: 4px;
365 - padding-right: 4px;
366 -}
367 -
368 -#frm_edit_box_content_modal .frm_modal_footer {
369 - padding-top: var(--gap-sm);
370 - border-top: 1px solid var(--grey-300);
371 -}
372 -
373 -#frm_edit_box_content_modal .frm_modal_footer > div {
374 - display: flex;
375 - justify-content: space-between;
376 -}
377 -
378 -#frm_edit_box_content_modal #frm_modal_box_select_area,
379 -#frm_edit_box_content_modal #frm_box_content_wysiwyg_wrapper,
380 -#frm_edit_box_content_modal .frm_modal_content {
381 - max-height: calc(100vh - 176px) !important;
382 -}
383 -
384 -#frm_edit_box_content_modal #frm_modal_box_select_area {
385 - height: calc(100vh - 176px) !important;
386 -}
387 -
388 -#frm_edit_box_content_modal #wp-content-editor-tools {
389 - padding-top: 0;
390 -}
391 -
392 -#frm_edit_box_content_modal.frm-modal .postbox .frm-modal-title + div:last-child {
393 - right: var(--gap-md);
394 -}
395 -
396 -.frm_code_list.frm-full-hover .frm-dropdown-view a {
397 - flex-direction: row-reverse; /* Switch in the HTML */
398 -}
399 -
400 -#frm_view_editor_left.frm-right-panel .accordion-section-title:before {
401 - content: '' !important;
402 - margin: 0;
403 -}
404 -/** End Temporary View CSS */
405 -
406 233 .frm-upgrade-bar {
407 - background: rgba(188, 224, 253, 0.23);
234 + text-align: center;
235 + background: var(--sidebar-color);
408 236 border-bottom: 1px solid var(--sidebar-hover);
409 - padding: 3px 0 3px 40px;
237 + padding: 3px 0;
410 238 font-size: 95%;
411 239 }
412 240
413 241 .frm-upgrade-bar span {
414 - opacity: .9;
242 + opacity: .5;
415 243 }
416 244
417 245 a h1 .frmsvg {
418 - color: var(--grey-400);
419 - vertical-align: middle;
420 - min-width: var(--text-sm);
246 + color: var(--medium-grey);
247 + vertical-align: baseline;
421 248 }
422 249
423 -a .frmsvg {
424 - color: currentColor;
425 -}
426 -
427 250 .frm_wrap .view-switch a.current:before,
428 -.frm-white-body a,
429 -.frm_wrap a,
430 -.frm_wrap a i {
251 +a .frmsvg,
252 +.frm_wrap a i,
253 +.frm_wrap a {
431 254 color: var(--primary-color);
432 255 }
433 256
434 257 .frm_wrap a:active,
435 258 .frm_wrap a:hover {
436 - color: var(--primary-700);
259 + color: var(--primary-hover);
437 260 box-shadow: none;
438 261 }
439 262
440 263 .post-type-frm_display a:focus,
@@ -448,30 +271,34 @@
448 271 white-space: nowrap;
449 272 max-width: 250px;
450 273 overflow: hidden;
451 274 text-overflow: ellipsis;
452 - align-self: center;
453 275 }
454 276
455 -.post-type-frm_display .frm_top_left,
456 277 .frm_top_left.frm_top_wide {
457 278 max-width: 100%;
458 279 }
459 280
460 -.post-type-frm_display .frm_nav_bar .frm-header-logo,
461 -.frm_nav_bar .frm-header-logo {
462 - margin: 18px 0 10px;
281 +.frm-header-logo,
282 +.edit-php.post-type-frm_display .frm-header-logo {
283 + float: left;
284 + margin: 0 15px 0 0;
463 285 }
464 286
465 -#frm_top_bar .frm_form_nav {
466 - flex: 1;
287 +.frm-full-screen.post-type-frm_display .frm-header-logo,
288 +.post-type-frm_display .frm-header-logo,
289 +.frm_page_container .frm-header-logo {
290 + margin: 13px 0 0;
467 291 }
468 292
293 +.frm_page_container .frm-header-logo {
294 + margin-bottom: 6px;
295 +}
296 +
469 297 ul.frm_form_nav {
470 298 margin: 0 auto;
471 - padding-top: 18px;
299 + padding-top: 19px;
472 300 display: block;
473 - min-width: 240px;
474 301 }
475 302
476 303 .nav-tab-wrapper.frm_form_nav {
477 304 padding: 0 25px;
@@ -477,9 +304,9 @@
477 304 padding: 0 25px;
478 305 }
479 306
480 307 ul.frm_form_nav > li {
481 - margin: 0 min(3.5%, 32px) 0 0;
308 + margin: 0 3.5% 0 0;
482 309 display: inline-block;
483 310 }
484 311
485 312 .post-type-frm_display #advanced-sortables h2.hndle,
@@ -489,12 +316,13 @@
489 316 .frm_form_nav > li > a {
490 317 font-size: 1.3em;
491 318 text-decoration: none;
492 319 display: block;
493 - padding: 6px 2px 4px;
320 + padding: 5px 2px 15px;
494 321 font-weight: 500;
495 - color: var(--grey-700);
496 - border-bottom: 2px solid transparent;
322 + color: var(--dark-grey);
323 + border-bottom: 3px solid transparent;
324 + letter-spacing: 1px;
497 325 }
498 326
499 327 .post-type-frm_display.js .postbox .handlediv .toggle-indicator:before {
500 328 margin-top: 10px;
@@ -509,15 +337,15 @@
509 337 box-shadow: none;
510 338 }
511 339
512 340 .frm_form_nav > li > a {
513 - font-size: var(--text-md);
514 - font-weight: 400;
515 - color: var(--grey-500);
341 + font-size: 13px;
342 + text-transform: uppercase;
343 + opacity: .8;
516 344 }
517 345
518 346 .frm_form_nav > li > a:hover {
519 - border-color: var(--primary-700);
347 + border-color: var(--primary-hover);
520 348 }
521 349
522 350 .frm_form_nav .frm-dropdown-menu a:hover {
523 351 background-color: #eaf2fa;
@@ -525,27 +353,25 @@
525 353
526 354 .post-type-frm_display .frm_form_nav .nav-tab-active,
527 355 .post-type-frm_display .frm_form_nav .nav-tab-active:hover,
528 356 .frm_form_nav > li a.current_page {
529 - color: var(--primary-500);
530 - border-color: var(--primary-500);
357 + color: var(--primary-color);
358 + border-color: var(--primary-color);
531 359 background: transparent;
532 360 opacity: 1;
533 - font-weight: 600;
534 361 }
535 362
536 363 .frm-full-close {
537 364 display: none;
538 - padding-left: var(--gap-md);
539 - border: 0 solid var(--grey-300);
540 - border-left-width: 1px; /* Make RTL a bit less maintenance */
365 + float: right;
366 + padding: 15px 0 14px 12px;
367 + border-left: 1px solid var(--grey-border);
541 368 height: 100%;
542 369 box-sizing: border-box;
543 370 }
544 371
545 372 .frm-full-screen .frm-full-close {
546 - display: flex;
547 - align-items: center;
373 + display: block;
548 374 }
549 375
550 376 .frm-full-close a {
551 377 display: block;
@@ -554,49 +380,57 @@
554 380 .frm-full-close .frmsvg {
555 381 font-size: 20px;
556 382 width: 20px;
557 383 height: 20px;
558 - color: var(--grey-500);
384 + padding: 5px;
385 + color: var(--grey);
559 386 }
560 387
561 -#frm_top_bar h1 {
388 +.edit-php.post-type-frm_display #frm_top_bar h1,
389 +.frm_wrap #frm_top_bar h1 {
390 + font-size: 22px;
562 391 font-weight: 400;
563 392 padding: 0;
564 393 margin: 0;
565 - color: var(--grey-900);
566 - display: inline-flex;
567 - gap: var(--gap-sm);
568 - align-items: center;
394 + color: var(--medium-grey);
395 + display: inline-block;
396 + line-height: 1.4;
397 +}
398 +
399 +.frm-full-screen.post-type-frm_display #frm_top_bar h1,
400 +.post-type-frm_display #frm_top_bar h1,
401 +.frm_page_container #frm_top_bar h1 {
402 + margin: 0 15px;
403 + padding: 20px 0 0;
569 404 text-align: left;
570 405 width: 200px;
406 + line-height: 1.16;
571 407 }
572 408
573 -#frm_top_bar h1 span {
409 +.frm-full-screen.post-type-frm_display #frm_top_bar h1 span,
410 +.post-type-frm_display #frm_top_bar h1 span,
411 +.frm_page_container #frm_top_bar h1 span {
412 + font-size: 19px;
574 413 max-width: 175px;
575 414 text-overflow: ellipsis;
576 415 overflow: hidden;
577 416 white-space: nowrap;
578 417 display: inline-block;
579 - vertical-align: bottom;
580 418 }
581 419
582 -#frm_top_bar ul.frm_form_nav,
583 -#frm_top_bar .frm-header-logo,
584 -#frm_top_bar #frm_bs_dropdown {
585 - align-self: center;
586 - margin-top: 0;
587 - margin-bottom: 0;
588 - padding-top: 0;
420 +#frm_top_bar h1,
421 +#frm_top_bar h2 {
422 + color: var(--medium-grey);
589 423 }
590 424
591 -#frm_top_bar .frm-header-logo {
592 - display: flex; /* Get rid of extra padding below logo */
425 +#frm_top_bar #frm_bs_dropdown {
426 + float: left;
593 427 }
594 428
595 429 #frm_top_bar h2 {
596 430 float: left;
597 - margin: 0 0 0 var(--gap-sm);
598 - padding: 2px 0 2px var(--gap-sm);
431 + margin: 0 0 0 15px;
432 + padding: 2px 0 2px 15px;
599 433 font-weight: normal;
600 434 border-left: 2px solid var(--grey);
601 435 }
602 436
@@ -604,19 +438,27 @@
604 438 margin-top: 0;
605 439 }
606 440
607 441 #frm-publishing {
442 + float: right;
443 + margin-top: 15px;
608 444 min-width: 225px;
609 - align-self: center;
610 - align-items: center;
611 - display: flex;
612 - flex-direction: row-reverse;
613 - gap: 0 var(--gap-sm);
614 - flex-wrap: wrap;
445 + max-width: 325px;
446 + min-height: 10px;
615 447 }
616 448
449 +#frm-publishing #publishing-action,
450 +#frm-publishing #preview-action,
451 +#frm-preview-action,
452 +#frm-publishing > input[type=submit],
453 +#frm-publishing > .button,
454 +#frm-publishing > button {
455 + float: right;
456 + margin: 0 10px 0 0;
457 +}
458 +
617 459 .frm_wrap .postbox {
618 - border-color: var(--grey-300);
460 + border-color: var(--grey-border);
619 461 border-radius: 6px;
620 462 box-shadow: none;
621 463 }
622 464
@@ -624,9 +466,9 @@
624 466 cursor: default;
625 467 padding: 10px 20px;
626 468 margin: 0;
627 469 line-height: 1.4em;
628 - border-color: var(--grey-300);
470 + border-color: var(--grey-border);
629 471 }
630 472
631 473 .frm-pre-hndle {
632 474 font-size: 15px;
@@ -637,12 +479,8 @@
637 479 .frm-empty-row {
638 480 display: none;
639 481 }
640 482
641 -.frm-child-row {
642 - box-shadow: 5px 0px 0px 0px inset var(--sidebar-hover);
643 -}
644 -
645 483 .frm_animate_bg {
646 484 transition: background 200ms linear, color 200ms linear;
647 485 }
648 486
@@ -650,48 +488,16 @@
650 488 clear: both;
651 489 margin: 0;
652 490 }
653 491
654 -.frm_wrap .subsubsub a {
655 - line-height: var(--leading);
656 - font-size: var(--text-sm);
657 -}
658 -
659 -.frm-admin-page-styles .frm_page_container,
660 -.frm_wrap .frm_page_container { /* Use .frm_wrap to avoid messing up Views editor layout */
492 +.frm_wrap .frm_page_container {
661 493 height: calc( 100vh - 32px );
662 494 display: flex;
663 495 flex-direction: column;
664 496 overflow: hidden;
665 497 padding-top: 0;
666 - position: fixed;
667 - top: 32px;
668 - bottom: 0;
669 - left: 0;
670 - right: 0;
671 498 }
672 499
673 -.frm-admin-page-translate .frm_wrap .frm_page_container, .frm-admin-page-update_translations .frm_wrap .frm_page_container {
674 - position: static;
675 -}
676 -
677 -.auto-fold.frm-admin-page-styles .frm_page_container,
678 -.auto-fold .frm_wrap .frm_page_container {
679 - left: 160px;
680 -}
681 -
682 -.folded.frm-admin-page-styles .frm_page_container,
683 -.folded .frm_wrap .frm_page_container {
684 - left: 38px;
685 -}
686 -
687 -.frm-full-screen.frm-admin-page-styles .frm_page_container,
688 -.frm-full-screen .frm_wrap .frm_page_container {
689 - height: 100vh;
690 - top: 0;
691 - left: 0;
692 -}
693 -
694 500 .frm-full-screen.frm-admin-page-entries .frm_page_container,
695 501 .frm-new-entry .frm_page_container,
696 502 .frm-admin-page-reports .frm_page_container,
697 503 .frm_list_entry_page .frm_page_container {
@@ -702,22 +508,16 @@
702 508 .frm-new-entry .columns-2 {
703 509 border: none;
704 510 }
705 511
706 -.frm-white-body #frm_top_bar,
707 -.frm-white-body .columns-2 {
512 +.frm_wrap #frm_top_bar,
513 +.frm_wrap .columns-2 {
708 514 flex: 0 0 auto;
709 515 }
710 516
711 -.columns-2 .frm-right-panel + div {
712 - padding-bottom: var(--gap-md);
713 - border-left: 1px solid var(--sidebar-hover);
714 -}
715 -
716 -.columns-2 .frm-right-panel + div,
717 517 .frm_wrap #post-body-content {
718 518 padding-bottom: 0;
719 - padding-top: var(--gap-sm);
519 + padding-top: 20px;
720 520 margin-bottom: 0;
721 521 background: #fff;
722 522 width: auto;
723 523 float: none;
@@ -723,17 +523,16 @@
723 523 float: none;
724 524 flex: 2;
725 525 }
726 526
727 -.frm-white-body .columns-2 {
527 +.frm_wrap .columns-2 {
728 528 flex: 1;
729 529 display: flex;
730 530 overflow: hidden;
731 531 }
732 532
733 -.frm-white-body .columns-2 > div {
533 +.frm_wrap .columns-2 > div {
734 534 overflow-y: auto;
735 - box-sizing: border-box;
736 535 }
737 536
738 537 .frm_wrap .columns-2 .frm-right-panel,
739 538 .frm-right-panel {
@@ -780,9 +579,9 @@
780 579
781 580 .frm-default-switcher a.current,
782 581 .frm-default-switcher a.current .frmsvg,
783 582 .frm-default-switcher a.current i {
784 - color: var( --primary-500);
583 + color: var( --primary-color);
785 584 }
786 585
787 586 #new_fields,
788 587 .frm-has-modal,
@@ -790,15 +589,41 @@
790 589 position: relative;
791 590 }
792 591
793 592 .frm-inline-modal.postbox {
593 + border-color: var(--blue-border);
794 594 background: #fff;
795 595 }
796 596
597 +#frm_upgrade_modal .dismiss .frmsvg,
598 +.frm-inline-modal .frmsvg,
599 +#frm-bulk-modal .frmsvg,
600 +.frm_has_shortcodes > .frmsvg,
601 +#frm_upgrade_modal .dismiss i,
602 +.frm-inline-modal i,
603 +#frm-bulk-modal i,
604 +.frm_has_shortcodes > i {
605 + top: 37px;
606 + right: 5px;
607 + margin-top: -9px;
608 + padding: 5px;
609 + font-size: 10px;
610 + height: 10px;
611 + width: 10px;
612 + line-height: 9px;
613 + font-weight: bold;
614 +}
615 +
616 +#frm_upgrade_modal .dismiss .frmsvg,
617 +.frm-inline-modal .frmsvg,
618 +#frm-bulk-modal .frmsvg,
797 619 .frm_has_shortcodes .frmsvg,
798 -.frm_has_shortcodes i:not([class*=mce-]) {
620 +#frm_upgrade_modal .dismiss i,
621 +.frm-inline-modal i,
622 +#frm-bulk-modal i,
623 +.frm_has_shortcodes i {
799 624 position: absolute;
800 - color: var(--primary-500);
625 + color: var(--primary-color);
801 626 border-radius: 50%;
802 627 border: 1px solid transparent;
803 628 z-index: 100;
804 629 text-align: center;
@@ -803,8 +628,51 @@
803 628 z-index: 100;
804 629 text-align: center;
805 630 }
806 631
632 +#frm_info_modal .dismiss .frmsvg,
633 +#frm_confirm_modal .dismiss .frmsvg,
634 +#frm_upgrade_modal .dismiss .frmsvg,
635 +#frm_info_modal .dismiss i,
636 +#frm_confirm_modal .dismiss i,
637 +#frm_upgrade_modal .dismiss i {
638 + top: 7px;
639 + right: 7px;
640 +}
641 +
642 +#frm-bulk-modal .frmsvg,
643 +#frm-bulk-modal i {
644 + top: 15px;
645 + right: 7px;
646 +}
647 +
648 +.frm-inline-modal .frmsvg,
649 +.frm-inline-modal i {
650 + top: 18px;
651 + right: 7px;
652 + font-size: 11px;
653 + height: 11px;
654 + width: 11px;
655 +}
656 +
657 +#frm_upgrade_modal .dismiss:hover .frmsvg,
658 +.frm-inline-modal .dismiss:hover .frmsvg,
659 +#frm-bulk-modal .dismiss:hover .frmsvg,
660 +#frm_upgrade_modal .dismiss i:hover,
661 +.frm-inline-modal i:hover,
662 +#frm-bulk-modal i:hover {
663 + background: var(--sidebar-color);
664 +}
665 +
666 +#frm_upgrade_modal .dismiss .frmsvg,
667 +.frm-inline-modal .dismiss .frmsvg,
668 +#frm-bulk-modal .dismiss .frmsvg,
669 +#frm_upgrade_modal .dismiss .frm_close_icon,
670 +.frm-inline-modal .frm_close_icon,
671 +#frm-bulk-modal .frm_close_icon {
672 + border-color: var(--primary-color);
673 +}
674 +
807 675 .frm_has_shortcodes input,
808 676 .frm_has_shortcodes textarea {
809 677 padding-left: 18px;
810 678 box-sizing: border-box;
@@ -811,11 +679,13 @@
811 679 }
812 680
813 681 #form_settings_page #frm_adv_info {
814 682 display: none;
683 + position: absolute;
815 684 top: 0;
816 - width: 310px;
817 - max-height: 315px;
685 + left: 0;
686 + width: 300px;
687 + max-height: 350px;
818 688 min-height: 200px;
819 689 overflow-y: scroll;
820 690 z-index: 100;
821 691 }
@@ -826,14 +696,10 @@
826 696 width: var(--small-sidebar);
827 697 min-width: var(--small-sidebar);
828 698 }
829 699
830 -#form_global_settings .frm_grid_container {
831 - gap: 0 var(--gap-md);
832 -}
833 -
834 700 .frm-inner-content {
835 - padding: var(--gap-md);
701 + padding: 10px 25px;
836 702 }
837 703
838 704 .post-type-frm_display #poststuff {
839 705 padding: 0 0 10px 40px;
@@ -899,17 +765,18 @@
899 765 }
900 766
901 767 .frm-right-panel .frm_field_list #frm-insert-fields {
902 768 max-height: none;
903 - font-size: var(--text-sm);
769 + font-size: 14px;
904 770 padding: 0;
905 771 }
906 772
907 -.frm-nav-tabs {
773 +.frm-nav-tabs,
774 +#frm-bulk-modal h2 {
908 775 margin: 10px 0 20px;
909 - padding: 0 var(--gap-sm);
776 + padding: 0 15px;
910 777 display: block;
911 - border-bottom: 1px solid var(--grey-300);
778 + border-bottom: 2px solid var(--sidebar-hover);
912 779 }
913 780
914 781 #frm-nav-tabs {
915 782 position: -webkit-sticky;
@@ -920,20 +787,11 @@
920 787 margin-top: 0;
921 788 padding-top: 5px;
922 789 }
923 790
924 -.frm_form_settings #frm_adv_info #frm-nav-tabs {
925 - background-color: #fff;
926 - margin: 0 -4px;
927 -}
928 -
929 -.frm_form_settings span.frm-with-right-icon {
930 - display: block;
931 -}
932 -
933 791 .frm-inline-modal .frm-nav-tabs,
934 792 #frm_adv_info .frm-nav-tabs {
935 - margin: 5px 0 0;
793 + margin: 5px 0 10px;
936 794 }
937 795
938 796 #frm_adv_info .frm-nav-tabs.frm-compact-nav {
939 797 padding-right: 0;
@@ -939,25 +797,23 @@
939 797 padding-right: 0;
940 798 padding-left: 20px;
941 799 }
942 800
801 +#frm-bulk-modal h2,
943 802 .frm-nav-tabs li {
944 803 display: inline-block;
804 + font-size: 15px;
945 805 margin: 0;
946 806 }
947 807
808 +#frm-bulk-modal h2,
948 809 .frm-nav-tabs a {
949 - color: var(--grey-700);
810 + color: var(--dark-grey);
950 811 padding: 10px 1px;
951 812 margin: 0 9px;
952 813 border-bottom: 2px solid transparent;
953 814 }
954 815
955 -.frm_form_settings #frm_adv_info .frm-nav-tabs a {
956 - padding: 5px 1px;
957 - color: var(--grey-500);
958 -}
959 -
960 816 .frm-nav-tabs.frm-compact-nav a {
961 817 margin: 0 5px;
962 818 }
963 819
@@ -966,37 +822,33 @@
966 822 opacity: .9;
967 823 }
968 824
969 825 #frm_adv_info .frm-nav-tabs a {
970 - color: var(--grey-700);
826 + color: var(--dark-grey);
971 827 }
972 828
829 +#frm-bulk-modal h2,
973 830 .frm-nav-tabs a:hover,
974 831 .frm-nav-tabs .frm-tabs a {
975 - color: var(--primary-500) !important;
976 - border-color: var(--primary-500);
832 + color: var(--primary-color) !important;
833 + border-color: var(--primary-color);
977 834 }
978 835
979 -.frm_form_settings #frm_adv_info .frm-nav-tabs .frm-tabs a {
980 - font-weight: 500;
836 +#frm-bulk-modal h3,
837 +#frm-bulk-modal h2 {
838 + font-size: 16px;
839 + margin-left: 20px;
840 + font-weight: 400;
981 841 }
982 842
983 -#frm-bulk-modal .howto,
984 843 #frm-bulk-modal h3 {
985 - font-size: var(--text-sm);
986 - font-weight: 400;
987 - margin: 5px 0 10px;
844 + margin: 5px 20px 10px;
988 845 color: var(--grey);
989 846 }
990 847
991 -#frm-bulk-modal h3 {
992 - margin-left: 20px;
993 -}
994 -
995 -.frm-right-panel a.frm_add_logic_link,
996 848 .frm-right-panel h3 {
997 - color: var(--grey-700);
998 - font-size: var(--text-lg);
849 + color: var(--dark-grey);
850 + font-size: 20px;
999 851 font-weight: 400;
1000 852 border-top: 2px solid var(--sidebar-hover);
1001 853 margin: 0;
1002 854 }
@@ -1006,17 +858,10 @@
1006 858 border-top: none;
1007 859 padding-top: 0 !important;
1008 860 }
1009 861
1010 -.frm-flex-justify,
1011 -.frm-right-panel .frm-single-settings h3 {
1012 - display: flex;
1013 - justify-content: space-between;
1014 - align-items: center;
1015 -}
1016 -
1017 862 .frm-right-panel h3 i {
1018 - color: var(--grey-700);
863 + color: var(--dark-grey);
1019 864 float: right;
1020 865 width: 16px;
1021 866 cursor: pointer;
1022 867 }
@@ -1078,12 +923,8 @@
1078 923 .frm_wrap #frm-categorydiv {
1079 924 border-right: none;
1080 925 }
1081 926
1082 -#frm_adv_info #frm-conditionals {
1083 - padding-top: var(--gap-sm);
1084 -}
1085 -
1086 927 #postbox-container-1 #taxonomy-linkcategory #frm-html-tags {
1087 928 display: none;
1088 929 max-height: none;
1089 930 }
@@ -1091,49 +932,12 @@
1091 932 #postbox-container-1 .frm_field_list #frm-insert-fields .frmbutton.dropdown {
1092 933 position: relative;
1093 934 }
1094 935
1095 -/* Admin footer */
1096 -.frm-white-body #footer-upgrade {
936 +.toplevel_page_formidable #footer-upgrade {
1097 937 display: none;
1098 938 }
1099 939
1100 -.frm-admin-footer-links,
1101 -.frm-admin-footer-links-nav,
1102 -.frm-admin-footer-links-socials {
1103 - display: flex;
1104 - justify-content: center;
1105 -}
1106 -
1107 -.frm-admin-footer-links {
1108 - gap: var(--gap-2xs);
1109 - flex-direction: column;
1110 - text-align: center;
1111 - padding: var(--gap-xl) 0 var(--gap-lg) 160px;
1112 - font-size: var(--text-xs);
1113 - color: var(--grey-400);
1114 -}
1115 -
1116 -body.rtl .frm-admin-footer-links {
1117 - padding-left: unset;
1118 - padding-right: 160px;
1119 -}
1120 -
1121 -
1122 -.frm-admin-footer-links-nav {
1123 - gap: var(--gap-2xs);
1124 - margin-bottom: var(--gap-xs);
1125 -}
1126 -
1127 -.frm-admin-footer-links-socials {
1128 - gap: var(--gap-xs);
1129 -}
1130 -
1131 -.frm-admin-footer-links-socials a {
1132 - color: var(--grey-400);
1133 -}
1134 -/* End Admin footer */
1135 -
1136 940 .frm_list_entry_page h2 {
1137 941 float: left;
1138 942 }
1139 943
@@ -1140,8 +944,13 @@
1140 944 .frm_list_entry_page h2 + .error {
1141 945 clear: both;
1142 946 }
1143 947
948 +#titlediv #title {
949 + line-height: 1.5;
950 + height: auto;
951 +}
952 +
1144 953 .frm_sidebar select {
1145 954 width: 100%;
1146 955 margin-left: 0;
1147 956 margin-right: 0;
@@ -1178,12 +987,14 @@
1178 987
1179 988 /* Buttons */
1180 989
1181 990 .frm_orange_button,
1182 -.frm_reverse_button {
991 +.frm_reverse_button,
992 +.post-type-frm_display .wrap .add-new-h2 {
1183 993 font-size: 12px;
1184 994 border: 1px solid var(--orange);
1185 995 color: var(--orange);
996 + line-height: 1.4;
1186 997 font-weight: 600;
1187 998 padding: 1px 4px;
1188 999 border-radius: 4px;
1189 1000 background: transparent;
@@ -1188,11 +999,33 @@
1188 999 border-radius: 4px;
1189 1000 background: transparent;
1190 1001 }
1191 1002
1003 +.post-type-frm_display .wrap .add-new-h2 {
1004 + margin: 1px 0 0 10px;
1005 + text-transform: lowercase;
1006 + position: initial;
1007 + vertical-align: middle;
1008 +}
1009 +
1010 +h1 .frm-button-secondary,
1011 +h1 .frm-button-primary,
1012 +h2 .frm-button-secondary,
1013 +h2 .frm-button-primary {
1014 + font-size: 14px !important;
1015 + font-weight: normal;
1016 + margin: 0 5px !important;
1017 + line-height: 23px !important;
1018 + vertical-align: text-bottom !important;
1019 + height: auto !important;
1020 +}
1021 +
1192 1022 .frm_reverse_button:hover,
1193 1023 .frm_reverse_button:active,
1194 -.frm_reverse_button:focus {
1024 +.frm_reverse_button:focus,
1025 +.post-type-frm_display .wrap .add-new-h2:hover,
1026 +.post-type-frm_display .wrap .add-new-h2:active,
1027 +.post-type-frm_display .wrap .add-new-h2:focus {
1195 1028 color: #fff;
1196 1029 background: var(--orange);
1197 1030 border: 1px solid var(--orange);
1198 1031 }
@@ -1203,108 +1036,42 @@
1203 1036 }
1204 1037
1205 1038 .frm-button-primary,
1206 1039 .wp-core-ui .button-primary.frm-button-primary,
1207 -.wp-core-ui .button.frm-button-primary,
1208 1040 .frm-button-secondary,
1209 1041 .wp-core-ui .button-secondary.frm-button-secondary,
1210 1042 .wp-core-ui .button.frm-button-secondary,
1211 -.frm-white-body .frm-search .button,
1212 -.frm-white-body .search-box .button, /* Views */
1213 -.frm-white-body .tablenav .button,
1214 1043 .frm_orange_button,
1215 1044 .toplevel_page_formidable #frm_upgrade_modal .button-primary,
1045 +#form_global_settings .button-secondary,
1216 1046 .wp-core-ui.frm-white-body .button-primary,
1217 1047 .wp-core-ui.frm-white-body .button-secondary,
1218 1048 .frm-white-body .button-primary,
1219 1049 .frm-white-body .button-secondary,
1220 -#frm-form-button button,
1221 -.frm-preview-buttons button,
1222 -.frm-button-red,
1223 -.frm-button-tertiary {
1050 +.wp-core-ui.frm-white-body .button:not(.button-small),
1051 +.frm-white-body button:not(.wp-switch-editor):not(.dropdown-toggle):not(.media-menu-item):not(.media-modal-close):not(.frm_no_style_button){
1224 1052 text-shadow: none;
1225 1053 box-shadow: none;
1226 1054 border-radius: 30px;
1227 - border: 1px solid var(--primary-500);
1228 - font-size: var(--text-sm);
1055 + border-color: var(--primary-color);
1056 + font-size: 1em;
1229 1057 transition: all .2s ease;
1230 - padding: 7px 16px;
1231 - height: auto;
1058 + padding: 0 15px;
1059 + height: 28px;
1232 1060 min-height: 28px;
1233 1061 outline: none;
1234 - line-height: var(--leading);
1235 - box-sizing: border-box;
1236 - font-weight: 500;
1237 - margin-bottom: 0;
1238 - display: inline-block;
1062 + line-height: 26px;
1239 1063 }
1240 1064
1241 -.frm-button-tertiary {
1242 - border-color: transparent;
1243 - color: var(--primary-500);
1244 -}
1245 -
1246 -.frm-button-red,
1247 -.frm-button-red:focus {
1248 - color: #fff !important;
1249 - --primary-500: var(--error-500);
1250 - --primary-700: var(--error-700);
1251 -}
1252 -
1253 -.frm-white-body h2 .button,
1254 -.post-type-frm_display h2 .frm-button-primary,
1255 -.frm-white-body .tablenav .button,
1256 -.frm-button-primary.frm-button-sm,
1257 -.frm-button-secondary.frm-button-sm,
1258 -.frm-button-tertiary.frm-button-sm,
1259 -.frm-button-red.frm-button-sm {
1260 - padding: 4px 12px !important;
1261 - font-size: var(--text-xs) !important;
1262 -}
1263 -
1264 -.frm_no_style_button {
1265 - background: transparent;
1266 -}
1267 -
1268 -.frm-with-icon {
1269 - display: flex;
1270 - gap: var(--gap-xs);
1271 - align-items: center;
1272 -}
1273 -
1274 -.frm-with-icon svg {
1275 - opacity: .65; /* Get close to grey-500 without overriding hover colors */
1276 -}
1277 -
1278 -.frm-with-icon.button svg {
1279 - height: var(--text-sm);
1280 - width: var(--text-sm);
1281 -}
1282 -
1283 -.frm-with-icon.frm-button-sm svg {
1284 - height: var(--text-xs);
1285 - width: var(--text-xs);
1286 -}
1287 -
1288 -.frm-white-body .button.add_media {
1289 - /* Media buttons above RTE */
1290 - padding-left: 12px !important;
1291 - padding-right: 12px !important;
1292 - font-size: var(--text-xs);
1293 - border-radius: var(--border-radius);
1294 -}
1295 -
1296 1065 .wp-core-ui.frm-white-body #post-query-submit.button,
1297 -.wp-core-ui.frm-white-body .button.tablenav-pages-navspan,
1298 1066 .wp-core-ui.frm-white-body .button.first-page,
1299 1067 .wp-core-ui.frm-white-body .button.prev-page,
1300 1068 .wp-core-ui.frm-white-body .button.next-page,
1301 1069 .wp-core-ui.frm-white-body .button.last-page,
1302 1070 .wp-core-ui.frm-white-body .button.action {
1303 - background-color: transparent;
1304 - border-color: var(--grey-300);
1305 - color: var(--grey-700);
1306 - border-radius: var(--border-radius);
1071 + background-color: var(--lightest-grey);
1072 + border-color: var(--grey-border);
1073 + color: var(--dark-grey);
1307 1074 }
1308 1075
1309 1076 .post-type-frm_display.wp-core-ui .button-primary,
1310 1077 .frm-button-primary,
@@ -1309,16 +1076,16 @@
1309 1076 .post-type-frm_display.wp-core-ui .button-primary,
1310 1077 .frm-button-primary,
1311 1078 .wp-core-ui .button-primary.frm-button-primary,
1312 1079 .frm_single_entry_page .button-primary {
1313 - background-color: var(--primary-500) !important;
1080 + background-color: var(--primary-color) !important;
1314 1081 color: #fff !important;
1315 1082 }
1316 1083
1317 1084 .frm-button-primary.frm_large{
1318 - font-size: var(--text-md) !important;
1085 + font-size: 22px !important;
1319 1086 height: auto !important;
1320 - padding: 9px 18px !important;
1087 + padding: 16px 32px !important;
1321 1088 }
1322 1089
1323 1090 .frm-button-primary i:before {
1324 1091 color: #fff;
@@ -1325,10 +1092,10 @@
1325 1092 }
1326 1093
1327 1094 .wp-core-ui .button-primary.frm-button-primary:hover,
1328 1095 .frm-button-primary:hover {
1329 - background: var(--primary-700) !important;
1330 - border-color: var(--primary-700) !important;
1096 + background: var(--primary-hover) !important;
1097 + border-color: var(--primary-hover) !important;
1331 1098 }
1332 1099
1333 1100 .wp-core-ui .button-primary.frm-button-primary:active {
1334 1101 vertical-align: inherit;
@@ -1333,25 +1100,20 @@
1333 1100 .wp-core-ui .button-primary.frm-button-primary:active {
1334 1101 vertical-align: inherit;
1335 1102 }
1336 1103
1337 -.frm-white-body #search-submit,
1338 1104 #frm-form-button .frm_button_submit,
1339 -.frm-white-body .frm-preview-buttons button,
1340 -.frm-white-body .button:not(.frm-button-primary),
1341 1105 .wp-core-ui.frm-white-body .button-secondary,
1342 1106 .wp-core-ui .button-secondary.frm-button-secondary,
1343 1107 .wp-core-ui .button.frm-button-secondary,
1344 -.frm-white-body .frm-button-secondary,
1345 1108 .frm-button-secondary {
1346 - color: var(--grey-800);
1347 - border-color: var(--grey-300);
1348 - background-color: #fff;
1109 + color: var(--primary-color);
1110 + background-color: transparent;
1349 1111 }
1350 1112
1351 1113 #wp-content-media-buttons button,
1352 1114 #wp-content-media-buttons a.button {
1353 - border-color: var(--grey-300);
1115 + border-color: var(--grey-border);
1354 1116 }
1355 1117
1356 1118 .frm_orange_button {
1357 1119 border-color: #da791d !important;
@@ -1358,23 +1120,26 @@
1358 1120 background: var(--orange);
1359 1121 color: #fff;
1360 1122 }
1361 1123
1362 -.frm-white-body .button:not(.frm-button-primary):focus,
1363 -.frm-white-body .button:not(.frm-button-primary):active,
1364 -.frm-white-body .frm-button-secondary:hover,
1365 1124 .wp-core-ui.frm-white-body .frm-button-secondary:hover,
1366 1125 .wp-core-ui.frm-white-body .button-secondary:hover,
1367 1126 .wp-core-ui.frm-white-body .button-secondary:focus,
1368 -.wp-core-ui.frm-white-body .tablenav .button:hover,
1369 1127 .frm_wrap .preview > .button:hover {
1370 - border-color: var(--grey-300) !important;
1371 - color: var(--grey-800);
1372 - background: var(--grey-50) !important;
1373 - box-shadow: none !important;
1374 - outline: none !important;
1128 + border-color: var(--primary-hover) !important;
1129 + background: var(--primary-hover) !important;
1130 + color: #fff;
1131 + box-shadow: none;
1375 1132 }
1376 1133
1134 +.frm-with-plus {
1135 + padding-left: 10px !important;
1136 +}
1137 +
1138 +.frm-with-plus .frmsvg {
1139 + margin-right: 5px;
1140 +}
1141 +
1377 1142 .frm-button-primary .frmsvg {
1378 1143 color: #fff;
1379 1144 }
1380 1145
@@ -1381,20 +1146,23 @@
1381 1146 .frm_wrap .preview i {
1382 1147 font-size: inherit;
1383 1148 }
1384 1149
1385 -.frm-white-body .frm-button-primary:focus,
1386 -.frm-white-body .frm-button-primary:active,
1150 +.wp-core-ui.frm-white-body .frm-button-secondary:hover .frmsvg,
1151 +.frm_wrap .preview > .button:hover .frmsvg,
1152 +.wp-core-ui.frm-white-body .frm-button-secondary:hover i,
1153 +.frm_wrap .preview > .button:hover i {
1154 + color: #fff;
1155 +}
1156 +
1387 1157 #frm-addons-page .button-primary:focus,
1388 1158 #form_global_settings .button-primary:focus,
1389 -#frm_upgrade_modal .button:focus {
1390 - border-color: var(--primary-700) !important;
1391 - background-color: var(--primary-700) !important;
1392 - box-shadow: none !important;
1393 - outline: none !important;
1159 +#frm_upgrade_modal .button:focus,
1160 +.frm_wrap .preview > .button:focus {
1161 + border-color: var(--primary-hover) !important;
1162 + outline: none;
1394 1163 }
1395 1164
1396 -.frm_wrap .preview > .button:focus,
1397 1165 .frm_orange_button:hover,
1398 1166 .frm_orange_button:focus,
1399 1167 .toplevel_page_formidable #frm_upgrade_modal .button-primary:hover,
1400 1168 .toplevel_page_formidable #frm_upgrade_modal .button-primary:focus,
@@ -1442,9 +1210,9 @@
1442 1210 }
1443 1211
1444 1212 .frm-review-notice.notice form,
1445 1213 .frm-review-notice.notice p {
1446 - font-size: var(--text-sm);
1214 + font-size: 14px;
1447 1215 max-width: 600px;
1448 1216 margin-left: auto;
1449 1217 margin-right: auto;
1450 1218 }
@@ -1449,14 +1217,17 @@
1449 1217 margin-right: auto;
1450 1218 }
1451 1219
1452 1220 .frm-review-notice a {
1453 - margin: 0 var(--gap-xs) !important;
1221 + margin: 5px;
1454 1222 }
1455 1223
1456 1224 .frm-review-notice .frm-button-primary,
1457 1225 .frm-review-notice .frm-button-secondary {
1458 1226 min-width: 100px;
1227 + display: inline-block;
1228 + text-align: center;
1229 + padding: 2px 10px;
1459 1230 }
1460 1231
1461 1232 .frm-review-notice p > span {
1462 1233 font-size: 13px;
@@ -1463,9 +1234,9 @@
1463 1234 opacity: 0.75;
1464 1235 }
1465 1236
1466 1237 #frmapi-feedback {
1467 - margin-top: var(--gap-lg);
1238 + margin-top: 30px;
1468 1239 }
1469 1240
1470 1241 .frm-review-notice .frm_error,
1471 1242 .frm-review-notice label {
@@ -1473,112 +1244,12 @@
1473 1244 text-align: left;
1474 1245 }
1475 1246
1476 1247 .frm-review-notice label {
1477 - font-size: var(--text-sm);
1248 + font-size: 14px;
1478 1249 }
1479 1250
1480 -.frm-floating-success-message {
1481 - border-radius: 4px;
1482 - right: 10px !important;
1483 - bottom: 10px !important;
1484 -}
1485 -
1486 1251 /* Generic Classes */
1487 -.frm_no_margin, /* deprecated */
1488 -.frm-m-0 {
1489 - margin: 0 !important;
1490 -}
1491 -
1492 -.frm-m-12 {
1493 - margin: var(--gap-2xl);
1494 -
1495 -}
1496 -
1497 -.frm_no_top_margin, /* deprecated */
1498 -.frm-mt-0 {
1499 - margin-top: 0 !important;
1500 -}
1501 -
1502 -.frm_no_bottom_margin, /* deprecated */
1503 -.frm-mb-0 {
1504 - margin-bottom: 0 !important;
1505 -}
1506 -
1507 -.frm-mb-sm {
1508 - margin-bottom: var(--gap-sm) !important;
1509 -}
1510 -
1511 -.frm-mb-md {
1512 - margin-bottom: var(--gap-md) !important;
1513 -}
1514 -
1515 -.frm-mb-lg {
1516 - margin-bottom: var(--gap-lg) !important;
1517 -}
1518 -
1519 -.frm-mx-sm {
1520 - margin-left: var(--gap-sm) !important;
1521 - margin-right: var(--gap-sm) !important;
1522 -}
1523 -
1524 -.frm-p-1 {
1525 - padding: 4px;
1526 -}
1527 -
1528 -.frm-p-4 {
1529 - padding: var(--gap-sm);
1530 -}
1531 -
1532 -.frm-p-6 {
1533 - padding: var(--gap-md);
1534 -}
1535 -
1536 -.frm-text-md {
1537 - font-size: var(--text-md);
1538 -}
1539 -
1540 -.frm-text-lg {
1541 - font-size: var(--text-lg);
1542 -}
1543 -
1544 -.frm-text-xl {
1545 - font-size: var(--text-xl);
1546 -}
1547 -
1548 -.frm-w-auto {
1549 - width: auto !important;
1550 -}
1551 -
1552 -.frm-w-full {
1553 - width: 100% !important;
1554 -}
1555 -
1556 -.frm-flex-box {
1557 - display: flex;
1558 - gap: var(--gap-sm);
1559 -}
1560 -
1561 -.frm-gap-xs {
1562 - gap: var(--gap-xs);
1563 -}
1564 -
1565 -.frm-gap-sm {
1566 - gap: var(--gap-sm);
1567 -}
1568 -
1569 -.frm-gap-md {
1570 - gap: var(--gap-md);
1571 -}
1572 -
1573 -.frm-justify-between {
1574 - justify-content: space-between;
1575 -}
1576 -
1577 -.frm-transition-ease {
1578 - transition: all .2s ease;
1579 -}
1580 -
1581 1252 .frm_invisible {
1582 1253 visibility: hidden;
1583 1254 transition: all .2s ease;
1584 1255 }
@@ -1586,10 +1257,10 @@
1586 1257 .frm_no_float {
1587 1258 float: none;
1588 1259 }
1589 1260
1590 -.frm_block, /* deprecated */
1591 -.frm-block {
1261 +.frm_block,
1262 +.frm_no_section_fields.frm_block {
1592 1263 display: block;
1593 1264 }
1594 1265
1595 1266 .frm_inline {
@@ -1599,81 +1270,81 @@
1599 1270 .frm_inline_block {
1600 1271 display: inline-block !important;
1601 1272 }
1602 1273
1274 +.frm-lookup-modal .dismiss,
1275 +.frm-right-panel .inside a.frm_hidden,
1276 +ul.frm_form_nav > li.frm_hidden,
1277 +a.frm_hidden,
1278 +.button.frm_hidden,
1279 +.wp-core-ui .button.frm_hidden,
1603 1280 .frm_hidden {
1604 1281 display: none;
1605 1282 }
1606 1283
1607 -.frm-text-right {
1608 - text-align: right;
1284 +.frm_no_margin {
1285 + margin: 0;
1609 1286 }
1610 1287
1611 -.frm-border-b {
1612 - border-bottom: 1px solid var(--grey-300);
1288 +.frm_no_top_margin {
1289 + margin-top: 0 !important;
1613 1290 }
1614 1291
1615 -.frm-no-border {
1616 - border: none !important;
1292 +.postbox .inside > p.frm_no_bottom_margin:last-child,
1293 +.frm_no_bottom_margin {
1294 + margin-bottom: 0 !important;
1617 1295 }
1618 1296
1619 -.frm-opacity-100 {
1620 - opacity: 1;
1297 +.frm_tiny_top_margin {
1298 + margin-top: 1px;
1621 1299 }
1622 1300
1623 -.frm-on-bottom {
1624 - z-index: -1;
1301 +.frm_small_top_margin {
1302 + margin-top: 5px;
1625 1303 }
1626 -/* End Generic Classes, Start Forced Generic Classes */
1627 1304
1628 -.frm-fields p > label.frm_hidden,
1629 -.frm-lookup-modal .dismiss,
1630 -.frm-right-panel .inside a.frm_hidden,
1631 -#form_global_settings .frm_hidden,
1632 -ul.frm_form_nav > li.frm_hidden,
1633 -a.frm_hidden,
1634 -.button.frm_hidden,
1635 -.wp-core-ui .button.frm_hidden {
1636 - display: none;
1305 +.frm_cursor_pointer {
1306 + cursor: pointer;
1637 1307 }
1638 1308
1639 -.postbox .inside > p.frm_no_bottom_margin:last-child {
1640 - margin-bottom: 0 !important;
1309 +.frm_right_text {
1310 + text-align: right;
1641 1311 }
1642 1312
1643 -.frm_no_section_fields.frm_block {
1644 - display: block;
1313 +.frm_submit .frm_full_opacity, .frm_full_opacity {
1314 + opacity: 1;
1645 1315 }
1646 1316
1317 +.frm_med_padding {
1318 + padding: 10px;
1319 +}
1320 +
1647 1321 .actions.frm_visible_overflow {
1648 1322 overflow: visible !important;
1649 1323 }
1650 1324
1651 -.frm_full_opacity, /* deprecated */
1652 -.frm_submit .frm_full_opacity,
1653 -.frm_submit .frm-opacity-100 {
1654 - opacity: 1;
1655 -}
1656 -
1657 1325 .frm-dropdown-menu.frm-on-top {
1658 1326 z-index: 99999;
1659 1327 }
1660 1328
1661 -/* End Forced Generic Classes */
1329 +.frm-on-bottom {
1330 + z-index: -1;
1331 +}
1662 1332
1663 1333 .frm_forms.with_frm_style {
1664 1334 max-width: 100%;
1665 1335 }
1666 1336
1337 +.post-type-frm_display .wrap > #posts-filter,
1667 1338 .post-type-frm_display .wrap > .subsubsub,
1668 1339 .post-type-frm_display .wrap > .icl_subsubsub,
1669 1340 .frm_form_settings > p {
1670 - margin: 6px var(--gap-md);
1341 + margin: 6px 40px;
1671 1342 padding: 0;
1672 1343 }
1673 1344
1674 1345 .frm-entry-container {
1675 - margin: 0 40px 40px;
1346 + margin: 20px 40px 40px;
1676 1347 padding: 0;
1677 1348 }
1678 1349
1679 1350 #form_reports_page .frm-inner-content {
@@ -1687,24 +1358,24 @@
1687 1358 clear: both;
1688 1359 }
1689 1360
1690 1361 .post-type-frm_display h2,
1691 -.frm_wrap h2 {
1692 - margin-top: 0 !important;
1693 - font-size: var(--text-lg);
1694 - line-height: var(--leading);
1362 +.frm_page_container h2 {
1363 + margin: 10px 0 !important;
1364 + color: var(--medium-grey);
1365 + font-weight: 500;
1366 + font-size: 19px;
1695 1367 }
1696 1368
1697 1369 .post-type-frm_display .wrap > h2:first-child,
1698 -.frm_wrap .wrap > h2:first-child {
1699 - padding-top: 0;
1370 +.frm_page_container .wrap > h2:first-child {
1700 1371 margin-top: 0 !important;
1701 - font-size: var(--text-lg);
1372 + font-size: 22px;
1702 1373 }
1703 1374
1704 1375 #frm_form_editor_container {
1705 1376 position: relative;
1706 - margin-top: 28px;
1377 + margin: 25px 50px 50px;
1707 1378 }
1708 1379
1709 1380 .form-field p {
1710 1381 /* for conflicts */
@@ -1717,30 +1388,21 @@
1717 1388 float: none;
1718 1389 width: auto;
1719 1390 }
1720 1391
1721 -#frm_view_editor_left label, /* Views */
1722 -#frm_view_editor_left .frm_primary_label, /* Views */
1723 -.frm-dialog .frm-sub-label,
1724 -.frm-dialog label,
1725 -.dropdown .frm_primary_label,
1726 1392 .accordion-container label,
1727 1393 .frm-fields td > label,
1728 1394 .frm-fields td > div > label,
1729 -.frm_form_field > label:first-child,
1730 1395 .frm-fields p > label,
1731 -.frm_on_submit_type > label,
1732 1396 .post-type-frm_display .frm_form_field > label,
1733 1397 #new_fields .frm_primary_label,
1734 -#form_global_settings .frm_primary_label,
1735 1398 #frm_form_editor_container .frm_primary_label {
1736 - color: var(--grey-700);
1399 + color: var(--dark-grey);
1737 1400 margin: 0 0 3px;
1738 1401 padding: 0;
1739 1402 width: auto;
1740 - font-size: var(--text-sm);
1403 + font-size: 14px;
1741 1404 display: block;
1742 - line-height: var(--leading);
1743 1405 }
1744 1406
1745 1407 .frm-fields td input + label {
1746 1408 display: inline;
@@ -1758,12 +1420,8 @@
1758 1420 .with_frm_style form .form-field {
1759 1421 margin-bottom: 20px;
1760 1422 }
1761 1423
1762 -#frm_builder_page .with_frm_style form .frm_combo_inputs_container > .form-field {
1763 - margin-bottom: 0;
1764 -}
1765 -
1766 1424 .frm_description,
1767 1425 .with_frm_style form div.description,
1768 1426 .frm_error,
1769 1427 .with_frm_style form div.description textarea {
@@ -1775,18 +1433,11 @@
1775 1433 color: inherit;
1776 1434 }
1777 1435
1778 1436 #frm_form_editor_container .divider_section_only .frm_primary_label {
1779 - display: flex;
1780 - align-items: center;
1781 - gap: var(--gap-xs);
1782 1437 font-size: 20px;
1783 1438 }
1784 1439
1785 -#frm_form_editor_container .divider_section_only .frm_primary_label .frm-sub-label {
1786 - padding: 0;
1787 -}
1788 -
1789 1440 form .form-field.frm_field_loading {
1790 1441 margin-bottom: 0;
1791 1442 min-height: 0;
1792 1443 padding: 0;
@@ -1874,8 +1525,14 @@
1874 1525 max-width: 700px;
1875 1526 margin: 20px auto !important;
1876 1527 }
1877 1528
1529 +.upgrade_to_pro h1,
1530 +.upgrade_to_pro h3,
1531 +.upgrade_to_pro {
1532 + color: #444;
1533 +}
1534 +
1878 1535 .upgrade_to_pro .error {
1879 1536 display: none;
1880 1537 }
1881 1538
@@ -1885,19 +1542,19 @@
1885 1542 }
1886 1543
1887 1544 .frm_error_style,
1888 1545 .frm_warning_style,
1889 -.frm_note_style,
1890 1546 .frm_message,
1891 1547 #post-body-content .frm_updated_message,
1892 1548 div.frm_updated_message {
1893 - border-radius: var(--small-radius);
1894 - background-color: #D5F2DC;
1895 - color: #1E561F;
1896 - padding: var(--gap-sm) var(--gap-md);
1897 - font-size: var(--text-sm);
1898 - margin: var(--gap-sm) 0;
1899 - text-align: left;
1549 + border-radius: var(--border-radius);
1550 + border: 1px solid #D6E9C6;
1551 + background-color: #DFF0D8;
1552 + color: #468847;
1553 + padding: 5px 25px;
1554 + font-size: 14px;
1555 + margin: 5px 0 15px;
1556 + text-align: center;
1900 1557 }
1901 1558
1902 1559 #frm_top_bar + .wrap > .frm_updated_message, #frm_top_bar + .wrap > .frm_warning_style {
1903 1560 display: inline-block;
@@ -1908,20 +1565,21 @@
1908 1565 #post-body-content > .frm_updated_message {
1909 1566 margin: 5px 65px;
1910 1567 }
1911 1568
1912 -#form_global_settings #post-body-content > .frm_updated_message,
1913 -#form_global_settings #post-body-content > .frm_warning_style {
1569 +#form_global_settings .frm_updated_message {
1914 1570 margin: 5px 25px;
1915 1571 }
1916 1572
1917 1573 .frm_error_style {
1918 1574 color: #973937;
1919 - background-color: #EBCCCC;
1575 + border-color: #F2DEDE;
1576 + background-color: #F2DEDE;
1920 1577 clear: both;
1921 1578 }
1922 1579
1923 1580 .frm_error_style a {
1581 + color: #973937;
1924 1582 text-decoration: underline;
1925 1583 font-weight: 600;
1926 1584 }
1927 1585
@@ -1929,10 +1587,14 @@
1929 1587 opacity: .7;
1930 1588 }
1931 1589
1932 1590 .frm_warning_style {
1933 - color: #7A4D05;
1934 - background-color: #FFF2D2;
1591 + color: #8B6E3C;
1592 + border-color: #FBECCD;
1593 + background-color: #FDF9E3;
1594 + border-radius: 10px;
1595 + text-align: left;
1596 + padding-top: 5px;
1935 1597 }
1936 1598
1937 1599 .frm_warning_heading{
1938 1600 font-weight: bold;
@@ -1938,61 +1600,8 @@
1938 1600 font-weight: bold;
1939 1601 margin-bottom:4px;
1940 1602 }
1941 1603
1942 -/* Warning message dismiss */
1943 -.frm_warning_style {
1944 - position: relative;
1945 - padding-right: calc(var(--gap-md) + 15px);
1946 -}
1947 -
1948 -body.rtl .frm_warning_style {
1949 - padding-right: var(--gap-md);
1950 - padding-left: calc(var(--gap-md) + 15px);
1951 -}
1952 -
1953 -.frm-warning-dismiss {
1954 - position: absolute;
1955 - top: 10px;
1956 - right: 10px;
1957 - display: flex;
1958 - cursor: pointer;
1959 - transition: opacity 0.2s ease-out;
1960 -}
1961 -
1962 -body.rtl .frm-warning-dismiss {
1963 - left: 10px;
1964 - right: auto;
1965 -}
1966 -
1967 -.frm-warning-dismiss:hover {
1968 - opacity: 0.8;
1969 -}
1970 -
1971 -.frm-warning-dismiss.frmsvg,
1972 -.frm-warning-dismiss.frmsvg svg {
1973 - width: 15px;
1974 - height: 15px;
1975 -}
1976 -
1977 -.frm_note_style {
1978 - background: rgba(188, 224, 253, 0.23);
1979 - color: var(--grey-700);
1980 -}
1981 -
1982 -.frm-banner-alert {
1983 - text-align: left;
1984 - margin: 0;
1985 - border-radius: 0;
1986 - padding: 10px 0 10px 40px;
1987 -}
1988 -
1989 -.frm-banner-alert a {
1990 - color: var(--primary-500);
1991 - font-weight: 400;
1992 - text-decoration: none;
1993 -}
1994 -
1995 1604 .frm_updated_message ul,
1996 1605 .frm_updated_message li,
1997 1606 .frm_warning_style ul,
1998 1607 .frm_warning_style li,
@@ -2001,24 +1610,57 @@
2001 1610 margin: 0;
2002 1611 }
2003 1612
2004 1613 .frm-inline-message {
2005 - border: 1px solid var(--primary-700);
1614 + border: 1px solid var(--primary-hover);
2006 1615 border-radius: var(--small-radius);
2007 - color: var(--primary-700);
1616 + color: var(--primary-hover);
2008 1617 background: #fff;
2009 1618 text-align: center;
2010 1619 padding: 20px;
2011 - font-size: var(--text-sm);
2012 - line-height: var(--leading);
1620 + font-size: 14px;
1621 + line-height: 1.4em;
2013 1622 }
2014 1623
2015 1624 .frm-inline-message a {
2016 - text-decoration: underline;
2017 1625 font-weight: 600;
2018 - color: var(--primary-700);
1626 + color: var(--primary-hover);
2019 1627 }
2020 1628
1629 +.frm_ribbon {
1630 + -webkit-transform: rotate(45deg);
1631 + -moz-transform: rotate(45deg);
1632 + -ms-transform: rotate(45deg);
1633 + -o-transform: rotate(45deg);
1634 + transform: rotate(45deg);
1635 + border: 25px solid transparent;
1636 + border-bottom: 25px solid var(--orange);
1637 + position: absolute;
1638 + top: -31px;
1639 + right: -74px;
1640 + padding: 0px 10px;
1641 + width: 30px;
1642 + color: white;
1643 + font-family: sans-serif;
1644 + size: 11px;
1645 +}
1646 +
1647 +.plugin-card-top .frm_ribbon {
1648 + right: -33px;
1649 + top: -28px;
1650 +}
1651 +
1652 +.frm_ribbon span {
1653 + position: absolute;
1654 + left: 25px;
1655 + font-size: 15px;
1656 + top: 4px;
1657 +}
1658 +
1659 +.accordion-section-content .frm-selectable:hover .frm_ribbon {
1660 + display: none;
1661 +}
1662 +
2021 1663 .frm_pro_heading span {
2022 1664 margin-top: 10px;
2023 1665 }
2024 1666
@@ -2027,14 +1669,15 @@
2027 1669 }
2028 1670
2029 1671 .frm-yes {
2030 1672 color: var(--green);
2031 - font-size: var(--text-xl);
1673 + font-size: 21px;
1674 + font-weight: 500;
2032 1675 }
2033 1676
2034 1677 .frm-nope {
2035 - color: var(--grey-400);
2036 - font-size: var(--text-xl);
1678 + color: #d2e0f2;
1679 + font-size: 21px;
2037 1680 }
2038 1681
2039 1682 .upgrade_to_pro a {
2040 1683 color: var(--orange);
@@ -2040,10 +1683,10 @@
2040 1683 color: var(--orange);
2041 1684 }
2042 1685
2043 1686 .upgrade_to_pro table .frmsvg {
2044 - height: var(--text-xl);
2045 - width: var(--text-xl);
1687 + height: 20px;
1688 + width: 20px;
2046 1689 }
2047 1690
2048 1691 .upgrade_to_pro table.widefat {
2049 1692 background-color: #fff;
@@ -2049,14 +1692,12 @@
2049 1692 background-color: #fff;
2050 1693 border-collapse: collapse;
2051 1694 }
2052 1695
2053 -.frm-white-body .upgrade_to_pro table th,
1696 +.upgrade_to_pro table th,
2054 1697 .upgrade_to_pro table td {
2055 1698 padding: 10px 15px;
2056 - border: 1px solid var(--grey-300);
2057 - line-height: var(--leading);
2058 - font-size: var(--text-sm);
1699 + border: 1px solid #d2e0f2;
2059 1700 }
2060 1701
2061 1702 .upgrade_to_pro table th.frmcenter {
2062 1703 text-align: center;
@@ -2062,9 +1703,9 @@
2062 1703 text-align: center;
2063 1704 }
2064 1705
2065 1706 .widefat th.frm_table_break {
2066 - background-color: var(--sidebar-color);
1707 + background-color: #f6f7fb;
2067 1708 }
2068 1709
2069 1710 h2.frm-h2 + .howto {
2070 1711 color: var(--medium-grey);
@@ -2080,18 +1721,18 @@
2080 1721 margin-top: 0;
2081 1722 }
2082 1723
2083 1724 .frm-addons {
2084 - margin-top: var(--gap-lg);
1725 + margin-top: 30px;
2085 1726 display: grid;
2086 1727 grid-template-columns: 1fr 1fr 1fr;
2087 - grid-gap: var(--gap-md);
1728 + grid-gap: 30px 2%;
2088 1729 }
2089 1730
2090 1731 .frm-addons,
2091 1732 .frm-addons h2,
2092 1733 .frm-addons h3 {
2093 - color: var(--grey-700);
1734 + color: var(--dark-grey);
2094 1735 }
2095 1736
2096 1737 .frm-addons h2 {
2097 1738 font-size: 17px;
@@ -2103,9 +1744,9 @@
2103 1744
2104 1745 .frm-card {
2105 1746 width: 100%;
2106 1747 border-radius: 10px;
2107 - border: 1px solid var(--grey-300);
1748 + border: 1px solid var(--grey-border);
2108 1749 opacity: 1;
2109 1750 transition: opacity 1s;
2110 1751 }
2111 1752
@@ -2119,10 +1760,10 @@
2119 1760 position: relative;
2120 1761 }
2121 1762
2122 1763 .frm-addons .plugin-card-top {
2123 - min-height: 155px;
2124 - padding-top: var(--gap-lg);
1764 + height: 140px;
1765 + padding-top: 30px;
2125 1766 overflow: hidden;
2126 1767 }
2127 1768
2128 1769 .frm-addons .plugin-card-top h2 {
@@ -2159,16 +1800,15 @@
2159 1800 .frm-addon-active .button {
2160 1801 visibility: hidden;
2161 1802 }
2162 1803
2163 -.frm-save-and-reload-options {
1804 +#frm_save_and_reload_options {
2164 1805 margin-top: 10px;
2165 1806 font-size: 13px;
2166 1807 }
2167 1808
2168 -.frm-save-and-reload,
2169 -.frm-save-and-reload + .frm-button-secondary {
2170 - visibility: visible !important;
1809 +#frm_save_and_reload_settings, #frm_save_and_reload_settings + .frm-button-secondary {
1810 + visibility: visible;
2171 1811 }
2172 1812
2173 1813 .addon-status-label {
2174 1814 opacity: .7;
@@ -2197,13 +1837,9 @@
2197 1837 .frm-new-template.plugin-card-bottom {
2198 1838 overflow: visible;
2199 1839 }
2200 1840
2201 -#frm-new-template p:first-child {
2202 - margin-top: 0;
2203 -}
2204 -
2205 -.frm-admin-page-formidableedit #wpbody-content > *:not(.frm-review-notice):not(.frm_previous_install):not(.frm-banner-alert),
1841 +.frm-admin-page-formidableedit #wpbody-content > *:not(.frm-review-notice):not(.frm_previous_install),
2206 1842 #wpbody-content > .updated,
2207 1843 #wpbody-content > #update-nag,
2208 1844 #wpbody-content > .update-nag,
2209 1845 #wpbody-content > .notice:not(.frm-review-notice),
@@ -2225,86 +1861,35 @@
2225 1861 margin: 0;
2226 1862 padding: 10px 20px;
2227 1863 }
2228 1864
2229 -.frm-modal .postbox,
2230 1865 #frm_new_form_modal .postbox {
2231 1866 max-height: 600px;
2232 1867 overflow: hidden;
2233 - margin-bottom: 0;
2234 1868 }
2235 1869
2236 -.frm-modal .postbox .frm_modal_top,
2237 -.frm-dialog .frm_common_modal .postbox > div:first-child {
2238 - padding: var(--gap-md) var(--gap-md) 0;
1870 +#frm_new_form_modal .postbox > div:first-child {
1871 + padding: 30px 20px;
2239 1872 position: relative;
1873 + border-bottom: 1px solid var(--grey-border);
2240 1874 }
2241 1875
2242 -.frm-modal .postbox .frm-modal-title,
2243 -.frm-dialog .frm_common_modal .postbox > div:first-child > div:first-child {
1876 +#frm_new_form_modal .postbox > div:first-child > div:first-child {
2244 1877 display: inline-block;
2245 - font-size: var(--text-xl);
2246 - color: var(--grey-900);
1878 + font-size: 24px;
1879 + color: #282F36;
2247 1880 }
2248 1881
2249 -.frm-inline-modal > a.dismiss,
2250 -.frm-modal .postbox > a.dismiss,
2251 -.frm-modal .postbox .frm-modal-title + div:last-child,
2252 -.frm-dialog .frm_common_modal .postbox > div:first-child > div:last-child {
1882 +#frm_new_form_modal .postbox > div:first-child > div:last-child {
2253 1883 position: absolute;
2254 - right: 30px;
2255 - top: 25px;
2256 - z-index: 2;
1884 + right: 20px;
1885 + top: 37px;
2257 1886 }
2258 1887
2259 -body.rtl .frm-inline-modal > a.dismiss,
2260 -body.rtl .frm-modal .postbox > a.dismiss,
2261 -body.rtl .frm-modal .postbox .frm-modal-title + div:last-child,
2262 -body.rtl .frm-dialog .frm_common_modal .postbox > div:first-child > div:last-child {
2263 - right: unset;
2264 - left: 30px;
1888 +#frm_new_form_modal .postbox > div:first-child > div:last-child a {
1889 + color: var(--grey);
2265 1890 }
2266 1891
2267 -.frm-info-modal .postbox > a.dismiss,
2268 -.frm-inline-modal > a.dismiss {
2269 - right: 13px;
2270 - top: 13px;
2271 -}
2272 -
2273 -.frm-modal .postbox .frm-modal-title + div:last-child a,
2274 -.frm-modal a.dismiss .frmsvg,
2275 -.frm_common_modal .frm_modal_top a .frmsvg {
2276 - color: var(--grey-900);
2277 -}
2278 -
2279 -.frm-modal .frm_modal_content > div.inside,
2280 -.frm_common_modal .frm_modal_content > div.inside {
2281 - padding: var(--gap-md);
2282 - margin: 0;
2283 - font-size: var(--text-sm);
2284 - color: var(--grey-700);
2285 -}
2286 -
2287 -.frm_common_modal .postbox {
2288 - display: flex;
2289 - flex-direction: column;
2290 -}
2291 -
2292 -.frm-modal .postbox > div.inside .cta-inside {
2293 - overflow-y: auto;
2294 - height: auto;
2295 - padding: 0 var(--gap-sm);
2296 -}
2297 -
2298 -.frm_modal_footer {
2299 - padding: 0 var(--gap-md) var(--gap-sm);
2300 - text-align: right;
2301 -}
2302 -
2303 -body.frm-body-with-open-modal {
2304 - overflow-y: hidden;
2305 -}
2306 -
2307 1892 #frm_new_form_modal .postbox > div.inside {
2308 1893 max-height: 490px;
2309 1894 overflow-y: auto;
2310 1895 overflow-x: hidden;
@@ -2314,9 +1899,9 @@
2314 1899
2315 1900 #frm_new_form_modal .postbox > div.inside .cta-inside {
2316 1901 overflow-y: auto;
2317 1902 height: auto;
2318 - padding: 0 var(--gap-md);
1903 + padding: 0 15px;
2319 1904 }
2320 1905
2321 1906 #frm_new_form_modal .accordion-container {
2322 1907 width: 100%;
@@ -2322,16 +1907,13 @@
2322 1907 width: 100%;
2323 1908 }
2324 1909
2325 1910 .frm-templates-list {
2326 - margin-top: 0;
1911 + margin-top: 0px;
2327 1912 }
2328 1913
2329 -.frm-templates-list.frm_grid_container li {
2330 - margin-bottom: 0;
2331 -}
2332 -
2333 1914 .frm-templates-list li {
1915 + width: 50%;
2334 1916 vertical-align: top;
2335 1917 position: relative;
2336 1918 box-sizing: border-box;
2337 1919 border-radius: 6px;
@@ -2360,17 +1942,14 @@
2360 1942 .frm-templates-list li.frm-selectable:hover p {
2361 1943 max-width: calc( 100% - 65px );
2362 1944 }
2363 1945
2364 -.frm-templates-list .frm-featured-form {
2365 - display: flex;
1946 +.frm-templates-list li > div:not(.frm-hover-icons) {
1947 + display: inline-block;
2366 1948 width: 100%;
1949 + padding: 5px;
2367 1950 }
2368 1951
2369 -.frm-templates-list li .frm-featured-form {
2370 - padding: 7px 5px;
2371 -}
2372 -
2373 1952 .frm-templates-list li li > div {
2374 1953 padding-left: 0;
2375 1954 }
2376 1955
@@ -2377,38 +1956,23 @@
2377 1956 .frm-templates-list li > div > div {
2378 1957 vertical-align: middle;
2379 1958 }
2380 1959
2381 -.frm-templates-list .frm-inner-circle,
2382 -.frm-category-icon, /* Deprecated */
2383 -.frm-icon-wrapper {
2384 - background: var(--primary-500);
2385 - border-radius: var(--small-radius);
2386 - color: #fff;
1960 +.frm-templates-list li .frm-category-icon {
2387 1961 width: 40px;
2388 1962 height: 40px;
2389 - font-size: 18px;
2390 - box-sizing: border-box;
2391 - align-self: center;
2392 - justify-content: center;
2393 - align-items: center;
2394 - display: inline-flex;
2395 -}
2396 -
2397 -.frm-templates-list .frm-inner-circle .frmsvg {
1963 + overflow: hidden;
1964 + display: inline-block;
1965 + border-radius: 4px;
1966 + text-align: center;
2398 1967 vertical-align: top;
2399 1968 }
2400 1969
2401 -.frm-templates-list li .frm-category-icon {
2402 - overflow: hidden;
2403 - align-self: flex-start;
2404 -}
2405 -
2406 -.frm-templates-list .frm-template-details {
1970 +.frm-templates-list li > div > div:last-child {
2407 1971 /* the content container to the right of the icon in Create new form modal */
2408 1972 display: inline-block;
2409 1973 width: calc( 100% - 40px );
2410 - padding-left: var(--gap-sm);
1974 + padding-left: 13px;
2411 1975 box-sizing: border-box;
2412 1976 transform: translateY(-2px);
2413 1977 }
2414 1978
@@ -2422,18 +1986,54 @@
2422 1986 }
2423 1987
2424 1988 .frm-templates-list li h3,
2425 1989 .frm-templates-list .frm-install-template h3 {
2426 - font-size: var(--text-sm) !important;
1990 + font-size: 14px !important;
1991 + line-height: 24px;
1992 + height: 24px;
2427 1993 }
2428 1994
1995 +.frm-templates-list li p {
1996 + font-size: 13px;
1997 + color: rgba(40, 47, 54, 0.6);
1998 +}
1999 +
2429 2000 .frm-templates-list .frm-install-template div {
2430 2001 text-align: left;
2431 2002 }
2432 2003
2004 +.frm-templates-list .frm-add-blank-form .frm-category-icon .frmsvg,
2005 +.frm-templates-list li:last-child div:not(.frm-hover-icons) > .frmsvg {
2006 + color: #fff;
2007 + transform: translateY(10px);
2008 +}
2009 +
2010 +.frm-templates-list .frm-inner-circle {
2011 + border-radius: 4px;
2012 + width: 40px;
2013 + height: 40px;
2014 + padding: 0;
2015 + box-sizing: border-box;
2016 + display: flex;
2017 + flex-direction: row;
2018 + align-items: center;
2019 + justify-content: center;
2020 + position: relative;
2021 +}
2022 +
2023 +.frm-templates-list .frm-inner-circle .frmsvg {
2024 + position: absolute;
2025 + top: 0;
2026 + left: 0;
2027 + width: 100%;
2028 + height: 100%;
2029 + box-sizing: border-box;
2030 + padding: 10px;
2031 +}
2032 +
2433 2033 #frm_new_form_modal .frm-search {
2434 - width: 100%;
2435 - margin: var(--gap-sm) 0 var(--gap-md);
2034 + width: calc( 100% - 20px );
2035 + margin: 40px 10px 30px;
2436 2036 }
2437 2037
2438 2038 #frm_leave_email,
2439 2039 #frm_code_from_email
@@ -2440,10 +2040,14 @@
2440 2040 {
2441 2041 width: 480px;
2442 2042 }
2443 2043
2444 -#frm_new_form_modal #template-search-input {
2445 - width: 100%;
2044 +#frm_new_form_modal #template-search-input,
2045 +#frm_new_form_modal #frm_leave_email,
2046 +#frm_new_form_modal #frm_code_from_email
2047 +{
2048 + border: 2px solid var(--grey-border);
2049 + border-radius: 4px !important;
2446 2050 }
2447 2051
2448 2052 #frm-email-block .frm-with-left-icon .frmsvg {
2449 2053 padding: 0;
@@ -2453,12 +2057,12 @@
2453 2057
2454 2058 #frm_new_form_modal .accordion-container {
2455 2059 display: inline-block;
2456 2060 padding: 0;
2457 - border-top: 1px solid var(--grey-300);
2061 + border-top: 1px solid var(--grey-border);
2458 2062 box-sizing: border-box;
2459 - margin: 0 5px;
2460 - width: calc( 100% - 10px );
2063 + margin: 0 10px;
2064 + width: calc( 100% - 20px );
2461 2065 }
2462 2066
2463 2067 #frm_new_form_modal .accordion-section-title {
2464 2068 padding: 0;
@@ -2468,13 +2072,13 @@
2468 2072 .control-section:hover .accordion-section-title,
2469 2073 #frm_new_form_modal .accordion-section.open .accordion-section-title
2470 2074 {
2471 2075 background: #fff !important;
2472 - border-bottom-color: transparent;
2076 + border-bottom: none;
2473 2077 }
2474 2078
2475 2079 #frm_new_form_modal .accordion-section.open:hover {
2476 - border-bottom-color: transparent;
2080 + border-bottom: none;
2477 2081 }
2478 2082
2479 2083 #frm_new_form_modal .accordion-section {
2480 2084 padding: 8px 0 4px;
@@ -2480,9 +2084,9 @@
2480 2084 padding: 8px 0 4px;
2481 2085 }
2482 2086
2483 2087 #frm_new_form_modal .accordion-section + .accordion-section {
2484 - border-top: 1px solid var(--grey-300);
2088 + border-top: 1px solid var(--grey-border);
2485 2089 border-radius: 0;
2486 2090 }
2487 2091
2488 2092 .frm-templates-list.frm-categories-list li > div > div:last-child,
@@ -2491,9 +2095,9 @@
2491 2095 padding-left: 0;
2492 2096 }
2493 2097
2494 2098 #frm_new_form_modal .frm-templates-list.frm-categories-list .accordion-section-title {
2495 - padding-left: var(--gap-sm);
2099 + padding-left: 10px;
2496 2100 }
2497 2101
2498 2102 #frm_new_form_modal .frm-templates-list.frm-categories-list li.frm-selectable {
2499 2103 padding: 0 10px;
@@ -2500,127 +2104,131 @@
2500 2104 overflow: hidden;
2501 2105 }
2502 2106
2503 2107 #frm_new_form_modal .accordion-section-content {
2504 - padding: var(--gap-sm);
2108 + padding: 10px 0;
2505 2109 }
2506 2110
2507 2111 .frm-hover-icons {
2508 2112 position: absolute;
2509 2113 right: 0;
2510 - top: calc( ( 58px - 2px - 22px ) / 2 ); /* Template item height - borders - icon height */
2511 - max-width: 91px;
2114 + top: 0;
2115 + height: 20px;
2116 + width: 65px;
2512 2117 height: 100%;
2513 2118 box-sizing: border-box;
2514 - padding: 0 10px 0 5px !important;
2515 - border-radius: var(--small-radius);
2119 + padding: 14px 10px 0 5px !important;
2120 + border-radius: 6px;
2516 2121 text-align: right;
2517 - display: flex;
2518 - gap: 5px;
2519 2122 }
2520 2123
2521 -.frm-ready-made-solution .frm-hover-icons {
2522 - visibility: hidden;
2124 +#frm_new_form_modal .frm-selectable[data-custom="1"] .frm-hover-icons {
2125 + width: 91px;
2523 2126 }
2524 2127
2525 -.frm-ready-made-solution:hover .frm-hover-icons {
2526 - visibility: visible;
2527 -}
2528 -
2529 2128 .frm-hover-icons a {
2530 2129 width: 22px;
2531 2130 height: 22px;
2532 - font-size: var(--text-md);
2533 - display: inline-flex;
2534 - align-items: center;
2535 - justify-content: center;
2131 + display: inline-block;
2536 2132 border-radius: 50%;
2537 2133 box-sizing: border-box;
2538 - line-height: var(--leading);
2134 + line-height: 20px;
2539 2135 text-align: center;
2540 2136 }
2541 2137
2542 2138 .frm-hover-icons > .frm-preview-form,
2543 2139 .frm-hover-icons > .frm-delete-form {
2544 - border: 1px solid var(--primary-500);
2140 + border: 1px solid var(--primary-color);
2141 + margin-right: 5px;
2545 2142 }
2546 2143
2547 -.frm-hover-icons > .frm-create-form,
2548 -.frm-ready-made-solution .frm-hover-icons a {
2549 - background-color: var(--primary-500);
2144 +.frm-hover-icons > .frm-create-form {
2145 + background-color: var(--primary-color);
2550 2146 }
2551 2147
2552 -.frm-hover-icons > a .frmsvg {
2553 - width: 14px;
2554 - height: 14px;
2555 - vertical-align: baseline;
2148 +.frm-hover-icons > .frm-preview-form .frmsvg {
2149 + width: 16px;
2150 + height: 16px;
2151 + color: var(--primary-color);
2556 2152 }
2557 2153
2558 -.frm-hover-icons > .frm-preview-form .frmsvg,
2559 2154 .frm-hover-icons > .frm-delete-form .frmsvg {
2560 - color: var(--primary-500);
2155 + width: 14px;
2156 + height: 14px;
2157 + color: var(--primary-color);
2158 + transform: translateY(-1px);
2561 2159 }
2562 2160
2563 2161 .frm-hover-icons > .frm-unlock-form {
2564 - background-color: var(--primary-500);
2162 + background-color: var(--primary-color);
2565 2163 }
2566 2164
2567 2165 .frm-hover-icons > .frm-unlock-form .frmsvg {
2568 - background-color: var(--primary-500);
2166 + width: 12px;
2167 + height: 12px;
2168 + background-color: var(--primary-color);
2169 + transform: translateY(-2px);
2569 2170 }
2570 2171
2571 -.frm-ready-made-solution .frmsvg {
2172 +.frm-hover-icons > .frm-create-form .frmsvg {
2572 2173 width: 14px;
2573 2174 height: 14px;
2574 2175 }
2575 2176
2576 -.frm-hover-icons .frm-create-form svg,
2577 -.frm-ready-made-solution .frm-hover-icons svg {
2177 +.frm-hover-icons .frm-create-form svg {
2578 2178 color: #fff;
2579 2179 }
2580 2180
2581 2181 .frm-hover-icons .frm-create-form:hover,
2582 -.frm-ready-made-solution .frm-hover-icons a:hover,
2583 2182 .frm-hover-icons > .frm-unlock-form:hover,
2584 2183 .frm-hover-icons > .frm-unlock-form:hover .frmsvg
2585 2184 {
2586 - background-color: var(--primary-700) !important;
2185 + background-color: var(--primary-hover) !important;
2587 2186 }
2588 2187
2589 2188 .frm-hover-icons .frm-preview-form:hover,
2590 2189 .frm-hover-icons .frm-delete-form:hover
2591 2190 {
2592 - border: 1px solid var(--primary-700) !important;
2191 + border: 1px solid var(--primary-hover) !important;
2593 2192 }
2594 2193
2595 2194 .frm-hover-icons .frm-preview-form:hover .frmsvg,
2596 2195 .frm-hover-icons .frm-delete-form:hover .frmsvg {
2597 - color: var(--primary-700) !important;
2196 + color: var(--primary-hover) !important;
2598 2197 }
2599 2198
2600 -.frm-application-card h4 .frmsvg,
2601 2199 .frm-locked-template h3 .frmsvg {
2602 - height: var(--text-sm);
2603 - width: var(--text-sm);
2604 - vertical-align: text-top;
2605 - color: var(--grey-500);
2200 + height: 12px;
2201 + width: 14px;
2202 + vertical-align: top;
2203 + padding-top: 6px;
2606 2204 }
2607 2205
2206 +.frm_modal_footer {
2207 + background-color: #fff;
2208 + padding: 30px 20px 15px;
2209 + text-align: right;
2210 + border-top: 1px solid var(--grey-border);
2211 +}
2212 +
2608 2213 #frm_new_form_modal .frm-use-this-template {
2609 2214 margin-left: 10px;
2610 2215 }
2611 2216
2612 2217 #frm_new_form_modal #frm-preview-block {
2613 - padding: var(--gap-md) var(--gap-lg);
2218 + padding: 20px 40px;
2614 2219 overflow-x: hidden;
2615 2220 }
2616 2221
2617 2222 #frm_new_form_modal #frm-details-block {
2618 - padding: var(--gap-md) var(--gap-lg);
2223 + padding: 20px 40px;
2619 2224 }
2620 2225
2621 2226 .frm-modal-back {
2622 2227 cursor: pointer;
2228 + font-size: 17px;
2229 + vertical-align: top;
2230 + margin-top: 4px;
2623 2231 margin-right: 4px;
2624 2232 }
2625 2233
2626 2234 .frm-modal-cancel {
@@ -2627,28 +2235,19 @@
2627 2235 float: left;
2628 2236 }
2629 2237
2630 2238 .frm-plan-required-tag {
2631 - margin-left: 5px;
2632 - transform: translateY(-1px);
2633 2239 background: #FDE6DE;
2634 2240 color: #F15A24;
2635 -}
2636 -
2637 -.frm-ready-made-solution .frm-meta-tag {
2638 - width: fit-content;
2639 - background: #FDE6DE;
2640 - color: #F15A24;
2641 -}
2642 -
2643 -.frm-meta-tag {
2644 2241 font-size: 10px;
2645 - padding: 4px 6px;
2242 + padding: 4px 8px;
2646 2243 border-radius: 4px;
2647 2244 text-transform: uppercase;
2648 2245 font-weight: normal;
2649 2246 display: inline-block;
2650 2247 line-height: 12px;
2248 + transform: translateY(-1px);
2249 + margin-left: 5px;
2651 2250 }
2652 2251
2653 2252 #frm_new_form_modal.frm-expired #frm-create-block,
2654 2253 #frm_new_form_modal.frm-expiring #frm-create-block {
@@ -2658,14 +2257,18 @@
2658 2257 #frm-create-footer {
2659 2258 padding: 15px 20px;
2660 2259 }
2661 2260
2261 +#frm-create-footer .frm_error_style {
2262 + border-radius: 6px;
2263 +}
2264 +
2662 2265 #frm_code_from_email_options {
2663 2266 margin-top: 20px;
2664 2267 }
2665 2268
2666 2269 #frm_code_from_email_options * {
2667 - color: var(--primary-500);
2270 + color: var(--primary-color);
2668 2271 }
2669 2272
2670 2273 #frm-email-block p,
2671 2274 #frm-code-block p,
@@ -2701,23 +2304,20 @@
2701 2304 #frm_new_form_modal[frm-page="upgrade"] #frm-upgrade-title,
2702 2305 #frm_new_form_modal[frm-page="email"] #frm-email-title,
2703 2306 #frm_new_form_modal[frm-page="code"] #frm-email-title,
2704 2307 #frm_new_form_modal[frm-page="renew"] #frm-renew-title,
2308 +.frm-locked-template .frm-hover-icons .frm-unlock-form,
2309 +li[data-preview] .frm-hover-icons .frm-preview-form,
2705 2310 #frm_code_from_email_error[frm-error="wrong-code"] span[frm-error="wrong-code"],
2706 2311 #frm_code_from_email_error[frm-error="empty"] span[frm-error="empty"],
2707 2312 #frm_code_from_email_error[frm-error="custom"] span[frm-error="custom"],
2708 2313 #frm_leave_email_error[frm-error="invalid"] span[frm-error="invalid"],
2709 -#frm_leave_email_error[frm-error="empty"] span[frm-error="empty"]
2314 +#frm_leave_email_error[frm-error="empty"] span[frm-error="empty"],
2315 +#frm_new_form_modal .frm-selectable[data-custom="1"] .frm-hover-icons .frm-delete-form
2710 2316 {
2711 2317 display: inline-block;
2712 2318 }
2713 2319
2714 -.frm-locked-template .frm-hover-icons .frm-unlock-form,
2715 -li[data-preview] .frm-hover-icons .frm-preview-form,
2716 -#frm_new_form_modal .frm-selectable[data-custom="1"] .frm-hover-icons .frm-delete-form {
2717 - display: inline-flex;
2718 -}
2719 -
2720 2320 #frm_new_form_modal[frm-page="create"] #frm-create-block,
2721 2321 #frm_new_form_modal[frm-page="preview"] #frm-preview-block,
2722 2322 #frm_new_form_modal[frm-page="details"] #frm-details-block,
2723 2323 #frm_new_form_modal[frm-page="upgrade"] #frm-upgrade-block,
@@ -2752,120 +2352,28 @@
2752 2352 }
2753 2353
2754 2354 #frm-upgrade-body-list-wrapper ul li:before {
2755 2355 content: "\2022";
2756 - color: var(--primary-500);
2356 + color: var(--primary-color);
2757 2357 display: inline-block;
2758 2358 width: 1em;
2759 2359 margin-left: -1em;
2760 2360 }
2761 2361
2762 -/* Embed Form Modal */
2763 -
2764 -.frm-embed-modal-content {
2765 - padding: var(--gap-md);
2766 -}
2767 -
2768 -.frm-embed-modal-content.frm-loading-page-options {
2769 - display: flex;
2770 - justify-content: center;
2771 -}
2772 -
2773 -#frm_embed_modal .frm_embed_example {
2774 - background: var(--sidebar-color);
2775 - border: 1px solid var(--sidebar-hover);
2776 - border-radius: var(--small-radius);
2777 - color: var(--grey-900);
2778 - font-size: var(--text-sm);
2779 - padding-right: var(--gap-lg);
2780 - width: 100%;
2781 - height: auto !important;
2782 - resize: none;
2783 -}
2784 -
2785 -#frm_embed_modal textarea.frm_embed_example {
2786 - padding-bottom: 0;
2787 -}
2788 -
2789 -.frm-embed-modal-content > div a {
2790 - position: absolute;
2791 - right: 0;
2792 - top: 0;
2793 -}
2794 -
2795 -.frm-embed-modal-content > div {
2796 - position: relative;
2797 - margin-bottom: var(--gap-sm);
2798 -}
2799 -
2800 -.frm-embed-modal-content > div:last-child {
2801 - margin-bottom: 0;
2802 -}
2803 -
2804 -.frm-embed-modal-content svg[id^="frm_copy_embed_"] {
2805 - position: absolute;
2806 - bottom: calc( ( 38px - 18px ) / 2 ); /* Input height - SVG height */
2807 - right: 10px;
2808 - cursor: pointer;
2809 - opacity: 0.5;
2810 -}
2811 -
2812 -.frm-border-info-box,
2813 -.frm-embed-modal-option {
2814 - border-radius: var(--small-radius);
2815 - border: 1px solid var(--grey-300);
2816 - padding: var(--gap-sm);
2817 - cursor: pointer;
2818 - display: flex;
2819 - gap: var(--gap-sm);
2820 - font-size: var(--text-sm);
2821 -}
2822 -
2823 -.frm-embed-modal-option + .frm-embed-modal-option {
2824 - margin-top: var(--gap-sm);
2825 -}
2826 -
2827 -.frm-collapsed .frmsvg,
2828 -.caret.rotate-270,
2829 -.frm-embed-modal-option .caret {
2830 - align-self: center;
2831 - margin-left: auto;
2832 - transform: rotate(-90deg);
2833 -}
2834 -
2835 -#frm_embed_modal .frm_modal_footer {
2836 - display: none;
2837 -}
2838 -
2839 -#frm_embed_modal.frm-on-page-2 .frm_modal_footer {
2840 - display: block;
2841 -}
2842 -
2843 -.frm-embed-modal-content ul {
2844 - max-height: 300px;
2845 - overflow-y: scroll;
2846 -}
2847 -
2848 -.frm-embed-modal-wrapper.frm-dialog {
2849 - overflow: visible;
2850 -}
2851 -
2852 2362 /* Bulk Options */
2853 2363 #frm-bulk-modal .frm_grid_container {
2364 + border-top: 1px solid var(--grey-border);
2854 2365 grid-template-columns: repeat(12, 8.33%);
2855 2366 grid-gap: 0;
2856 2367 }
2857 2368
2858 2369 #frm-bulk-modal .frm8 {
2859 - border-right: 1px solid var(--grey-300);
2860 - padding: 10px 20px 10px var(--gap-lg);
2370 + border-right: 1px solid var(--grey-border);
2371 + padding: 0 20px 20px;
2861 2372 }
2862 2373
2863 -#frm-bulk-modal .frm4 {
2864 - padding: 10px 0;
2865 -}
2866 -
2867 -.frm-inline-modal .howto {
2374 +.frm-inline-modal .howto,
2375 +#frm-bulk-modal .howto {
2868 2376 margin: 5px 0 10px;
2869 2377 color: var(--grey);
2870 2378 }
2871 2379
@@ -2882,18 +2390,18 @@
2882 2390 }
2883 2391
2884 2392 .frm-bulk-edit-link {
2885 2393 text-align: right;
2886 - font-size: var(--text-sm);
2394 + font-size: 14px;
2887 2395 padding: 0 5px 10px;
2888 2396 }
2889 2397
2890 2398 .frm-small-add {
2891 - font-size: var(--text-sm) !important;
2399 + font-size: 14px !important;
2892 2400 }
2893 2401
2894 2402 .frm-small-add span {
2895 - color: var(--primary-500);
2403 + color: var(--primary-color);
2896 2404 font-size: 12px;
2897 2405 height: 12px;
2898 2406 width: 12px;
2899 2407 }
@@ -2908,33 +2416,34 @@
2908 2416 }
2909 2417
2910 2418 .frm-right-panel .inside a.frm_pro_tip,
2911 2419 a.frm_pro_tip {
2912 - font-size: var(--text-sm);
2420 + font-size: 14px;
2421 + border: 1px solid var(--orange);
2913 2422 display: inline-block;
2914 - color: var(--grey-700);
2915 - background: #FFE7DE;
2916 - border-radius: var(--small-radius);
2423 + color: var(--dark-grey);
2424 + background: var(--light-blue);
2425 + border-radius: var(--border-radius);
2426 + text-align: center;
2917 2427 padding: 5px 15px;
2918 2428 margin: 0 auto;
2919 - display: flex;
2920 - align-items: center;
2429 + line-height: 1.4;
2921 2430 }
2922 2431
2923 2432 a.frm_pro_tip:hover {
2924 - color: var(--grey-700);
2925 - border-color: var(--primary-500);
2433 + color: var(--dark-grey);
2434 + border-color: var(--primary-color);
2926 2435 }
2927 2436
2928 2437 a.frm_pro_tip:hover .frmsvg {
2929 - fill: var(--primary-500);
2438 + fill: var(--primary-color);
2930 2439 }
2931 2440
2932 2441 .frm_field_list .frm_pro_tip {
2933 2442 margin: 10px 15px;
2443 + padding-left: 40px;
2934 2444 position: relative;
2935 - width: calc(100% - 30px);
2936 - box-sizing: border-box;
2445 + background: #fff;
2937 2446 }
2938 2447
2939 2448 a.frm_pro_tip .frmsvg,
2940 2449 a.frm_pro_tip i {
@@ -2941,27 +2450,19 @@
2941 2450 color: var(--orange);
2942 2451 margin-right: 5px;
2943 2452 }
2944 2453
2945 -a.frm_pro_tip .frmsvg {
2946 - margin-right: 10px;
2454 +.frm_field_list a.frm_pro_tip .frmsvg {
2455 + position: absolute;
2456 + left: 15px;
2457 + top: calc(50% - 11px);
2947 2458 }
2948 2459
2949 -.frm-light-tip a.frm_pro_tip {
2950 - background: rgba(188, 224, 253, 0.23);
2460 +.pro-tip {
2461 + font-weight: 500;
2462 + color: var(--darkest-grey);
2951 2463 }
2952 2464
2953 -.frm-light-tip a.frm_pro_tip .frmsvg,
2954 -.frm-light-tip a.frm_pro_tip i,
2955 -.frm-light-tip .frm-tip-cta {
2956 - color: var(--primary-500);
2957 -}
2958 -
2959 -.frm-tip-info {
2960 - flex: 1;
2961 - text-align: left;
2962 -}
2963 -
2964 2465 .frm-tip-cta {
2965 2466 color: var(--orange);
2966 2467 }
2967 2468
@@ -2969,9 +2470,9 @@
2969 2470 float: right;
2970 2471 }
2971 2472
2972 2473 .frm_pro_tip:hover .frm-tip-cta {
2973 - color: var(--primary-500);
2474 + color: var(--primary-color);
2974 2475 }
2975 2476
2976 2477 /*Switch form dropdown*/
2977 2478 h1 .fa-caret-down {
@@ -2986,23 +2487,16 @@
2986 2487 vertical-align: middle;
2987 2488 }
2988 2489
2989 2490 .caret,
2990 -.wp-admin .frm_wrap select,
2991 -.frm_wrap .frm_form_builder select,
2992 2491 .frm_wrap .ui-autocomplete-input {
2993 - background: transparent url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23667085%22%2F%3E%3C%2Fsvg%3E') no-repeat right 5px top 55%;
2994 - background-size: var(--text-md) var(--text-md);
2995 - padding-right: var(--gap-lg) !important;
2492 + background:#fff url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E') no-repeat right 5px top 55%;
2493 + background-size: 16px 16px;
2996 2494 }
2997 2495
2998 -.caret {
2999 - padding-right: var(--gap-xs) !important;
3000 -}
3001 -
3002 2496 .frm-btn-group .caret {
3003 2497 float: right;
3004 - margin-top: calc( var(--text-md) / 2 );
2498 + margin-top: 6px;
3005 2499 }
3006 2500
3007 2501 .dropdown {
3008 2502 position: relative;
@@ -3011,12 +2505,12 @@
3011 2505 .dropdown-toggle:focus {
3012 2506 outline: 0;
3013 2507 }
3014 2508
3015 -.frm_wrap .ui-autocomplete,
3016 -#frm_adv_info.frm-dropdown-menu,
3017 2509 .frm-dropdown-menu {
3018 - /* Copied from .dropdown-menu rules from Bootstrap */
2510 + max-height: 200px;
2511 + overflow: auto;
2512 + overflow-x: hidden;
3019 2513 position: absolute;
3020 2514 top: 100%;
3021 2515 left: 0;
3022 2516 z-index: 1000;
@@ -3021,27 +2515,21 @@
3021 2515 left: 0;
3022 2516 z-index: 1000;
3023 2517 display: none;
3024 2518 float: left;
3025 - padding-left: 4px;
3026 - padding-right: 4px;
3027 - margin: var(--gap-xs) 0 0;
3028 2519 text-align: left;
2520 + min-width: 160px;
2521 + width: auto;
2522 + padding: 5px 0;
2523 + margin: 2px 0 0;
3029 2524 list-style: none;
3030 - background: none;
3031 - background-color: #fff;
2525 + font-size: 12px;
2526 + background-color: #ffffff;
2527 + border: 1px solid rgba(0, 0, 0, 0.15);
2528 + border-radius: 4px;
2529 + -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
2530 + box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
3032 2531 background-clip: padding-box;
3033 - border: 1px solid var(--grey-100);
3034 - border-radius: 0.25rem;
3035 - box-shadow: var(--box-shadow-lg);
3036 -
3037 - /* Custom rules */
3038 - max-height: 200px;
3039 - overflow-y: auto;
3040 - overflow-x: hidden;
3041 - font-size: var(--text-md);
3042 - width: auto;
3043 - min-width: 160px;
3044 2532 }
3045 2533
3046 2534 .frm6 .frm-dropdown-menu {
3047 2535 min-width: 100px;
@@ -3047,35 +2535,25 @@
3047 2535 min-width: 100px;
3048 2536 max-width: 99%;
3049 2537 }
3050 2538
2539 +#frm_bs_dropdown > a {
2540 + font-size: 1em;
2541 +}
2542 +
3051 2543 #frm_bs_dropdown .frm-dropdown-menu {
3052 2544 max-width: 400px;
3053 2545 }
3054 2546
3055 -.field_type_list .frm-dropdown-menu {
3056 - min-width: 150px !important;
2547 +.preview .frm-dropdown-menu {
2548 + min-width: 60px;
3057 2549 }
3058 2550
3059 -#frm_field_group_controls .frm-dropdown-menu,
3060 -.frm-field-action-icons .frm-dropdown-menu {
3061 - min-width: 180px !important;
2551 +.field_type_list .frm-dropdown-menu {
2552 + min-width: 150px;
3062 2553 }
3063 2554
3064 -.frm-field-action-icons .frm-dropdown-toggle svg {
3065 - color: #9EA9B8;
3066 -}
3067 -
3068 -.multiselect-container.frm-dropdown-menu,
3069 -#search-submit .frm-dropdown-menu {
3070 - min-width: 200px !important;
3071 -}
3072 -
3073 -.preview .frm-dropdown-menu {
3074 - min-width: 230px !important;
3075 -}
3076 -
3077 -.frm-dropdown-menu.dropdown-menu-right {
2555 +.frm-dropdown-menu.pull-right {
3078 2556 right: 0;
3079 2557 left: auto;
3080 2558 }
3081 2559
@@ -3085,37 +2563,29 @@
3085 2563 overflow: hidden;
3086 2564 background-color: #e5e5e5;
3087 2565 }
3088 2566
3089 -.frm-dropdown-menu > .dropdown-item {
2567 +.frm-dropdown-menu > li {
3090 2568 margin: 0;
3091 2569 }
3092 2570
3093 -.frm-select-list-item,
3094 -.frm_wrap .ui-autocomplete li > div,
3095 -.multiselect-container button.multiselect-option,
3096 -.frm-dropdown-menu > .dropdown-item > a,
2571 +.frm-dropdown-menu > li > a,
3097 2572 .frm-dropdown-menu .frm_dropdown_li {
3098 2573 clear: both;
3099 2574 font-weight: normal;
3100 2575 white-space: nowrap;
3101 2576 text-decoration: none;
3102 - border-radius: var(--small-radius);
3103 2577 }
3104 2578
3105 -.frm-dropdown-menu > .active > a,
3106 -.frm-dropdown-menu > .active > a:hover,
3107 -.frm-dropdown-menu > .active > a:focus {
2579 +.frm-dropdown-menu > .active > a, .frm-dropdown-menu > .active > a:hover, .frm-dropdown-menu > .active > a:focus {
3108 2580 text-decoration: none;
3109 2581 outline: 0;
3110 2582 }
3111 2583
3112 -.frm-select-list-item.disabled,
3113 2584 .frm-dropdown-menu > .disabled > a, .frm-dropdown-menu > .disabled > a:hover, .frm-dropdown-menu > .disabled > a:focus {
3114 2585 color: #999999;
3115 2586 }
3116 2587
3117 -.frm-select-list-item.disabled:hover,
3118 2588 .frm-dropdown-menu > .disabled > a:hover,
3119 2589 .frm-dropdown-menu > .disabled > a:focus {
3120 2590 text-decoration: none;
3121 2591 background-color: transparent;
@@ -3132,11 +2602,12 @@
3132 2602 }
3133 2603
3134 2604 .dropdown-header {
3135 2605 display: block;
3136 - padding: 3px 10px;
3137 - font-size: var(--text-xs);
3138 - color: var(--grey-400);
2606 + padding: 3px 20px;
2607 + font-size: 12px;
2608 + line-height: 1.428571429;
2609 + color: #999999;
3139 2610 }
3140 2611
3141 2612 .dropdown-backdrop {
3142 2613 position: fixed;
@@ -3146,9 +2617,8 @@
3146 2617 top: 0;
3147 2618 z-index: 990;
3148 2619 }
3149 2620
3150 -.dropdown-menu-right > .frm-dropdown-menu,
3151 2621 .pull-right > .frm-dropdown-menu {
3152 2622 right: 0;
3153 2623 left: auto;
3154 2624 }
@@ -3168,13 +2638,13 @@
3168 2638 .btn {
3169 2639 border: 1px solid #ddd;
3170 2640 background: #fff;
3171 2641 height: 28px;
3172 - line-height: var(--leading);
2642 + line-height: 1.5;
3173 2643 }
3174 2644
3175 2645 a.frm_option_icon:before {
3176 - color: var(--primary-500);
2646 + color: var(--primary-color);
3177 2647 font-size: 22px;
3178 2648 width: 22px;
3179 2649 height: 22px;
3180 2650 }
@@ -3180,9 +2650,9 @@
3180 2650 }
3181 2651
3182 2652 a.frm_option_icon:focus::before,
3183 2653 a.frm_option_icon:hover::before {
3184 - color: var(--primary-700);
2654 + color: var(--primary-hover);
3185 2655 }
3186 2656
3187 2657 .frm_top_left .frm-dropdown-toggle {
3188 2658 color: #999;
@@ -3196,17 +2666,17 @@
3196 2666 text-decoration: none;
3197 2667 }
3198 2668
3199 2669 .frm-card .frm-dropdown-toggle {
3200 - border: 1px solid var(--grey-300);
2670 + border: 1px solid var(--grey-border);
3201 2671 border-radius: var(--small-radius);
3202 2672 font-size: 13px;
3203 - color: var(--grey-700);
2673 + color: var(--dark-grey);
3204 2674 padding: 7px 20px;
3205 2675 }
3206 2676
3207 2677 .frm_actions_dropdown .frm-dropdown-menu {
3208 - font-size: var(--text-sm);
2678 + font-size: 14px;
3209 2679 color: #5F6C72;
3210 2680 }
3211 2681
3212 2682 .frm-dropdown-menu .frm_icon_font {
@@ -3218,21 +2688,20 @@
3218 2688 /* BS Multiselect */
3219 2689 .multiselect-container.frm-dropdown-menu {
3220 2690 top: auto;
3221 2691 left: auto;
3222 - font-size: var(--text-sm);
3223 - padding: 4px;
2692 + font-size: 14px;
2693 + padding-top: 3px;
3224 2694 margin-bottom: 3px;
3225 2695 }
3226 2696
3227 2697 .frm-right-panel .accordion-section-content {
3228 2698 background: transparent;
3229 - padding: 0;
3230 - overflow: initial;
2699 + padding-top: 0
3231 2700 }
3232 2701
3233 -.frm-right-panel .accordion-section-content > .inside {
3234 - padding: 0 0 var(--gap-xs);
2702 +.frm-right-panel .accordion-section-content > .inside {
2703 + padding: 0;
3235 2704 }
3236 2705
3237 2706 .frm-right-panel .accordion-section-content .inside a {
3238 2707 font-size: inherit;
@@ -3239,10 +2708,10 @@
3239 2708 }
3240 2709
3241 2710 #post-body-content + .frm-right-panel h3.accordion-section-title {
3242 2711 padding: 7px 10px 8px 14px;
3243 - font-size: var(--text-md);
3244 - color: var(--grey-700);
2712 + font-size: 16px;
2713 + color: var(--dark-grey);
3245 2714 }
3246 2715
3247 2716 .frm-right-panel .control-section.open h3 {
3248 2717 border-bottom: none;
@@ -3251,22 +2720,22 @@
3251 2720 .js .frm-right-panel .control-section.open .accordion-section-title,
3252 2721 .js .frm-right-panel .control-section .accordion-section-title:focus,
3253 2722 .js .frm-right-panel .control-section .accordion-section-title:hover {
3254 2723 background: transparent;
3255 - color: var(--grey-900);
2724 + color: var(--dark-grey);
3256 2725 }
3257 2726
3258 2727 .js .frm-right-panel .control-section .accordion-section-title:hover:before {
3259 - color: var(--grey-700);
2728 + color: var(--dark-grey);
3260 2729 }
3261 2730
3262 2731 .frm-with-line,
3263 2732 .accordion-section-content h4 {
3264 - font-size: var(--text-md);
2733 + font-size: 16px;
3265 2734 font-weight: 400;
3266 2735 margin: 20px -20px 10px;
3267 2736 padding: 0 20px;
3268 - color: var(--grey-700);
2737 + color: var(--dark-grey);
3269 2738 position: relative;
3270 2739 border: none !important;
3271 2740 }
3272 2741
@@ -3296,9 +2765,9 @@
3296 2765 .accordion-section-content h4:before {
3297 2766 content: '';
3298 2767 display: block;
3299 2768 position: absolute;
3300 - border-bottom: 1px solid var(--grey-300);
2769 + border-bottom: 1px solid var(--grey-border);
3301 2770 left: 0;
3302 2771 width: 100%;
3303 2772 top: 50%;
3304 2773 }
@@ -3316,9 +2785,8 @@
3316 2785 font-family: "s11-fp" !important;
3317 2786 font-size: 18px;
3318 2787 font-variant: normal;
3319 2788 text-rendering: auto;
3320 - vertical-align: text-top;
3321 2789 }
3322 2790
3323 2791 #frm_new_form_modal .accordion-section.open .accordion-section-title:after {
3324 2792 transform: rotate(90deg);
@@ -3324,9 +2792,9 @@
3324 2792 transform: rotate(90deg);
3325 2793 }
3326 2794
3327 2795 .frm-right-panel .accordion-section-title:after {
3328 - top: calc(50% - 10px) !important;
2796 + right: 20px;
3329 2797 }
3330 2798
3331 2799 .frm-right-panel .open .accordion-section-title:after {
3332 2800 content: "\e62a" !important;
@@ -3335,9 +2803,9 @@
3335 2803 .frm-right-panel .accordion-section-title:before {
3336 2804 content: "\f1de" !important;
3337 2805 color: var(--grey);
3338 2806 font-size: 17px !important;
3339 - margin: 0 10px 0 0;
2807 + margin: 0 10px;
3340 2808 }
3341 2809
3342 2810 .form-title-style .accordion-section-title:before,
3343 2811 .section-fields-style .accordion-section-title:before {
@@ -3395,21 +2863,16 @@
3395 2863 .progress-bars-style .accordion-section-title:before{
3396 2864 content: "\e939" !important;
3397 2865 }
3398 2866
3399 -#frm_view_editor_left.frm-right-panel .accordion-section-title,
3400 2867 .frm-right-panel h3.accordion-section-title {
3401 2868 padding: 15px 20px;
3402 2869 background: var(--sidebar-color);
3403 - line-height: var(--leading);
3404 - color: var(--grey-700);
3405 - font-size: var(--text-lg);
3406 - font-weight: 400;
2870 + line-height: 1;
3407 2871 }
3408 2872
3409 -.control-section .accordion-section-title:after, /** Form template list */
3410 -.customize-pane-child .accordion-section-title:after {
3411 - top: 15px;
2873 +.control-section .accordion-section-title:after, .customize-pane-child .accordion-section-title:after {
2874 + top: 19px;
3412 2875 }
3413 2876
3414 2877 .accordion-container .frm-dropdown-menu {
3415 2878 min-width: 40px;
@@ -3414,39 +2877,58 @@
3414 2877 .accordion-container .frm-dropdown-menu {
3415 2878 min-width: 40px;
3416 2879 }
3417 2880
3418 -.frm-btn-group .multiselect.dropdown-toggle {
3419 - box-sizing: border-box;
3420 - min-height: unset;
3421 -}
3422 -
3423 2881 .accordion-container .frm-dropdown-menu:before,
3424 2882 .accordion-container .multiselect.dropdown-toggle:before {
3425 2883 font-family: "s11-fp" !important;
3426 2884 }
3427 2885
2886 +.multiselect-container.frm-dropdown-menu input[type=radio] {
2887 + display: none;
2888 +}
2889 +
3428 2890 .multiselect-container {
3429 2891 position: absolute;
3430 2892 list-style-type: none;
3431 2893 margin: 0;
2894 + padding: 0
2895 +}
2896 +
2897 +.multiselect-container .input-group {
2898 + margin: 5px
2899 +}
2900 +
2901 +.multiselect-container > li {
3432 2902 padding: 0;
3433 - width: 100%;
3434 - max-width: 250px;
2903 + margin: 0;
3435 2904 }
3436 2905
3437 -.multiselect-container button.multiselect-option {
3438 - width: 100%;
3439 - text-align: left;
3440 - border: none;
3441 - margin-bottom: 4px;
2906 +.multiselect-container > li > a.multiselect-all label {
2907 + font-weight: 700
3442 2908 }
3443 2909
3444 -.multiselect-container button.multiselect-option label {
3445 - margin-left: 5px;
2910 +.multiselect-container > li > label.multiselect-group {
2911 + margin: 0;
2912 + padding: 3px 20px;
2913 + height: 100%;
2914 + font-weight: 700
3446 2915 }
3447 2916
3448 -.accordion-container .multiselect-container label {
2917 +.frm-dropdown-menu.multiselect-container > li > a {
2918 + padding: 0
2919 +}
2920 +
2921 +.multiselect-container > li > a > label {
2922 + margin: 0;
2923 + padding: 3px 25px;
2924 + height: 100%;
2925 + cursor: pointer;
2926 + font-weight: 400;
2927 + display: block;
2928 +}
2929 +
2930 +.accordion-container .multiselect-container > li > a > label {
3449 2931 padding: 3px 19px 3px 7px;
3450 2932 }
3451 2933
3452 2934 .frm-btn-group.btn-group > .btn-group:nth-child(2) > .multiselect.btn {
@@ -3453,19 +2935,24 @@
3453 2935 border-top-left-radius: 4px;
3454 2936 border-bottom-left-radius: 4px
3455 2937 }
3456 2938
2939 +.form-inline .multiselect-container label.checkbox,
2940 +.form-inline .multiselect-container label.radio {
2941 + padding: 3px 20px;
2942 +}
2943 +
2944 +.form-inline .multiselect-container li a label.checkbox input[type=checkbox],
2945 +.form-inline .multiselect-container li a label.radio input[type=radio] {
2946 + margin-left: -20px;
2947 + margin-right: 0;
2948 +}
2949 +
3457 2950 .frm-btn-group.btn-group, .frm-btn-group.btn-group-vertical {
3458 2951 display: block;
2952 + vertical-align: middle;
3459 2953 }
3460 2954
3461 -.multiselect-option label {
3462 - max-width: calc(100% - 22px);
3463 - text-overflow: ellipsis;
3464 - overflow: hidden;
3465 - white-space: nowrap;
3466 -}
3467 -
3468 2955 .frm_scale {
3469 2956 text-align: center;
3470 2957 float: left;
3471 2958 margin-right: 10px;
@@ -3487,13 +2974,8 @@
3487 2974 width: 100%;
3488 2975 height: auto;
3489 2976 }
3490 2977
3491 -.frm_form_builder .frm_time_wrap .frm_time_sep {
3492 - vertical-align: sub;
3493 - vertical-align: -webkit-baseline-middle;
3494 -}
3495 -
3496 2978 .frm_form_builder input[type=range]::-webkit-slider-runnable-track {
3497 2979 background-color: var(--blue-border);
3498 2980 }
3499 2981
@@ -3520,9 +3002,9 @@
3520 3002 .frm-fake-field {
3521 3003 display: block;
3522 3004 height: 25px;
3523 3005 background-color: var(--light-blue);
3524 - border: 1px solid var(--grey-300);
3006 + border: 1px solid var(--grey-border);
3525 3007 margin: 10px 0;
3526 3008 border-radius: var(--small-radius);
3527 3009 }
3528 3010
@@ -3528,15 +3010,15 @@
3528 3010
3529 3011 .frm-embed-message {
3530 3012 position: absolute;
3531 3013 background: #fff;
3532 - border: 1px solid var(--grey-300);
3533 - color: var(--grey-700);
3534 - padding: var(--gap-md);
3535 - font-size: var(--text-lg);
3014 + border: 1px solid var(--grey-border);
3015 + color: var(--dark-grey);
3016 + padding: 37px 0;
3017 + font-size: 18px;
3536 3018 max-width: 200px;
3537 3019 min-width: 50%;
3538 - margin: 0 var(--gap-md);
3020 + margin: 0 25px;
3539 3021 overflow: hidden;
3540 3022 text-overflow: ellipsis;
3541 3023 }
3542 3024
@@ -3543,9 +3025,9 @@
3543 3025 .frm-summary-message {
3544 3026 top: 50%;
3545 3027 left: 50%;
3546 3028 padding: 15px 0;
3547 - font-size: var(--text-md);
3029 + font-size: 16px;
3548 3030 transform: translate(-50%, -50%);
3549 3031 }
3550 3032
3551 3033 .frm-summary-learn-more {
@@ -3554,9 +3036,8 @@
3554 3036
3555 3037 .frm-single-settings .frm-embed-message {
3556 3038 width: 100%;
3557 3039 position: static;
3558 - border-radius: var(--small-radius);
3559 3040 }
3560 3041
3561 3042 #new_fields input[type=text],
3562 3043 #new_fields input[type=number],
@@ -3593,8 +3074,19 @@
3593 3074 width: 16px;
3594 3075 padding: 0;
3595 3076 }
3596 3077
3078 +.frm-star-group:not(.frm-star-hovered) input[type=radio]:checked + label:before,
3079 +.frm-star-group input + label:hover:before,
3080 +.frm-star-group:hover input + label:hover:before,
3081 +.frm-star-group .star-rating-on:before,
3082 +.frm-star-group .star-rating-hover:before,
3083 +.frm-star-group input[type=radio]:checked + label:before,
3084 +.frm-star-group input + label:before,
3085 +.frm-star-group .star-rating:before {
3086 + color: var( --blue-border);
3087 +}
3088 +
3597 3089 .frm_wrap .frm-number-range + .frm_last input,
3598 3090 .frm_wrap .frm-number-range input {
3599 3091 text-align: center;
3600 3092 font-weight: 600;
@@ -3601,9 +3093,9 @@
3601 3093 }
3602 3094
3603 3095 .frm_wrap .frm-number-range input[type=number],
3604 3096 .frm_wrap .frm-number-range input[type=text] {
3605 - color: var(--primary-700);
3097 + color: var(--primary-hover);
3606 3098 }
3607 3099
3608 3100 .frm-range-min {
3609 3101 position: relative;
@@ -3613,25 +3105,24 @@
3613 3105 content: '';
3614 3106 height: 3px;
3615 3107 width: 10px;
3616 3108 border-radius: 30%;
3617 - background: var(--primary-700);
3109 + background: var(--primary-hover);
3618 3110 position: absolute;
3619 3111 top: 17px;
3620 3112 right: -28%;
3621 3113 }
3622 3114
3623 -.frm_grid_container > p,
3624 3115 .frm_grid_container > p.frm_form_field,
3625 3116 .frm_grid_container > div.frm_form_field,
3626 3117 #new_fields .frm_grid_container > p {
3627 - margin-top: 8px;
3628 - margin-bottom: 8px;
3118 + margin-top: 7px;
3119 + margin-bottom: 7px;
3629 3120 margin-right: 0;
3630 3121 }
3631 3122
3632 3123 #new_fields div.frm_grid_container > .frm_primary_label {
3633 - margin-top: 8px;
3124 + margin-top: 7px;
3634 3125 }
3635 3126
3636 3127 #new_fields .frm_primary_label + p,
3637 3128 #new_fields .frm_primary_label + .frm6 + .frm6,
@@ -3665,9 +3156,9 @@
3665 3156 }
3666 3157
3667 3158 .frm_form_builder .frm_radio label,
3668 3159 .frm_form_builder .frm_checkbox label {
3669 - font-size: var(--text-sm);
3160 + font-size: 14px;
3670 3161 }
3671 3162
3672 3163 /* Start copied front-end CSS */
3673 3164 .horizontal_radio .frm_radio,
@@ -3705,64 +3196,22 @@
3705 3196
3706 3197 .frm_wrap .with_frm_style .frm_checkbox input[type=checkbox],
3707 3198 .frm_wrap .with_frm_style .frm_radio input[type=radio],
3708 3199 .frm_wrap input[type=checkbox],
3709 -.frm-white-body input[type=checkbox],
3710 3200 .field-group input[type=checkbox],
3711 3201 .frm_scale input[type=radio],
3712 3202 .frm_radio input[type=radio],
3713 3203 .frm_checkbox input[type=checkbox] {
3714 - border: 1px solid var(--grey-300);
3204 + border: 1px solid var(--grey-border);
3715 3205 box-shadow: none;
3716 3206 -webkit-appearance: none;
3717 3207 }
3718 3208
3719 -
3720 -.frm_wrap .with_frm_style .frm_checkbox input[type=checkbox],
3721 -.frm_wrap input[type=checkbox],
3722 -.frm-white-body input[type=checkbox],
3723 -.field-group input[type=checkbox],
3724 -.frm_checkbox input[type=checkbox] {
3725 - border-radius: 4px;
3726 -}
3727 -
3728 -.frm-white-body input[type="checkbox"]:checked,
3729 -.frm_wrap input[type="checkbox"]:checked {
3730 - background-color: var(--primary-500);
3731 - border-color: var(--primary-500) !important;
3732 -}
3733 -
3734 -.frm-white-body input[type="checkbox"]:checked:focus,
3735 -.frm_wrap input[type="checkbox"]:checked:focus {
3736 - border-color: var(--primary-500);
3737 -}
3738 -
3739 -.frm-white-body input[type="checkbox"]:checked::before,
3740 -.frm_wrap input[type="checkbox"]:checked::before {
3741 - content: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2010%2010%27%3E%3Cpath%20d%3D%27M9.2%202c.2.3.2.7%200%201l-5%205c-.3.2-.6.2-.9%200L.8 5.3a.6.6%200%200%201%20.9-.8l2%202%204.6-4.5c.3-.3.6-.3.9%200Z%27%20fill%3D%27%23fff%27%2F%3E%3C%2Fsvg%3E");
3742 - height: 12px;
3743 - width: 12px;
3744 - margin: 1px;
3745 -}
3746 -
3747 3209 .frm_radio input[type="radio"],
3748 3210 .frm_checkbox input[type="checkbox"] {
3749 3211 margin-right: 5px;
3750 3212 }
3751 3213
3752 -.frm_single_entry_page .with_frm_style .frm_radio input[type=radio] {
3753 - margin: 5px 0;
3754 - width: 18px;
3755 - position: relative; /* override Bootstrap */
3756 -}
3757 -
3758 -.frm_single_entry_page .with_frm_style .frm_radio input[type=radio]:before {
3759 - position: relative !important;
3760 - left: calc(50% - 6px);
3761 - top: calc(50% - 6px);
3762 - margin: 0 !important;
3763 -}
3764 -
3765 3214 .frm_inner_field_container {
3766 3215 margin-bottom: 10px;
3767 3216 }
3768 3217
@@ -3788,22 +3237,8 @@
3788 3237 li.ui-state-default.selected > .frm_inner_field_container > label {
3789 3238 max-width: calc(100% - 100px);
3790 3239 }
3791 3240
3792 -.frm-drag-fade {
3793 - background-color: var(--lightest-grey) !important;
3794 - border-radius: 4px;
3795 -}
3796 -
3797 -.frm-drag-fade * {
3798 - opacity: 0;
3799 -}
3800 -
3801 -.frm-dragging .divider_section_only,
3802 -.frm-dragging .frm_field_box {
3803 - pointer-events: none;
3804 -}
3805 -
3806 3241 .frm_form_settings #op-popup, /* 1Password */
3807 3242 .frm_form_settings com-1password-op-button,
3808 3243 .frm_conf_below .frm_conf_field_container .frm_primary_label,
3809 3244 .frm_conf_inline .frm_inner_field_container .frm-show-click a,
@@ -3938,15 +3373,15 @@
3938 3373 animation: spin 2s linear infinite;
3939 3374 }
3940 3375
3941 3376 .frm-wait:before {
3942 - border-bottom-color: var(--primary-700);
3943 - border-right-color: var(--primary-700);
3377 + border-bottom-color: var(--primary-hover);
3378 + border-right-color: var(--primary-hover);
3944 3379 }
3945 3380
3946 3381 .frm_loading_button.frm-button-secondary:before {
3947 - border-bottom-color: var(--primary-500);
3948 - border-right-color: var(--primary-500);
3382 + border-bottom-color: var(--primary-color);
3383 + border-right-color: var(--primary-color);
3949 3384 }
3950 3385
3951 3386 input[type=submit]:focus {
3952 3387 outline: none !important;
@@ -3970,9 +3405,9 @@
3970 3405 #editorcontainer #dyncontent {
3971 3406 margin: 0;
3972 3407 width: 100%;
3973 3408 padding: 6px;
3974 - line-height: var(--leading);
3409 + line-height: 1.5;
3975 3410 border: 0 none;
3976 3411 outline: none;
3977 3412 -moz-box-sizing: border-box;
3978 3413 -webkit-box-sizing: border-box;
@@ -4018,9 +3453,9 @@
4018 3453 font-size: 12px;
4019 3454 }
4020 3455
4021 3456 .frm_border_bottom {
4022 - border-bottom: 1px solid var(--grey-300);
3457 + border-bottom: 1px solid var(--grey-border);
4023 3458 margin-bottom: 10px;
4024 3459 padding-bottom: 10px;
4025 3460 }
4026 3461
@@ -4031,8 +3466,9 @@
4031 3466 .frm_posttax_opt_list .frm_border_bottom input {
4032 3467 margin-right: 1px;
4033 3468 }
4034 3469
3470 +.frm_logic_row,
4035 3471 .frm_add_remove div.frm_form_field {
4036 3472 padding-bottom: 5px;
4037 3473 }
4038 3474
@@ -4089,47 +3525,18 @@
4089 3525 max-width: 100%;
4090 3526 font-size: inherit;
4091 3527 }
4092 3528
4093 -/* Start entry statuses */
4094 -.frm-entry-status {
4095 - padding: var(--gap-2xs) var(--gap-xs);
4096 - align-items: center;
4097 - border-radius: var(--small-radius);
4098 - text-transform: uppercase;
4099 -}
4100 -
4101 -.frm-entry-status-0 {
4102 - color: #1E561F;
4103 - background: #D5F2DC;
4104 -}
4105 -
4106 -.frm-entry-status-1 {
4107 - color: #7A4D05;
4108 - background: #FFF2D2;
4109 -}
4110 -/* End entry statuses */
4111 -
4112 3529 #frm-options-panel {
4113 - padding: 0 var(--gap-sm);
4114 - color: var(--grey-900);
3530 + padding: 0 15px;
3531 + color: var(--darkest-grey);
4115 3532 }
4116 3533
4117 -.frm-right-panel a.frm_add_logic_link,
4118 3534 #frm-options-panel h3 {
4119 3535 padding: 15px 0;
4120 3536 margin-top: -2px;
4121 3537 }
4122 3538
4123 -.frm-right-panel a.frm_add_logic_link:focus {
4124 - outline: auto;
4125 -}
4126 -
4127 -#frm_style_sidebar h3,
4128 -#frm_view_editor_left.frm-right-panel .accordion-section-title {
4129 - padding: 15px 0;
4130 -}
4131 -
4132 3539 .frm_field_key {
4133 3540 background-color: #F7F7F7;
4134 3541 }
4135 3542
@@ -4163,12 +3570,8 @@
4163 3570 .frm-alt-table tr:nth-child(even) {
4164 3571 background-color: var(--sidebar-color);
4165 3572 }
4166 3573
4167 -.frm-alt-table h3 {
4168 - margin-bottom: 0;
4169 -}
4170 -
4171 3574 .form-field .frm_cb_button {
4172 3575 height: 22px;
4173 3576 line-height: 20px;
4174 3577 margin-bottom: 10px;
@@ -4273,9 +3676,9 @@
4273 3676 li.sortable-placeholder {
4274 3677 border: none;
4275 3678 margin: 0;
4276 3679 visibility: visible !important;
4277 - box-shadow: 2px -10px 0 2px var(--primary-500);
3680 + box-shadow: 2px -10px 0 1px var(--primary-color);
4278 3681 }
4279 3682
4280 3683 #frm_form_editor_container > ul > .frm_single_option.ui-sortable-placeholder,
4281 3684 #frm_form_editor_container > ul > li.sortable-placeholder {
@@ -4286,8 +3689,9 @@
4286 3689 #frm_form_editor_container > ul > li > ul {
4287 3690 position: relative;
4288 3691 }
4289 3692
3693 +#frm_form_editor_container > ul > li > ul > .frm_single_option.ui-sortable-placeholder,
4290 3694 #frm_form_editor_container > ul > li > ul > li.sortable-placeholder,
4291 3695 #frm_form_editor_container ul.start_divider > li > ul > li.sortable-placeholder {
4292 3696 position: absolute;
4293 3697 top: 20px;
@@ -4294,29 +3698,38 @@
4294 3698 bottom: 0;
4295 3699 }
4296 3700
4297 3701 .edit_field_type_divider + li.sortable-placeholder {
4298 - box-shadow: 2px 5px 0 2px var(--primary-500);
3702 + box-shadow: 2px 5px 0 1px var(--primary-color);
4299 3703 }
4300 3704
4301 3705 .start_divider li.sortable-placeholder {
4302 - box-shadow: 2px -5px 0 2px var(--primary-500);
3706 + box-shadow: 2px -5px 0 1px var(--primary-color);
4303 3707 }
4304 3708
4305 -.frm-is-collapsed + .sortable-placeholder {
4306 - box-shadow: 2px 15px 0 2px var(--primary-500);
3709 +.frm_single_option.ui-sortable-placeholder {
3710 + box-shadow: 0 0 1px 1px var(--primary-color);
4307 3711 }
4308 3712
4309 -.frm_single_option.ui-sortable-placeholder {
4310 - box-shadow: 0 0 1px 1px var(--primary-500);
3713 +.frm-is-collapsed + .sortable-placeholder {
3714 + box-shadow: 2px 15px 0 1px var(--primary-color);
4311 3715 }
4312 3716
4313 3717 .frm_sorting > li.edit_field_type_end_divider:first-child,
3718 +.frm_sorting > .frmbutton + .sortable-placeholder, /* hide for first field */
3719 +.no-drop-placeholder,
4314 3720 .frm-show-click,
4315 3721 li.ui-state-default.edit_field_type_divider .frm-show-click {
4316 3722 display: none;
4317 3723 }
4318 3724
3725 +.frm_form_field.ui-sortable-helper {
3726 + height: 30px !important;
3727 + background-color: #fff !important;
3728 + overflow: hidden !important;
3729 + box-sizing: border-box;
3730 +}
3731 +
4319 3732 .frm_form_field.ui-sortable-helper .frm-field-action-icons,
4320 3733 .frm_form_field.ui-sortable-helper .frm_form_fields,
4321 3734 .frm_form_field.ui-sortable-helper .frm_description,
4322 3735 .frm_form_field.ui-sortable-helper .description {
@@ -4359,8 +3772,16 @@
4359 3772 #new_fields .frm_single_option input[type=text] {
4360 3773 width: calc(100% - 73px);
4361 3774 }
4362 3775
3776 +.frm-right-panel.styling_settings .frm_image_preview_wrapper {
3777 + width: 100%;
3778 +}
3779 +
3780 +.frm-right-panel.styling_settings .frm_image_preview_wrapper .frm_choose_image_box {
3781 + margin-left: 0;
3782 +}
3783 +
4363 3784 .frm-right-panel .frm_single_option a.frm_remove_tag,
4364 3785 .frm_single_option a {
4365 3786 padding-left: 7px;
4366 3787 }
@@ -4418,10 +3839,10 @@
4418 3839 /* Image options for Radio and Checkbox */
4419 3840
4420 3841 .frm_image_options .frm_image_option_container {
4421 3842 --field-border-width: 1px;
4422 - --border-color: var(--grey-300);
4423 - --border-color-active: var(--primary-500);
3843 + --border-color: var(--grey-border);
3844 + --border-color-active: var(--primary-color);
4424 3845 --border-radius: var(--small-radius);
4425 3846 }
4426 3847
4427 3848 .frm_image_option_container svg {
@@ -4475,10 +3896,10 @@
4475 3896 height: 75px;
4476 3897 object-fit: cover;
4477 3898 }
4478 3899
4479 -.frm_list_entry_page img {
4480 - max-width: 100%;
3900 +.frm_list_entry_page .frm_file_link img {
3901 + max-width: 75px;
4481 3902 height: auto;
4482 3903 }
4483 3904
4484 3905 .frm_image_option_container .frm_empty_url {
@@ -4522,13 +3943,13 @@
4522 3943 margin-top: 17px;
4523 3944 }
4524 3945
4525 3946 .frm_image_data {
4526 - margin-left: var(--gap-xs);
3947 + margin-left: 10px;
4527 3948 display: flex;
4528 3949 flex-direction: column;
4529 - font-size: var(--text-sm);
4530 - justify-content: space-around;
3950 + font-size: 14px;
3951 + line-height: 17px;
4531 3952 }
4532 3953
4533 3954 .frm_image_styling_frame {
4534 3955 display: flex;
@@ -4552,9 +3973,10 @@
4552 3973 max-width: 54px;
4553 3974 }
4554 3975
4555 3976 .frm_image_preview_title{
4556 - color: var(--grey-500);
3977 + margin-top: 6px;
3978 + color: rgba(40, 47, 54, 0.65);
4557 3979 overflow: hidden;
4558 3980 white-space: nowrap;
4559 3981 text-overflow: ellipsis;
4560 3982 }
@@ -4560,9 +3982,9 @@
4560 3982 }
4561 3983
4562 3984 .frm_wrap .frm_choose_image_box {
4563 3985 cursor: pointer;
4564 - color: var(--grey-700);
3986 + color: var(--dark-grey);
4565 3987 background-color: #F2F2F2;
4566 3988 margin-left: 24px;
4567 3989 text-align: center;
4568 3990 width: 100%;
@@ -4571,11 +3993,13 @@
4571 3993 .frm_wrap .frm_choose_image_box:hover {
4572 3994 background: #fff;
4573 3995 }
4574 3996
3997 +a.frm_remove_image_option .frmsvg,
4575 3998 a.frm_remove_image_option,
4576 3999 .frm_remove_image_option {
4577 - color: var(--grey-400);
4000 + margin-top: 9px;
4001 + color: rgba(40, 47, 54, 0.4);
4578 4002 cursor: pointer;
4579 4003 }
4580 4004
4581 4005 a.frm_remove_image_option:hover .frmsvg,
@@ -4585,10 +4009,17 @@
4585 4009 }
4586 4010
4587 4011 /* Form settings */
4588 4012
4013 +#form_settings_page label,
4014 +.frm_form_builder label {
4015 + font-weight: normal;
4016 + font-size: 15px;
4017 + color: var(--dark-grey);
4018 +}
4019 +
4589 4020 .frm-form-setting-tabs {
4590 - margin-top: var(--gap-sm) !important;
4021 + margin-top: 20px !important;
4591 4022 }
4592 4023
4593 4024 .frm-right-panel > .postbox {
4594 4025 background-color: transparent;
@@ -4599,44 +4030,40 @@
4599 4030
4600 4031 .frm-right-panel .postbox.frm_with_icons .inside,
4601 4032 .frm-right-panel .postbox .inside,
4602 4033 .frm-right-panel .inside {
4603 - font-size: var(--text-md);
4034 + font-size: 16px;
4604 4035 padding: 15px 20px 20px;
4605 - color: var(--grey-700);
4036 + color: var(--dark-grey);
4606 4037 }
4607 4038
4608 4039 .frm-right-panel .misc-pub-section {
4609 - padding: var(--gap-xs) 0;
4040 + padding: 10px 0;
4041 + line-height: 1.4em;
4610 4042 position: relative;
4611 4043 }
4612 4044
4613 4045 .frm-right-panel .inside a,
4614 4046 .frm-form-setting-tabs a {
4615 - font-size: var(--text-md);
4616 - color: var(--grey-700);
4617 - padding: var(--gap-sm);
4047 + font-size: 16px;
4048 + color: var(--dark-grey);
4049 + padding: 15px 15px 15px 20px;
4618 4050 display: block;
4619 4051 }
4620 4052
4621 -.frm-form-setting-tabs a {
4622 - color: var(--grey-900);
4623 - padding: var(--gap-sm) var(--gap-md);
4624 -}
4625 -
4626 4053 .frm-right-panel .inside a {
4627 4054 padding: 0;
4628 - color: var(--primary-500);
4055 + color: var(--primary-color);
4629 4056 display: inline-block;
4630 4057 }
4631 4058
4632 4059 .frm-right-panel .inside a:hover {
4633 - color: var(--primary-700);
4060 + color: var(--primary-hover);
4634 4061 }
4635 4062
4636 4063 .frm-form-setting-tabs a:hover {
4637 4064 background: var(--sidebar-hover);
4638 - color: var(--grey-900);
4065 + color: var(--dark-grey);
4639 4066 }
4640 4067
4641 4068 .frm-right-panel .inside i,
4642 4069 .frm-right-panel .inside .frmsvg,
@@ -4645,20 +4072,16 @@
4645 4072 margin: 0 5px;
4646 4073 display: inline-block;
4647 4074 width: 20px;
4648 4075 height: 20px;
4649 - color: var(--grey-500);
4076 + color: var(--grey);
4650 4077 }
4651 4078
4652 -.frm-form-setting-tabs a .frmsvg {
4653 - margin: 0;
4654 -}
4655 -
4656 4079 .frm-right-panel .inside a:hover i,
4657 4080 .frm-right-panel .inside a:hover .frmsvg,
4658 4081 .frm-form-setting-tabs a:hover .frmsvg,
4659 4082 .frm-form-setting-tabs a:hover span {
4660 - color: var(--grey-700);
4083 + color: var(--dark-grey);
4661 4084 }
4662 4085
4663 4086 .frm_settings_form .tabs-panel {
4664 4087 padding: 0 25px;
@@ -4672,9 +4095,9 @@
4672 4095
4673 4096 #frm_adv_info .tabs-panel {
4674 4097 min-height: 0 !important;
4675 4098 overflow-x: hidden;
4676 - padding: 0;
4099 + padding: 0 20px;
4677 4100 border: none;
4678 4101 background: transparent;
4679 4102 }
4680 4103
@@ -4683,130 +4106,48 @@
4683 4106 }
4684 4107
4685 4108 .frm_posttax_opt_list,
4686 4109 .frm_submit_logic_rows {
4687 - border: 1px solid var(--grey-300);
4688 - padding: var(--gap-md);
4110 + border: 1px solid var(--grey-border);
4111 + padding: 25px;
4689 4112 border-radius: var(--small-radius);
4690 - margin: 5px 0 5px var(--gap-md);
4113 + margin: 5px 0 5px 25px;
4691 4114 }
4692 4115
4693 -.frm_submit_logic_rows .frm_grid_container > p.frm_form_field {
4694 - margin: 0;
4695 -}
4696 -
4697 -/* Color picker CSS */
4698 -.frm-right-panel .wp-picker-open + .wp-picker-input-wrap {
4116 +/* Admin toggle */
4117 +.frm_toggle_off,
4118 +.frm_toggle_on {
4119 + display: none;
4120 + color: #fff;
4121 + z-index: 999;
4699 4122 position: absolute;
4700 - margin-left: calc( ( 100% - 35px ) * -1 );
4701 - margin-top: 1px;
4702 - width: calc( 100% - 36px );
4123 + font-size: 10px;
4124 + line-height: 20px;
4125 + left: 6px;
4703 4126 }
4704 4127
4705 -.frm-right-panel .wp-picker-container input[type="text"].wp-color-picker {
4706 - border: none;
4707 - padding: 5px 8px;
4708 - font-family: inherit;
4709 - color: var(--grey-700);
4710 - font-size: var(--text-md);
4711 - width: 100%;
4712 - line-height: var(--leading);
4713 -}
4714 -
4715 -.frm-right-panel .wp-picker-input-wrap .wp-picker-clear {
4716 - display: none !important;
4717 -}
4718 -
4719 -.frm-right-panel .wp-picker-holder {
4720 - position: absolute;
4721 - z-index: 999;
4722 -}
4723 -
4724 -.frm-right-panel .wp-picker-input-wrap label {
4725 - margin-bottom: 0;
4726 -}
4727 -
4728 -.frm-right-panel .wp-picker-container .wp-color-result.button {
4729 - width: 100%;
4730 - overflow: hidden;
4731 - margin: 0 !important;
4732 - height: var(--h-md) !important;
4733 - padding: 0 0 0 var(--gap-lg) !important;
4734 - border-radius: var(--small-radius);
4735 - border-color: var(--grey-300);
4736 -}
4737 -
4738 -.frm-right-panel .wp-color-result-text {
4739 - line-height: var(--leading) !important;
4740 - font-size: var(--text-md);
4741 - background: #fff !important;
4742 - color: var(--grey-900);
4743 - padding: 5px 8px;
4744 - border-color: var(--grey-300);
4745 - text-align: left;
4746 -}
4747 -
4748 -.frm-right-panel .color-alpha {
4749 - width: var(--gap-lg) !important;
4750 -}
4751 -
4752 -.frm_grid_container .wp-picker-container {
4753 - width: 100%;
4754 - position: relative;
4755 -}
4756 -
4757 -.wp-picker-container button.wp-color-result {
4758 - border: 1px solid var(--grey-300) !important;
4759 -}
4760 -
4761 -.wp-picker-container .wp-picker-input-wrap input.hex.wp-color-picker {
4762 - max-width: 100%;
4763 - position: relative;
4764 -}
4765 -
4766 -.frm_end .wp-picker-holder {
4767 - margin-left: -145px;
4768 -}
4769 -
4770 -.frm_end.frm6 .wp-picker-holder {
4771 - margin-left: -86px;
4772 -}
4773 -/* End of color picker CSS */
4774 -
4775 -/*
4776 -These are the styles for the "Enable Formidable styling" toggle in the visual styler.
4777 -To use this element, you can call the FrmHtmlHelper::toggle function.
4778 -*/
4779 -.frm_toggle_opt {
4780 - padding: 0;
4781 - white-space: normal;
4128 +.frm_toggle_off {
4782 4129 display: inline;
4783 - vertical-align: middle;
4784 - font-weight: normal;
4130 + left: auto;
4131 + right: 5px;
4132 + color: var(--dark-grey);
4785 4133 }
4786 4134
4787 -.frm_on_label,
4788 -.frm_off_label {
4789 - color: #444444;
4790 -}
4791 -
4792 4135 .frm_toggle {
4793 4136 position: relative;
4794 4137 display: inline-block;
4795 - width: 40px;
4796 - height: var(--h-xs);
4138 + width: 45px;
4139 + height: 20px;
4797 4140 vertical-align: middle;
4141 + margin: 2px;
4798 4142 }
4799 4143
4800 -.frm_toggle_block {
4801 - display: inline-flex;
4802 - gap: var(--gap-sm);
4803 - align-items: center;
4144 +label > span.frm_toggle {
4145 + margin-right: 15px;
4804 4146 }
4805 4147
4806 -.frm_toggle input, /* Reverse compatibility */
4807 -.frm_toggle_block input {
4808 - display:none !important;
4148 +.frm_toggle input {
4149 + display: none !important;
4809 4150 }
4810 4151
4811 4152 .frm_toggle_slider {
4812 4153 position: absolute;
@@ -4814,44 +4155,26 @@
4814 4155 top: 0;
4815 4156 left: 0;
4816 4157 right: 0;
4817 4158 bottom: 0;
4818 - background-color: var(--grey-border);
4819 4159 transition: .4s;
4820 4160 border-radius: 30px;
4161 + background-color: #fff;
4162 + box-shadow: 0 0 0 2px var(--grey);
4821 4163 }
4822 4164
4823 4165 .frm_toggle_slider:before {
4824 4166 border-radius: 50%;
4825 4167 position: absolute;
4826 - content: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 height=%2711px%27 width=%2711px%27 viewBox=%270 0 20 20%27><path d=%27M16.8 4.5l-1.3-1.3L10 8.6 4.5 3.2 3.2 4.5 8.6 10l-5.4 5.5 1.3 1.3 5.5-5.4 5.5 5.4 1.3-1.3-5.4-5.5 5.4-5.5z%27 fill=%27%2398A2B3%27/%3E</svg>");
4827 - height: 22px;
4828 - width: 22px;
4829 - padding: 0 5.5px;
4830 - left: 1px;
4831 - bottom: 1px;
4832 - background-color: white;
4833 - transition: .4s;
4834 - box-sizing: border-box;
4835 - box-shadow: var(--box-shadow-md);
4836 - font-size: 21px;
4837 - line-height: 18px;
4168 + content: "";
4169 + height: 16px;
4170 + width: 16px;
4171 + left: 2px;
4172 + top: 2px;
4173 + transition: .3s;
4174 + background-color: var(--grey);
4838 4175 }
4839 4176
4840 -input:checked + .frm_toggle .frm_toggle_slider {
4841 - background-color: var(--primary-500);
4842 -}
4843 -
4844 -input:focus + .frm_toggle .frm_toggle_slider {
4845 - box-shadow: var(--box-shadow-md);
4846 -}
4847 -
4848 -input:checked + .frm_toggle .frm_toggle_slider:before {
4849 - padding: 0 6px;
4850 - transform: translateX(16px);
4851 - content: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 height=%2711px%27 width=%2711px%27 viewBox=%270 0 10 10%27><path d=%27M9.2 2c.2.3.2.7 0 1l-5 5c-.3.2-.6.2-.9 0L.8 5.3a.6.6 0 0 1 .9-.8l2 2 4.6-4.5c.3-.3.6-.3.9 0Z%27 fill=%27%234199FD%27/%3E</svg>");
4852 -}
4853 -
4854 4177 input[disabled] + .frm_toggle_slider {
4855 4178 pointer-events: none;
4856 4179 cursor: text;
4857 4180 opacity: .5;
@@ -4856,53 +4179,16 @@
4856 4179 cursor: text;
4857 4180 opacity: .5;
4858 4181 }
4859 4182
4860 -.frm_toggle_opt ~ .frm_toggle .frm_toggle_slider:before {
4861 - content: '' !important; /* Don't show x/check if off label included or on builder page */
4862 -}
4863 -
4864 -.rtl .frm_toggle_opt {
4865 - padding: 0 8px;
4866 -}
4867 -
4868 -.rtl .frm_toggle_slider:before {
4869 - left: 17px;
4870 -}
4871 -
4872 -.rtl input:checked + .frm_toggle .frm_toggle_slider:before {
4873 - transform: none!important;
4874 - left: 1px;
4875 -}
4876 -
4877 -/* Deprecated admin toggle */
4878 -.frm_toggle_off,
4879 -.frm_toggle_on {
4880 - display: none;
4881 - color: #fff;
4882 - z-index: 999;
4883 - position: absolute;
4884 - font-size: 10px;
4885 - line-height: 20px;
4886 - left: 6px;
4887 -}
4888 -
4889 -.frm_toggle_off {
4890 - display: inline;
4891 - left: auto;
4892 - right: 5px;
4893 - color: var(--dark-grey);
4894 -}
4895 -
4896 4183 .frm_toggle_long {
4897 - width: 80% !important;
4184 + width: 80%;
4898 4185 height: 28px;
4899 - display: inline-block !important;
4900 4186 }
4901 4187
4902 4188 .frm_toggle_long .frm_toggle_slider {
4903 - background: var(--primary-700);
4904 - box-shadow: 0 0 0 2px var(--primary-700);
4189 + background: var(--primary-hover);
4190 + box-shadow: 0 0 0 2px var(--primary-hover);
4905 4191 }
4906 4192
4907 4193 .frm_toggle_long .frm_toggle_off,
4908 4194 .frm_toggle_long .frm_toggle_on {
@@ -4927,11 +4213,20 @@
4927 4213 border-radius: var(--border-radius) 0 0 var(--border-radius);
4928 4214 height: 100%;
4929 4215 background-color: #fff;
4930 4216 color: var(--primary-color);
4931 - content: '' !important;
4932 4217 }
4933 4218
4219 +input:checked + .frm_toggle_slider {
4220 + background-color: var(--primary-hover);
4221 + box-shadow: 0 0 0 2px var(--primary-hover);
4222 +}
4223 +
4224 +input:checked + .frm_toggle_slider:before {
4225 + transform: translateX(25px);
4226 + background-color: #fff;
4227 +}
4228 +
4934 4229 .frm_toggle_long input:checked + .frm_toggle_slider:before {
4935 4230 transform: translateX(101%);
4936 4231 border-radius: 0 var(--border-radius) var(--border-radius) 0;
4937 4232 }
@@ -4946,9 +4241,9 @@
4946 4241
4947 4242 .frm_toggle_long .frm_toggle_on,
4948 4243 .frm_toggle_long input:checked + .frm_toggle_slider + .frm_toggle_on + .frm_toggle_off {
4949 4244 display: inline;
4950 - color: var(--primary-500);
4245 + color: var(--primary-color);
4951 4246 font-weight: normal;
4952 4247 }
4953 4248
4954 4249 .frm_toggle_long .frm_toggle_off,
@@ -4956,9 +4251,11 @@
4956 4251 color: #fff;
4957 4252 font-weight: bold;
4958 4253 }
4959 4254
4960 -/* End toggle styling */
4255 +input:focus + .frm_toggle_slider {
4256 + box-shadow: 0 0 1px #008ec2;
4257 +}
4961 4258
4962 4259 /* Global Settings */
4963 4260
4964 4261 .tabs-panel {
@@ -4976,59 +4273,21 @@
4976 4273 margin-right: 20px !important;
4977 4274 display: inline-block !important;
4978 4275 }
4979 4276
4980 -#frm_stripe_icon {
4981 - border-radius: 5px;
4982 -}
4983 -
4984 -#captcha_settings .frm_primary_label {
4985 - margin-top: var(--gap-sm);
4986 -}
4987 -
4988 -.frm-long-icon-buttons {
4989 - display: flex;
4990 - gap: var(--gap-md);
4991 -}
4992 -
4993 -.frm-long-icon-buttons > label {
4994 - border: 1px solid var(--grey-300);
4995 - color: var(--grey-700);
4996 - border-radius: var(--small-radius);
4997 - display: flex;
4998 - padding: var(--gap-sm);
4999 - gap: var(--gap-sm);
5000 - justify-content: center;
5001 - align-items: center;
5002 - width: calc( 33% - var(--gap-sm) );
5003 - box-sizing: border-box;
5004 -}
5005 -
5006 -.frm-long-icon-buttons > label:hover {
5007 - color: var(--primary-500);
5008 -}
5009 -
5010 -.frm-long-icon-buttons input[type=radio] {
5011 - display: none;
5012 -}
5013 -
5014 -.frm-long-icon-buttons input[type=radio]:checked + label {
5015 - border-color: var(--primary-500);
5016 - box-shadow: 0 0 0 1px var(--primary-color);
5017 -}
5018 -
5019 -.frm-long-icon-buttons label > svg {
5020 - height: 21px;
5021 -}
5022 -
5023 4277 .frm-example-icon .frmsvg,
5024 4278 .frm-example-icon i {
5025 4279 height: 20px;
5026 4280 width: 20px;
5027 4281 font-size: 20px;
5028 - color: var(--grey-700);
4282 + color: var(--dark-grey);
5029 4283 }
5030 4284
4285 +.edd_frm_license_row {
4286 + clear: both;
4287 + line-height: 2em;
4288 +}
4289 +
5031 4290 .frm_license_msg {
5032 4291 margin-top: 0;
5033 4292 }
5034 4293
@@ -5055,14 +4314,23 @@
5055 4314
5056 4315 .frm_no_items {
5057 4316 margin: 0 auto 50px;
5058 4317 text-align: center;
5059 - color: var(--grey-700);
4318 + color: var(--dark-grey);
5060 4319 max-width: 500px;
5061 4320 }
5062 4321
4322 +.frm_no_items h2 {
4323 + font-size: 25px;
4324 + margin-bottom: 30px !important;
4325 +}
4326 +
4327 +.frm_no_items p {
4328 + font-size: 14px;
4329 +}
4330 +
5063 4331 .frm-subscribe {
5064 - margin: var(--gap-lg) 0;
4332 + margin: 30px 0;
5065 4333 }
5066 4334
5067 4335 /* Inbox */
5068 4336
@@ -5072,16 +4340,16 @@
5072 4340
5073 4341 .frm_inbox_card {
5074 4342 display: grid;
5075 4343 grid-template-columns: 72px 1fr;
5076 - grid-gap: var(--gap-xs);
5077 - border-bottom: 1px solid var(--grey-300);
5078 - padding: var(--gap-md);
4344 + grid-gap: 15px;
4345 + border-bottom: 1px solid var(--grey-border);
4346 + padding: 25px;
5079 4347 }
5080 4348
5081 4349 .frm_inbox_card_icon {
5082 4350 grid-row: span 3 / span 3;
5083 - padding-top: var(--gap-xs);
4351 + padding-top: 20px;
5084 4352 text-align: center
5085 4353 }
5086 4354
5087 4355 .frm_inbox_card_icon svg {
@@ -5100,8 +4368,11 @@
5100 4368 border: none;
5101 4369 text-transform: none;
5102 4370 margin: 0;
5103 4371 padding: 0;
4372 + font-weight: 600;
4373 + color: var(--medium-grey);
4374 + font-size: 16px;
5104 4375 }
5105 4376
5106 4377 .frm_inbox_date {
5107 4378 text-align: right;
@@ -5129,8 +4400,37 @@
5129 4400 margin-left: 2px;
5130 4401 vertical-align: text-bottom;
5131 4402 }
5132 4403
4404 +/* Styles tabs */
4405 +
4406 +#frm_styling_form #frm_delete_style {
4407 + padding-right: 10px;
4408 +}
4409 +
4410 +#frm_styling_form #frm_delete_style .frmsvg {
4411 + vertical-align: -webkit-baseline-middle;
4412 +}
4413 +
4414 +.frm_pro_form .frm_form_field.frm_lite_style,
4415 +.frm_pro_form .frm_lite_style {
4416 + display: none !important;
4417 +}
4418 +
4419 +label.default-style-box input[type="checkbox"] {
4420 + vertical-align: middle;
4421 +}
4422 +
4423 +#frm_styling_form .frm_form_field input[type="checkbox"],
4424 +#frm_styling_form .frm_form_field input[type="radio"] {
4425 + vertical-align: bottom;
4426 +}
4427 +
4428 +#frm_styling_form .howto span {
4429 + float: none;
4430 + margin-top: 0;
4431 +}
4432 +
5133 4433 /* Import/Export */
5134 4434 .csv_opts #frm_csv_col_sep {
5135 4435 width: 45px;
5136 4436 }
@@ -5181,9 +4481,9 @@
5181 4481 padding: 0;
5182 4482 }
5183 4483
5184 4484 .frm-feature-banner {
5185 - background: var(--grey-700);
4485 + background: var(--dark-grey);
5186 4486 color: #fff;
5187 4487 border-radius: var(--small-radius);
5188 4488 padding: 20px;
5189 4489 margin: 10px 0;
@@ -5189,9 +4489,9 @@
5189 4489 margin: 10px 0;
5190 4490 }
5191 4491
5192 4492 .frm-feature-banner p {
5193 - font-size: var(--text-sm);
4493 + font-size: 14px;
5194 4494 }
5195 4495
5196 4496 .frm-feature-banner .dismiss {
5197 4497 margin-top: -10px;
@@ -5226,31 +4526,29 @@
5226 4526 /*Form Settings Tab*/
5227 4527
5228 4528 h2.frm-h2,
5229 4529 .frm_form_settings h2 {
5230 - border-bottom: 1px solid var(--grey-300);
5231 - color: var(--grey-900);
5232 - font-weight: 400 !important;
4530 + border-bottom: 1px solid var(--grey-border);
4531 + color: var(--dark-grey);
4532 + font-size: 20px !important;
4533 + font-weight: 500 !important;
5233 4534 padding: 9px 0 5px;
5234 4535 margin: 0;
5235 4536 }
5236 4537
5237 4538 .frm_settings_form h3,
5238 -.frm_form_settings h3,
5239 -.frm_form_settings span.frm_add_logic_link {
5240 - font-size: var(--text-md);
5241 - border-top: 1px solid var(--grey-300);
5242 - padding-top: var(--gap-sm);
5243 - margin: var(--gap-sm) 0;
4539 +.frm_form_settings h3 {
4540 + font-size: 16px;
4541 + border-top: 1px solid var(--grey-border);
4542 + padding-top: 10px;
5244 4543 font-weight: normal;
5245 4544 text-transform: uppercase;
5246 4545 color: var(--medium-grey);
5247 - display: block;
5248 4546 }
5249 4547
5250 4548 .frm_form_settings .howto {
5251 - color: var(--grey-500);
5252 - font-size: var(--text-sm);
4549 + color: var(--medium-grey);
4550 + font-size: 15px;
5253 4551 margin-top: 8px;
5254 4552 }
5255 4553
5256 4554 .frm_form_settings .advanced_settings .form-table {
@@ -5265,10 +4563,18 @@
5265 4563 width: 95%;
5266 4564 }
5267 4565
5268 4566 .frm_wrap .ui-autocomplete {
4567 + box-shadow: none;
4568 + border: 1px solid var(--grey-border);
4569 + border-radius: var(--small-radius);
4570 + background: var(--lightest-grey);
4571 + position: absolute;
5269 4572 padding: 3px 0;
4573 + font-size: 15px;
5270 4574 max-height: 310px;
4575 + overflow-y: auto;
4576 + overflow-x: hidden;
5271 4577 }
5272 4578
5273 4579 .frm_wrap .ui-widget {
5274 4580 font-family: inherit;
@@ -5274,15 +4580,26 @@
5274 4580 font-family: inherit;
5275 4581 }
5276 4582
5277 4583 .frm_wrap .ui-autocomplete li {
5278 - padding: 2px 4px;
4584 + padding: 2px 10px;
5279 4585 background: none;
5280 - color: var(--grey-700);
4586 + color: var(--dark-grey);
5281 4587 border: none;
5282 4588 font-weight: normal;
5283 4589 }
5284 4590
4591 +.frm_wrap .ui-autocomplete li div.ui-state-active,
4592 +.frm_wrap .ui-autocomplete li.ui-state-focus {
4593 + background: rgb(65, 153, 253);
4594 + color: #fff;
4595 +}
4596 +
4597 +.frm_wrap .ui-autocomplete .ui-menu-item-wrapper {
4598 + padding: 2px 10px;
4599 + border-radius: var(--small-radius);
4600 +}
4601 +
5285 4602 .frm_wrap .ui-autocomplete .ui-menu-item-wrapper.ui-state-active {
5286 4603 border: none;
5287 4604 font-weight: inherit;
5288 4605 }
@@ -5321,9 +4638,9 @@
5321 4638 #frm-insert-fields-box ul.frm_code_list li.clear.frm_block {
5322 4639 height: 10px;
5323 4640 }
5324 4641
5325 -#frm_adv_info .frm_noallow {
4642 +.frm_page_container #frm_adv_info .frm_noallow {
5326 4643 display: none;
5327 4644 }
5328 4645
5329 4646 #frm_adv_info #frm-conditionals .frm_noallow {
@@ -5358,9 +4675,9 @@
5358 4675 #frm_notification_settings .widget-top .widget-action,
5359 4676 #frm_form_editor_container .widget-top .widget-action {
5360 4677 border: 0;
5361 4678 margin: 0;
5362 - padding: 8px;
4679 + padding: 10px;
5363 4680 background: 0 0;
5364 4681 cursor: pointer;
5365 4682 outline: 0;
5366 4683 }
@@ -5365,12 +4682,12 @@
5365 4682 outline: 0;
5366 4683 }
5367 4684
5368 4685 #frm_email_addon_menu {
5369 - border: 1px solid var(--grey-300);
5370 - padding: var(--gap-sm);
4686 + border: 1px solid var(--grey-border);
4687 + padding: 15px;
5371 4688 border-radius: 4px;
5372 - margin: var(--gap-md) 0 var(--gap-sm);
4689 + margin: 25px 0 15px;
5373 4690 }
5374 4691
5375 4692 #frm_email_addon_menu .frm-search {
5376 4693 float: right;
@@ -5381,12 +4698,8 @@
5381 4698 clear: none;
5382 4699 padding-top: 7px;
5383 4700 }
5384 4701
5385 -.frm_email_settings .widget .widget-top {
5386 - background-color: var(--sidebar-color);
5387 -}
5388 -
5389 4702 .frm_email_settings .widget .widget-top,
5390 4703 .frm_email_settings .widget .widget-top h3 {
5391 4704 cursor: pointer !important;
5392 4705 }
@@ -5391,17 +4704,23 @@
5391 4704 cursor: pointer !important;
5392 4705 }
5393 4706
5394 4707 .frm_email_settings .widget {
5395 - margin-bottom: var(--gap-sm);
4708 + margin-bottom: 15px;
4709 + line-height: 1.4em;
4710 + padding: 0;
5396 4711 }
5397 4712
4713 +.frm_email_settings .widget:last-of-type {
4714 + margin-bottom: 20px;
4715 +}
4716 +
5398 4717 .frm_form_action_settings .widget-top {
5399 4718 box-shadow: none;
5400 - border-color: var(--grey-300);
5401 - border-radius: var(--small-radius);
4719 + border-color: var(--grey-border);
4720 + border-radius: 4px;
5402 4721 background: var(--lightest-grey);
5403 - color: var(--grey-700);
4722 + color: var(--dark-grey);
5404 4723 }
5405 4724
5406 4725 .frm_form_action_settings:hover .widget-top {
5407 4726 border-color: var(--grey);
@@ -5413,9 +4732,9 @@
5413 4732 border-bottom: none;
5414 4733 }
5415 4734
5416 4735 .frm_form_action_settings.open:hover .widget-top {
5417 - border-color: var(--grey-300);
4736 + border-color: var(--grey-border);
5418 4737 }
5419 4738
5420 4739 .frm_form_action_settings > .widget-inside {
5421 4740 display: none;
@@ -5427,9 +4746,9 @@
5427 4746
5428 4747 .frm_form_action_settings .widget-inside {
5429 4748 min-height: 25px;
5430 4749 padding: 15px;
5431 - border-color: var(--grey-300);
4750 + border-color: var(--grey-border);
5432 4751 border-bottom-left-radius: 4px;
5433 4752 border-bottom-right-radius: 4px;
5434 4753 }
5435 4754
@@ -5437,14 +4756,14 @@
5437 4756 .frm_form_action_settings .widget-title h3 {
5438 4757 display: inline-block;
5439 4758 border-bottom: none;
5440 4759 padding: 10px 10px 5px;
5441 - font-size: var(--text-md);
4760 + font-size: 16px;
5442 4761 font-weight: 500;
5443 4762 }
5444 4763
5445 4764 #frm_email_addon_menu h3 {
5446 - margin: 0 0 var(--gap-sm);
4765 + margin: 0 0 15px;
5447 4766 clear: both;
5448 4767 }
5449 4768
5450 4769 .frm_single_api_settings p > label {
@@ -5480,9 +4799,9 @@
5480 4799 }
5481 4800
5482 4801 #frm-hide-groups,
5483 4802 #frm-show-groups {
5484 - font-size: var(--text-md);
4803 + font-size: 16px;
5485 4804 float: right;
5486 4805 }
5487 4806
5488 4807 .frm_actions_list a:active, .frm_actions_list a:focus {
@@ -5489,16 +4808,16 @@
5489 4808 outline: none;
5490 4809 }
5491 4810
5492 4811 .frm_actions_list a {
5493 - font-size: var(--text-sm);
5494 - color: var(--grey-700);
4812 + font-size: 14px;
4813 + color: var(--dark-grey);
5495 4814 word-break: break-word;
5496 4815 }
5497 4816
5498 4817 .frm_actions_list span.frm-outer-circle {
5499 4818 /* 50px total with 30px content */
5500 - background-color: var(--grey-100);
4819 + background-color: var(--sidebar-color);
5501 4820 padding: 10px;
5502 4821 text-align: center;
5503 4822 border-radius: 50%;
5504 4823 display: block;
@@ -5504,13 +4823,12 @@
5504 4823 display: block;
5505 4824 width: 30px;
5506 4825 height: 30px;
5507 4826 margin: 0 auto 15px;
5508 - line-height: 1;
5509 4827 }
5510 4828
5511 4829 .frm_email_settings .widget-title h4 {
5512 - color: var(--grey-700);
4830 + color: var(--dark-grey);
5513 4831 }
5514 4832
5515 4833 .frm_disabled_action .widget-title h4 {
5516 4834 color: var(--grey);
@@ -5526,17 +4844,16 @@
5526 4844 }
5527 4845
5528 4846 span.frm-inner-circle,
5529 4847 .frm_email_settings .widget-title .frm_form_action_icon {
5530 - background-color: var(--grey-400);
4848 + background-color: var(--grey-border);
5531 4849 border-radius: 50%;
5532 4850 display: inline-block;
5533 4851 text-align: center;
5534 - line-height: 1;
5535 4852 }
5536 4853
5537 4854 span.frm-inner-circle {
5538 - background-color: var(--primary-700);
4855 + background-color: var(--primary-hover);
5539 4856 height: 22px;
5540 4857 width: 22px;
5541 4858 padding: 4px;
5542 4859 color: #fff;
@@ -5549,9 +4866,9 @@
5549 4866 .frm_email_settings .widget-title .frm_form_action_icon {
5550 4867 height: 15px;
5551 4868 width: 15px;
5552 4869 padding: 5px;
5553 - color: #fff;
4870 + color: var(--lightest-grey);
5554 4871 vertical-align: middle;
5555 4872 }
5556 4873
5557 4874 .frm_actions_list .frmsvg,
@@ -5572,9 +4889,9 @@
5572 4889 }
5573 4890
5574 4891 span.frm-inner-circle.frm-inverse {
5575 4892 background-color: transparent;
5576 - color: var(--primary-700);
4893 + color: var(--primary-hover);
5577 4894 padding: 0;
5578 4895 height: 30px;
5579 4896 width: 100%;
5580 4897 }
@@ -5580,9 +4897,9 @@
5580 4897 }
5581 4898
5582 4899 .frm_actions_list span.frm-inverse i,
5583 4900 .frm_actions_list span.frm-inverse .frmsvg {
5584 - color: var(--primary-700);
4901 + color: var(--primary-hover);
5585 4902 height: 30px;
5586 4903 width: 30px;
5587 4904 font-size: 30px;
5588 4905 padding: 0;
@@ -5594,9 +4911,9 @@
5594 4911 font-size: 30px;
5595 4912 }
5596 4913
5597 4914 .frm_email_settings .widget-title .frm_form_action_icon.frm-inverse {
5598 - background: #fff;
4915 + background: transparent;
5599 4916 padding: 0;
5600 4917 height: 24px;
5601 4918 width: 24px;
5602 4919 }
@@ -5602,17 +4919,18 @@
5602 4919 }
5603 4920
5604 4921 .frm_email_settings .widget-title .frm_form_action_icon.frm-inverse .frmsvg,
5605 4922 .frm_email_settings .widget-title .frm_form_action_icon.frm-inverse i:before {
5606 - color: var(--grey-400);
4923 + color: var(--grey-border);
5607 4924 height: 24px;
5608 4925 width: 24px;
5609 4926 font-size: 24px;
4927 + line-height: 1em;
5610 4928 }
5611 4929
5612 4930 .frm_email_settings .widget-title:hover .frm_form_action_icon.frm-inverse .frmsvg,
5613 4931 .frm_email_settings .widget-title:hover .frm_form_action_icon.frm-inverse i:before {
5614 - color: var(--grey-500);
4932 + color: var(--grey);
5615 4933 }
5616 4934
5617 4935 .frm_email_icons {
5618 4936 padding: 10px 0 5px 6px;
@@ -5623,8 +4941,9 @@
5623 4941 margin-left: 8px;
5624 4942 color: var(--grey);
5625 4943 opacity: 0;
5626 4944 transition: all .2s ease;
4945 + vertical-align: middle;
5627 4946 }
5628 4947
5629 4948 .frm_email_icons a .frmsvg {
5630 4949 color: var(--grey);
@@ -5643,8 +4962,16 @@
5643 4962 .frm_actions_list .frm_inactive_action i {
5644 4963 opacity: .4;
5645 4964 }
5646 4965
4966 +.frm-no-margin {
4967 + margin: 0;
4968 +}
4969 +
4970 +.frm-no-border {
4971 + border: none !important;
4972 +}
4973 +
5647 4974 table td, .form-table tr td {
5648 4975 vertical-align: top;
5649 4976 }
5650 4977
@@ -5671,12 +4998,8 @@
5671 4998 #frm_notification_settings .frm_form_action_settings td p {
5672 4999 padding: 7px 0;
5673 5000 }
5674 5001
5675 -#permissions_settings_settings .frm_grid_container {
5676 - align-items: center;
5677 -}
5678 -
5679 5002 #frm_notification_settings .form-table > tbody > tr > th {
5680 5003 width: 150px;
5681 5004 font-weight: normal;
5682 5005 padding-right: 10px;
@@ -5698,8 +5021,9 @@
5698 5021 #frm_notification_settings .frm_left_label {
5699 5022 /* For add-ons that haven't been updated for 4.0 */
5700 5023 float: none;
5701 5024 width: auto !important;
5025 + line-height: 1;
5702 5026 }
5703 5027
5704 5028 .frm-fields .frm_autoresponder_rows select {
5705 5029 width: auto;
@@ -5712,17 +5036,16 @@
5712 5036 width: 100%;
5713 5037 }
5714 5038
5715 5039 #frm_notification_settings .frm_email_buttons {
5716 - padding: var(--gap-2xs);
5040 + padding: 7px;
5717 5041 background: var(--light-blue);
5718 - color: var(--primary-700);
5719 - border-radius: var(--small-radius);
5042 + color: var(--primary-hover);
5043 + border-radius: 4px;
5720 5044 border-color: var(--blue-border);
5721 - line-height: 1;
5045 + line-height: 1em;
5722 5046 height: auto;
5723 - min-height: 12px;
5724 - font-size: var(--text-xs);
5047 + font-size: 12px;
5725 5048 box-shadow: none;
5726 5049 }
5727 5050
5728 5051 .frm_reply_to_container,
@@ -5727,31 +5050,34 @@
5727 5050
5728 5051 .frm_reply_to_container,
5729 5052 .frm_bcc_cc_container {
5730 5053 float: right;
5731 - margin: -4px 0 0;
5054 + margin: -8px 0 0;
5732 5055 z-index: 1;
5733 5056 position: relative;
5734 5057 }
5735 5058
5736 5059 .frm_email_row .frm_cancel1_icon:before {
5060 + line-height: 1;
5737 5061 vertical-align: bottom;
5738 5062 }
5739 5063
5064 +.frm_action_id {
5065 + padding-top: 10px;
5066 +}
5067 +
5740 5068 .frm_logic_field_opts {
5741 5069 max-width: 35%;
5742 5070 }
5743 5071
5744 5072 .frm-inline-select,
5745 -p.frm-inline-select,
5746 5073 #frm_submit_logic_row,
5747 5074 .frm_logic_rows .frm-collapse-me {
5748 - line-height: var(--h-md) !important;
5075 + line-height: 30px;
5749 5076 }
5750 5077
5751 -.frm_logic_row {
5752 - padding: var(--gap-xs) 0 0;
5753 - align-items: center;
5078 +.frm_logic_row:first-of-type {
5079 + padding-top: 8px;
5754 5080 }
5755 5081
5756 5082 .frm-single-settings .frm_logic_row > select {
5757 5083 max-width: 32.5% !important;
@@ -5788,8 +5114,13 @@
5788 5114 margin-bottom: 0;
5789 5115 padding: 0;
5790 5116 }
5791 5117
5118 +.frm_form_settings input[type="text"] {
5119 + line-height: normal;
5120 + height: auto;
5121 +}
5122 +
5792 5123 #poststuff .widgets-holder-wrap .frm_form_action_settings .widget-inside {
5793 5124 padding-bottom: 0;
5794 5125 }
5795 5126
@@ -5798,9 +5129,9 @@
5798 5129 padding-right: 15px;
5799 5130 }
5800 5131
5801 5132 #form_global_settings h3 {
5802 - font-size: var(--text-sm);
5133 + font-size: 14px;
5803 5134 margin-top: 25px;
5804 5135 }
5805 5136
5806 5137 #form_global_settings .tabs-panel + h3 {
@@ -5815,9 +5146,9 @@
5815 5146 border-top: 1px solid #eee;
5816 5147 border-bottom: none;
5817 5148 margin: 15px -15px 0;
5818 5149 padding: 8px 15px;
5819 - font-size: var(--text-sm);
5150 + font-size: 14px;
5820 5151 }
5821 5152
5822 5153 #poststuff .frm_form_settings h3.frm_first_h3,
5823 5154 #poststuff h3.frm_first_h3 {
@@ -5828,8 +5159,20 @@
5828 5159 h3.frm_add_logic_link {
5829 5160 margin-bottom: 0 !important;
5830 5161 }
5831 5162
5163 +a.frm_add_logic_link {
5164 + display: block;
5165 + text-align: center;
5166 + margin: 10px auto;
5167 + padding: 10px;
5168 + width: 80%;
5169 + max-width: 290px;
5170 + font-size: 19px;
5171 + border: 1px solid var(--primary-color);
5172 + border-radius: var(--border-radius);
5173 +}
5174 +
5832 5175 a.frm_add_logic_link.frm_hidden {
5833 5176 display: none;
5834 5177 }
5835 5178
@@ -5849,9 +5192,9 @@
5849 5192 bottom: 0;
5850 5193 }
5851 5194
5852 5195 .frm_right_addon input {
5853 - padding-right: var(--gap-lg);
5196 + padding-right: 30px;
5854 5197 }
5855 5198
5856 5199 .frm_icon_font {
5857 5200 color: #A0A0A0;
@@ -5857,12 +5200,8 @@
5857 5200 color: #A0A0A0;
5858 5201 color: var(--grey);
5859 5202 }
5860 5203
5861 -.frm-fields label .frm_icon_font {
5862 - font-size: inherit;
5863 -}
5864 -
5865 5204 .misc-pub-revisions.frm_icon_font,
5866 5205 .misc-pub-revisions.frm_icon_font:hover {
5867 5206 color: inherit;
5868 5207 }
@@ -5949,10 +5288,10 @@
5949 5288 position: relative;
5950 5289 top: 2px;
5951 5290 }
5952 5291
5953 -.frm-field-action-icons > a {
5954 - font-size: var(--text-md);
5292 +.frm-field-action-icons a {
5293 + font-size: 16px;
5955 5294 width: 17px;
5956 5295 }
5957 5296
5958 5297 .frm-field-action-icons a:hover {
@@ -5962,26 +5301,21 @@
5962 5301 .frm-field-action-icons .dropdown {
5963 5302 display: inline-block;
5964 5303 }
5965 5304
5966 -.frm-field-action-icons > a .frmsvg {
5967 - color: var(--grey-500) !important;
5305 +.frm-field-action-icons a .frmsvg {
5306 + color: #9EA9B8 !important;
5968 5307 font-size: 17px;
5969 5308 width: 17px;
5970 5309 height: 17px;
5971 5310 }
5972 5311
5973 -.frm-field-action-icons > a .frmsvg,
5974 -.frm-field-action-icons > div > a .frmsvg {
5975 - vertical-align: baseline;
5976 -}
5977 -
5978 5312 .edit_field_type_end_divider .frm-field-action-icons {
5979 5313 display: none !important;
5980 5314 }
5981 5315
5982 5316 .frm-move {
5983 - cursor: grab;
5317 + cursor: move;
5984 5318 }
5985 5319
5986 5320 span.howto {
5987 5321 display: inline;
@@ -6027,9 +5361,9 @@
6027 5361 margin-bottom: 10px;
6028 5362 }
6029 5363
6030 5364 .frm_no_entries_form .frm_no_entries_text {
6031 - line-height: var(--leading);
5365 + line-height: 200%;
6032 5366 }
6033 5367
6034 5368 #form_entries_page #the-list .no-items {
6035 5369 height: 240px; /* Equals to the max height of search dropdown */
@@ -6058,10 +5392,9 @@
6058 5392 }
6059 5393
6060 5394 .frm_wrap .google-visualization-table-tr-head,
6061 5395 .frm_wrap .google-visualization-table-tr-head th {
6062 - white-space: pre-wrap;
6063 - font-size: var(--text-md);
5396 + font-size: 16px;
6064 5397 font-weight: 400 !important;
6065 5398 text-align: left;
6066 5399 }
6067 5400
@@ -6077,8 +5410,12 @@
6077 5410 width: 20%;
6078 5411 min-width: 175px;
6079 5412 }
6080 5413
5414 +#form_reports_page h2 {
5415 + margin-top: 2em !important;
5416 +}
5417 +
6081 5418 /* Views Page */
6082 5419 #form_views_page img.frm_no_views {
6083 5420 max-width: 100%;
6084 5421 }
@@ -6188,9 +5525,9 @@
6188 5525 }
6189 5526
6190 5527 #frm-show-fields {
6191 5528 min-height: 350px;
6192 - padding: 0 0 35px;
5529 + padding: 10px 0 35px;
6193 5530 margin: 0;
6194 5531 position: relative;
6195 5532 }
6196 5533
@@ -6197,27 +5534,13 @@
6197 5534 .frm-has-fields #frm-show-fields {
6198 5535 min-height: 50px;
6199 5536 }
6200 5537
6201 -#frm_builder_page li[data-ftype="gateway"] {
6202 - /* Gateway fields are included for add-on compatibility but we do not want it to be visible. */
6203 - display: none;
5538 +#frm-show-fields .frm6 .frm-dropdown-menu {
5539 + max-width: unset;
5540 + min-width: 160px;
6204 5541 }
6205 5542
6206 -#frm_builder_page .frm-lite-credit-card-element,
6207 -body.frm-admin-page-styles .frm-lite-credit-card-element {
6208 - position: relative;
6209 -}
6210 -
6211 -#frm_builder_page .frm-lite-credit-card-element > div,
6212 -body.frm-admin-page-styles .frm-lite-credit-card-element > div {
6213 - position: absolute;
6214 - top: calc( 50% - 1px);
6215 - transform: translateY(-50%);
6216 - right: 10px;
6217 - color: #d0d4dd;
6218 -}
6219 -
6220 5543 #frm_builder_page #frm_field_group_controls {
6221 5544 position: absolute;
6222 5545 padding: 5px;
6223 5546 border-radius: 4px 4px 0 0;
@@ -6255,16 +5578,8 @@
6255 5578 .frm-field-group-hover-target #frm_field_group_controls {
6256 5579 visibility: visible;
6257 5580 }
6258 5581
6259 -#frm_field_group_controls .dropdown-item a span {
6260 - color: var(--grey-700);
6261 -}
6262 -
6263 -#frm_field_group_controls .dropdown-item a:hover {
6264 - text-decoration: none;
6265 -}
6266 -
6267 5582 .frm_sorting .no_repeat_section li.ui-state-default.edit_field_type_end_divider {
6268 5583 display: none !important;
6269 5584 }
6270 5585
@@ -6374,16 +5689,15 @@
6374 5689 }
6375 5690
6376 5691 .frm-page-collapsed .frm_clone_icon,
6377 5692 .frm-page-collapsed .frm_delete_field,
6378 -.frm-page-collapsed .frm_clone_field,
6379 -.frm-section-collapsed .frm_clone_icon {
5693 +.frm-section-collapsed .frm_clone_icon,
5694 +.frm-section-collapsed .frm_delete_field {
6380 5695 opacity: .5;
6381 5696 cursor: not-allowed;
6382 5697 }
6383 5698
6384 -/* Hide the Duplicate summary option because we are missing the logic that also adds a new page */
6385 -.edit_field_type_summary .frm_more_options_li:nth-child(2) {
5699 +.edit_field_type_summary .frm_clone_field {
6386 5700 display: none !important;
6387 5701 }
6388 5702
6389 5703 .frm_no_section_fields:not(.frm_block) + ul.start_divider {
@@ -6415,9 +5729,9 @@
6415 5729 content: '';
6416 5730 display: block;
6417 5731 padding: 2px 0;
6418 5732 line-height: 1px;
6419 - border-top: 2px solid var(--grey-300);
5733 + border-top: 2px solid var(--grey-border);
6420 5734 top: -2px;
6421 5735 position: absolute;
6422 5736 width: 100%;
6423 5737 transition: .5s border-color ease-in-out;
@@ -6429,9 +5743,8 @@
6429 5743 }
6430 5744
6431 5745 .frm-section-collapsed .divider_section_only:hover:after,
6432 5746 li.selected.frm-section-collapsed .divider_section_only:before,
6433 -li.selected.frm-section-collapsed .divider_section_only:after,
6434 5747 .divider_section_only:hover:before,
6435 5748 li.selected .divider_section_only:before {
6436 5749 border-color: transparent;
6437 5750 }
@@ -6439,10 +5752,10 @@
6439 5752 .frm_sorting li.ui-state-default.edit_field_type_divider {
6440 5753 overflow: visible;
6441 5754 position: relative;
6442 5755 padding: 0 0 0 20px;
6443 - margin: 25px 0 0 -5px;
6444 - border-left: 1px solid var(--primary-700);
5756 + margin: 25px 0 0 -20px;
5757 + border-left: 1px solid var(--primary-hover);
6445 5758 transition: border 0.7s ease-out;
6446 5759 }
6447 5760
6448 5761 .frm-section-collapsed {
@@ -6450,9 +5763,9 @@
6450 5763 }
6451 5764
6452 5765 .frm_sorting li.edit_field_type_end_divider,
6453 5766 .frm_sorting .no_repeat_section li.ui-state-default.edit_field_type_end_divider:hover {
6454 - margin: 0 0 var(--gap-sm);
5767 + margin: 0 0 15px;
6455 5768 }
6456 5769
6457 5770 .frm-first-page .frm_prev_page {
6458 5771 display: none;
@@ -6457,19 +5770,22 @@
6457 5770 .frm-first-page .frm_prev_page {
6458 5771 display: none;
6459 5772 }
6460 5773
6461 -#frm_builder_page .frm_remove_form_row.frm_button,
6462 -#frm_builder_page .frm_add_form_row.frm_button {
5774 +#frm-form-button button,
5775 +.frm_remove_form_row.frm_button,
5776 +.frm_add_form_row.frm_button,
5777 +.frm-white-body .frm-preview-buttons button {
6463 5778 border-radius: var(--small-radius);
6464 5779 border: 1px solid var(--blue-border);
5780 + color: var(--primary-color);
6465 5781 }
6466 5782
6467 -#frm_builder_page .frm_remove_form_row .frmsvg,
6468 -#frm_builder_page .frm_remove_form_row i:before,
6469 -#frm_builder_page .frm_add_form_row .frmsvg,
6470 -#frm_builder_page .frm_add_form_row i:before {
6471 - color: var(--primary-700);
5783 +.frm_wrap .frm_remove_form_row .frmsvg,
5784 +.frm_remove_form_row i:before,
5785 +.frm_wrap .frm_add_form_row .frmsvg,
5786 +.frm_add_form_row i:before {
5787 + color: var(--primary-hover);
6472 5788 }
6473 5789
6474 5790 .frm-preview-buttons .frm_button_submit {
6475 5791 margin: 0 5px;
@@ -6475,10 +5791,10 @@
6475 5791 margin: 0 5px;
6476 5792 }
6477 5793
6478 5794 .frm-page-break {
6479 - border-top: 1px dashed var(--primary-700);
6480 - margin-top: var(--gap-lg);
5795 + border-top: 1px dashed var(--primary-hover);
5796 + margin-top: 30px;
6481 5797 position: relative;
6482 5798 }
6483 5799
6484 5800 .edit_field_type_divider:before,
@@ -6491,9 +5807,9 @@
6491 5807 width: 4px;
6492 5808 height: 4px;
6493 5809 background-color: #fff;
6494 5810 border-radius: 50%;
6495 - border: 1px solid var(--primary-700);
5811 + border: 1px solid var(--primary-hover);
6496 5812 text-rendering: auto;
6497 5813 -webkit-font-smoothing: antialiased;
6498 5814 }
6499 5815
@@ -6515,12 +5831,13 @@
6515 5831 width: 20px;
6516 5832 height: 20px;
6517 5833 left: -11px;
6518 5834 top: 0;
6519 - background: var(--primary-700);
5835 + background: var(--primary-hover);
6520 5836 text-align: center;
6521 5837 color: #fff;
6522 5838 font-size: 13px;
5839 + line-height: 22px;
6523 5840 }
6524 5841
6525 5842 .edit_field_type_divider:before{
6526 5843 font-family: 's11-fp';
@@ -6541,20 +5858,20 @@
6541 5858
6542 5859
6543 5860 .frm_sorting li.edit_field_type_divider:hover,
6544 5861 .frm_sorting li.edit_field_type_divider.selected {
6545 - border-left-color: var(--primary-500);
5862 + border-left-color: var(--primary-color);
6546 5863 }
6547 5864
6548 5865 .edit_field_type_divider.selected:before,
6549 5866 .edit_field_type_divider:hover:before {
6550 - border-color: var(--primary-500);
6551 - background: var(--primary-500);
5867 + border-color: var(--primary-color);
5868 + background: var(--primary-color);
6552 5869 }
6553 5870
6554 5871 .edit_field_type_divider.selected:after,
6555 5872 .edit_field_type_divider:hover:after {
6556 - border-color: var(--primary-500);
5873 + border-color: var(--primary-color);
6557 5874 }
6558 5875
6559 5876 .frm-section-collapsed:after {
6560 5877 border-color: transparent !important;
@@ -6562,11 +5879,19 @@
6562 5879 }
6563 5880
6564 5881 .frm-page-break .frm-collapse-page.button {
6565 5882 margin-left: 46%;
6566 - margin-top: calc( -28px / 2 );
5883 + margin-top: -15px;
5884 + background-color: #fff;
5885 + border-color: var(--primary-hover) !important;
5886 + color: var(--primary-hover);
6567 5887 }
6568 5888
5889 +#frm-fake-page .frm-collapse-page.button {
5890 + border-color: var(--grey) !important;
5891 + color: var(--grey);
5892 +}
5893 +
6569 5894 #frm-fake-page.frm-page-collapsed {
6570 5895 margin-bottom: 0;
6571 5896 }
6572 5897
@@ -6572,15 +5897,15 @@
6572 5897
6573 5898 .frm-page-collapsed {
6574 5899 position: relative;
6575 5900 overflow: visible !important;
6576 - margin-bottom: var(--gap-lg);
5901 + margin-bottom: 30px;
6577 5902 }
6578 5903
6579 5904 .frm-page-collapsed:after {
6580 5905 content: '';
6581 5906 display: block;
6582 - border: 1px dashed var(--grey-300);
5907 + border: 1px dashed var(--grey-border);
6583 5908 border-left: none;
6584 5909 border-right: none;
6585 5910 height: 6px;
6586 5911 position: absolute;
@@ -6587,40 +5912,31 @@
6587 5912 width: calc( 100% - 10px );
6588 5913 bottom: -15px;
6589 5914 }
6590 5915
6591 -.frm-collapse-page .frmsvg,
6592 5916 .frm-collapse-page .frm_arrowdown6_icon {
6593 - width: var(--text-sm);
6594 - height: var(--text-sm);
6595 - font-size: var(--text-sm);
5917 + width: 16px;
6596 5918 text-align: center;
6597 5919 margin-left: 2px;
6598 - color: currentColor;
5920 + color: var(--primary-hover);
6599 5921 }
6600 5922
6601 5923 #frm-fake-page .frm_arrowdown6_icon {
6602 - color: currentColor;
5924 + color: var(--grey);
6603 5925 }
6604 5926
5927 +#frm-fake-page .frm-collapse-page:hover,
5928 +#frm-fake-page .frm-collapse-page:hover .frm_arrowdown6_icon,
5929 +.frm-collapse-page:hover .frm_arrowdown6_icon {
5930 + color: #fff;
5931 +}
5932 +
6605 5933 .frm-collapsed i:before,
5934 +.frm-section-collapsed .frm_arrowdown6_icon:before,
6606 5935 .frm-page-collapsed .frm_arrowdown6_icon:before {
6607 5936 content: '\e913';
6608 5937 }
6609 5938
6610 -.frm-collapse-section svg {
6611 - fill: var(--primary-color);
6612 - transition: transform 0.2s ease-out, fill 0.2s ease-out;
6613 -}
6614 -
6615 -.frm-collapse-section:hover svg {
6616 - fill: var(--primary-700);
6617 -}
6618 -
6619 -.frm-section-collapsed .frm-collapse-section svg {
6620 - transform: rotate(-90deg);
6621 -}
6622 -
6623 5939 .open .widget-top .frm_arrow_right_icon:before {
6624 5940 content: '\e62a';
6625 5941 }
6626 5942
@@ -6662,14 +5978,14 @@
6662 5978 .frm_no_section_fields {
6663 5979 text-align: center;
6664 5980 position: absolute;
6665 5981 color: var(--medium-grey);
6666 - font-size: var(--text-md);
5982 + font-size: 16px;
6667 5983 box-sizing: border-box;
6668 - border: 1px dashed var(--grey-300);
5984 + border: 2px dashed var(--primary-color);
6669 5985 }
6670 5986
6671 -.ui-droppable-active ~ .frm_no_fields {
5987 +.drop-me + .frm_no_fields {
6672 5988 border-style: solid;
6673 5989 }
6674 5990
6675 5991 .frm_no_section_fields {
@@ -6701,9 +6017,9 @@
6701 6017 display: block;
6702 6018 }
6703 6019
6704 6020 .frm-large-plus.frmsvg {
6705 - color: var(--primary-700);
6021 + color: var(--primary-hover);
6706 6022 height: 45px;
6707 6023 width: 45px;
6708 6024 }
6709 6025
@@ -6823,12 +6139,10 @@
6823 6139
6824 6140 .frm-category-tabs > li a,
6825 6141 .frm-category-tabs > li a:active {
6826 6142 outline: none;
6143 + -webkit-box-shadow: none;
6827 6144 box-shadow: none;
6828 - display: flex;
6829 - gap: var(--gap-xs);
6830 - align-items: center;
6831 6145 }
6832 6146
6833 6147 .frm-category-tabs > li.active .frmsvg,
6834 6148 .frm-category-tabs > li.active i,
@@ -6833,15 +6147,15 @@
6833 6147 .frm-category-tabs > li.active .frmsvg,
6834 6148 .frm-category-tabs > li.active i,
6835 6149 .frm-category-tabs > li.active span,
6836 6150 .frm-category-tabs > li.active a {
6837 - color: var(--primary-500);
6151 + color: var(--primary-color);
6838 6152 }
6839 6153
6840 6154 .frm_wrap .manage-menus {
6841 6155 margin-top: 0;
6842 6156 border: none;
6843 - border-bottom: 1px solid var(--grey-300);
6157 + border-bottom: 1px solid var(--grey-border);
6844 6158 background: var(--lightest-grey);
6845 6159 }
6846 6160
6847 6161 .general_settings .postbox .manage-menus {
@@ -6877,9 +6191,9 @@
6877 6191 padding-top: 10px;
6878 6192 }
6879 6193
6880 6194 .frm-right-panel .ui-state-default, #postbox-container-1 .ui-state-default {
6881 - color: var(--grey-900);
6195 + color: var(--darkest-grey);
6882 6196 }
6883 6197
6884 6198 .no_repeat_section .frm_sorting > li.ui-state-default.edit_field_type_end_divider:hover {
6885 6199 box-shadow: none;
@@ -6895,14 +6209,14 @@
6895 6209 .frm_sorting li.ui-state-default.selected.edit_field_type_divider .divider_section_only,
6896 6210 .frm_update_msg,
6897 6211 .frm_sorting li.ui-state-default.frm_not_divider.selected,
6898 6212 .frm_sorting li.ui-state-default.selected.edit_field_type_divider .divider_section_only {
6899 - border-color: var(--primary-500);
6213 + border-color: var(--primary-color);
6900 6214 transition: .5s border-color ease-in-out;
6901 6215 }
6902 6216
6903 6217 .frm_sorting li.ui-state-default.frm_not_divider.selected {
6904 - box-shadow: 0 0 1px 0 var(--primary-500);
6218 + box-shadow: 0 0 1px 0 var(--primary-color);
6905 6219 }
6906 6220
6907 6221 .frm_sorting li.ui-state-default {
6908 6222 transition: .7s box-shadow ease-in-out, .7s height linear;
@@ -6925,9 +6239,9 @@
6925 6239 font-weight: bold;
6926 6240 border: 1px solid #DFDFDF;
6927 6241 background-color: #EEEEEE;
6928 6242 padding: 3px 5px 2px;
6929 - font-size: var(--text-md);
6243 + font-size: 16px;
6930 6244 line-height: 20px;
6931 6245 }
6932 6246
6933 6247 .frm_update_msg {
@@ -6965,13 +6279,8 @@
6965 6279 .widefat .column-shortcode {
6966 6280 width: 9em;
6967 6281 }
6968 6282
6969 -.toplevel_page_formidable .column-shortcode div {
6970 - display: flex;
6971 - gap: var(--gap-xs);
6972 -}
6973 -
6974 6283 .widefat .column-entries, .widefat .column-link {
6975 6284 width: 10%;
6976 6285 text-align: center;
6977 6286 }
@@ -6979,22 +6288,23 @@
6979 6288 .widefat .column-form_key, .widefat .column-created_at {
6980 6289 width: 10%;
6981 6290 }
6982 6291
6983 -.frm-white-body .search-box,
6292 +.post-type-frm_display .search-box,
6984 6293 .frm_wrap .frm-search {
6985 6294 float: right;
6986 - margin: 0;
6295 + margin-bottom: 15px;
6987 6296 clear: right;
6988 6297 }
6989 6298
6990 -.frm-white-body .search-box,
6299 +#form_entries_page form .frm-search {
6300 + margin-top: 15px;
6301 +}
6302 +
6991 6303 .frm-search {
6992 - min-width: 32%;
6304 + width: 32%;
6305 + float: right;
6993 6306 position: relative;
6994 - display: flex;
6995 - gap: var(--gap-sm);
6996 - align-items: center;
6997 6307 }
6998 6308
6999 6309 .frm-inline-modal .frm-search,
7000 6310 #frm_adv_info .frm-search {
@@ -7000,9 +6310,9 @@
7000 6310 #frm_adv_info .frm-search {
7001 6311 float: none;
7002 6312 width: 100%;
7003 6313 clear: both;
7004 - margin: var(--gap-xs) 0;
6314 + margin: 5px 0 10px;
7005 6315 }
7006 6316
7007 6317 .frm-button-group a {
7008 6318 margin: 0 7px !important;
@@ -7019,9 +6329,9 @@
7019 6329
7020 6330 i.frm-show-box,
7021 6331 i.frm-show-inline-modal,
7022 6332 .frm-with-left-icon i,
7023 -.frm-with-right-icon i:not([class*=mce-]),
6333 +.frm-with-right-icon i,
7024 6334 .frmsvg.frm-show-box,
7025 6335 .frmsvg.frm-show-inline-modal,
7026 6336 .frm-with-left-icon .frmsvg,
7027 6337 .frm-with-right-icon .frmsvg,
@@ -7027,17 +6337,18 @@
7027 6337 .frm-with-right-icon .frmsvg,
7028 6338 .frm-search > .frmsvg,
7029 6339 .frm-search span:not(.multiselect-selected-text):not(.multiselect-native-select) {
7030 6340 position: absolute;
7031 - padding: 0 14px;
6341 + padding: 7px 10px;
7032 6342 pointer-events: none;
7033 6343 left: 0;
7034 - color: var(--grey-400);
7035 - font-size: var(--text-xs);
6344 + color: var(--grey);
6345 + opacity: .5;
6346 + font-size: 18px;
7036 6347 }
7037 6348
7038 6349 .frm-with-right-icon .frmsvg,
7039 -.frm-with-right-icon i:not([class*=mce-]) {
6350 +.frm-with-right-icon i {
7040 6351 right: 0;
7041 6352 top: -3px;
7042 6353 left: auto;
7043 6354 padding: 0 10px 0 5px;
@@ -7042,35 +6353,20 @@
7042 6353 left: auto;
7043 6354 padding: 0 10px 0 5px;
7044 6355 }
7045 6356
7046 -.frm_form_settings .frm-with-right-icon .frmsvg {
7047 - top: 0;
7048 -}
7049 -
7050 -.frm_form_settings .wp-editor-container .frm-with-right-icon .frmsvg {
7051 - top: auto;
7052 - bottom: 0;
7053 -}
7054 -
7055 -.frm_form_settings .frm_has_textarea .frm-with-right-icon .frmsvg {
7056 - top: auto;
7057 - bottom: 6px;
7058 -}
7059 -
7060 6357 .frmsvg.frm-show-box,
7061 6358 .frmsvg.frm-show-inline-modal,
7062 6359 i.frm-show-box,
7063 6360 i.frm-show-inline-modal {
7064 - color: var(--primary-500);
6361 + color: var(--primary-color);
7065 6362 pointer-events: initial;
7066 6363 cursor: pointer;
7067 6364 z-index: 1;
7068 6365 opacity: 1;
6366 + right: 2px;
7069 6367 top: auto;
7070 - margin: calc( ( 36px - 18px ) / 2 ); /* input height - svg / 2 */
7071 - margin-bottom: 0;
7072 - padding: 0;
6368 + padding: 7px 10px;
7073 6369 }
7074 6370
7075 6371 .frm-open .frmsvg.frm-show-inline-modal,
7076 6372 .frm-open i.frm-show-inline-modal {
@@ -7093,9 +6389,9 @@
7093 6389
7094 6390 .frm_wrap .frm-with-right-icon textarea,
7095 6391 .frm_wrap .frm-with-right-icon input,
7096 6392 .frm_wrap .frm-with-right-icon input[type=text] {
7097 - padding-right: var(--gap-md);
6393 + padding-right: 35px;
7098 6394 }
7099 6395
7100 6396 #frm-show-fields .frm-with-left-icon .frmsvg,
7101 6397 #frm-show-fields .frm-with-left-icon i {
@@ -7101,29 +6397,43 @@
7101 6397 #frm-show-fields .frm-with-left-icon i {
7102 6398 padding-top: 10px;
7103 6399 }
7104 6400
6401 +.frm-search input.frm-search-input,
7105 6402 .frm-search input[name="s"],
6403 +.frm-search #search-submit {
6404 + border-color: var(--grey-border);
6405 + box-shadow: none;
6406 + margin: 0;
6407 + padding: 7px;
6408 + height: auto;
6409 + font-size: 13px;
6410 + line-height: normal;
6411 +}
6412 +
7106 6413 .frm-search .dropdown-toggle,
7107 6414 .frm-search input.frm-search-input {
7108 - border-radius: var(--small-radius);
6415 + border-radius: var(--border-radius);
7109 6416 padding-left: 33px !important;
7110 - border-color: var(--grey-300);
7111 6417 }
7112 6418
7113 -.frm_wrap .frm-search .frm-search-input,
7114 -.frm-modal .frm-search .frm-search-input,
7115 -.frm-white-body .search-box input[name="s"], /* Views search */
7116 -.frm_wrap .frm-search input[name="s"] {
7117 - padding-top: 3px;
7118 - padding-bottom: 3px;
7119 - flex: 1;
7120 - font-size: var(--text-sm);
6419 +.frm-search input[name="s"] {
6420 + width: 70%;
6421 + float: left;
6422 + border-radius: var(--border-radius) 0 0 var(--border-radius) !important;
6423 + border-right-width: 0;
6424 + padding-left: 33px;
7121 6425 }
7122 6426
7123 -.frm-search .dropdown-toggle {
6427 +.frm-search .dropdown-toggle,
6428 +.frm-search input.frm-auto-search {
7124 6429 width: 100%;
6430 + border-right-width: 1px;
6431 + border-radius: var(--border-radius) !important;
7125 6432 float: none;
6433 +}
6434 +
6435 +.frm-search .dropdown-toggle {
7126 6436 max-width: 200px;
7127 6437 background: transparent;
7128 6438 padding: 7px;
7129 6439 min-height: 32px;
@@ -7131,18 +6441,22 @@
7131 6441 overflow: hidden;
7132 6442 text-overflow: ellipsis;
7133 6443 }
7134 6444
7135 -span.multiselect-selected-text {
6445 +.frm-search span.multiselect-selected-text {
7136 6446 white-space: nowrap;
7137 - display: inline-block;
7138 - max-width: 90%;
7139 - text-overflow: ellipsis;
7140 - overflow: hidden;
6447 + display: inline-block;
7141 6448 }
7142 6449
6450 +.frm-search #search-submit {
6451 + width: 30%;
6452 + border-radius: 0 var(--border-radius) var(--border-radius) 0;
6453 + text-align: center;
6454 + background-color: var(--lightest-grey);
6455 +}
6456 +
7143 6457 .frm-search #search-submit a {
7144 - color: var(--grey-800);
6458 + color: var(--primary-color);
7145 6459 }
7146 6460
7147 6461 .frm-search #search-submit .caret {
7148 6462 opacity:.7;
@@ -7148,15 +6462,15 @@
7148 6462 opacity:.7;
7149 6463 }
7150 6464
7151 6465 .frm-not-set input {
7152 - color: var(--primary-500) !important;
6466 + color: var(--primary-color) !important;
7153 6467 font-size: 13px;
7154 6468 }
7155 6469
7156 6470 .frm-not-set .frmsvg,
7157 6471 .frm-not-set i {
7158 - color: var(--primary-700);
6472 + color: var(--primary-hover);
7159 6473 opacity: 1;
7160 6474 }
7161 6475
7162 6476 .post-type-frm_display select[name="m"] + #post-query-submit,
@@ -7224,9 +6538,9 @@
7224 6538
7225 6539 .post-type-frm_display #advanced-sortables h2.hndle,
7226 6540 .post-type-frm_display #side-sortables h2.hndle,
7227 6541 .post-type-frm_display #normal-sortables h2.hndle {
7228 - border-bottom: 1px solid var(--grey-300);
6542 + border-bottom: 1px solid var(--grey-border);
7229 6543 margin: 10px 0 0 !important;
7230 6544 padding: 0 25px 8px;
7231 6545 }
7232 6546
@@ -7235,9 +6549,9 @@
7235 6549 padding-top: 10px;
7236 6550 }
7237 6551
7238 6552 .post-type-frm_display #post-body-content {
7239 - margin-top: var(--gap-lg);
6553 + margin-top: 30px;
7240 6554 }
7241 6555
7242 6556 .post-type-frm_display.edit-php #wpbody-content > .wrap {
7243 6557 margin: 0;
@@ -7244,15 +6558,15 @@
7244 6558 }
7245 6559
7246 6560 .post-type-frm_display .postbox .hndle,
7247 6561 .post-type-frm_display .postbox {
7248 - border-color: var(--grey-300);
6562 + border-color: var(--grey-border);
7249 6563 }
7250 6564
7251 6565 .post-type-frm_display #postbox-container-1 .postbox,
7252 6566 .post-type-frm_display #postbox-container-2 .postbox {
7253 6567 border-radius: var(--small-radius);
7254 - border-color: var(--grey-300);
6568 + border-color: var(--grey-border);
7255 6569 box-shadow: none;
7256 6570 }
7257 6571
7258 6572 .post-type-frm_display #side-sortables .postbox {
@@ -7331,9 +6645,9 @@
7331 6645 background-color: transparent;
7332 6646 }
7333 6647
7334 6648 .post-type-frm_display #major-publishing-actions {
7335 - border-color: var(--grey-300);
6649 + border-color: var(--grey-border);
7336 6650 background: var(--sidebar-color);
7337 6651 }
7338 6652
7339 6653 .post-type-frm_display #frm_adv_info {
@@ -7387,9 +6701,9 @@
7387 6701 .settings-lite-cta ul,
7388 6702 .settings-lite-cta p,
7389 6703 .settings-lite-cta {
7390 6704 color: #666;
7391 - font-size: var(--text-md);
6705 + font-size: 16px;
7392 6706 box-shadow: none !important;
7393 6707 }
7394 6708
7395 6709 .frm-info-modal h3,
@@ -7403,9 +6717,8 @@
7403 6717
7404 6718 .frm-info-modal .postbox .inside,
7405 6719 .settings-lite-cta .postbox .inside {
7406 6720 padding: 20px 40px;
7407 - margin: 0;
7408 6721 }
7409 6722
7410 6723 .cta-inside a {
7411 6724 color: var(--orange)
@@ -7411,15 +6724,21 @@
7411 6724 color: var(--orange)
7412 6725 }
7413 6726
7414 6727 .info-modal-inside a.frm-standard-link {
7415 - color: var(--primary-500);
6728 + color: var(--primary-color);
7416 6729 }
7417 6730
7418 6731 .info-modal-inside a.frm-standard-link:hover {
7419 - color: var(--primary-700);
6732 + color: var(--primary-hover);
7420 6733 }
7421 6734
6735 +.frm-caution {
6736 + text-transform: uppercase;
6737 + font-weight: bold;
6738 + color: var(--dark-grey);
6739 +}
6740 +
7422 6741 .frm_no_p_margin > p {
7423 6742 margin: 0;
7424 6743 }
7425 6744
@@ -7429,12 +6748,14 @@
7429 6748 font-size: 11px;
7430 6749 overflow: hidden;
7431 6750 }
7432 6751
6752 +.frm_code_list.frm-full-hover {
6753 + margin: 0 -20px;
6754 +}
6755 +
7433 6756 #frm-navbarDrop + .frm_code_list.frm-full-hover {
7434 - margin: var(--gap-xs) 0 0;
7435 - min-width: 300px;
7436 - max-height: calc( ( 40px * 5 ) + 56px );
6757 + margin: 4px 0 0;
7437 6758 }
7438 6759
7439 6760 .frm_code_list.frm-full-hover li {
7440 6761 margin: 0;
@@ -7439,28 +6760,55 @@
7439 6760 .frm_code_list.frm-full-hover li {
7440 6761 margin: 0;
7441 6762 }
7442 6763
7443 -.frm-select-list-item,
7444 -.frm_wrap .ui-autocomplete li > div,
7445 -.multiselect-container button.multiselect-option,
7446 -.frm-dropdown-menu > .dropdown-item > a,
7447 -.frm-dropdown-menu > .dropdown-item > a:visited,
7448 -.frm-dropdown-menu > .dropdown-item > a:link, /* Override jQuery UI */
6764 +.frm-dropdown-menu > li > a,
7449 6765 .frm-dropdown-menu .frm_dropdown_li,
7450 6766 .frm_code_list.frm-full-hover a {
7451 - display: flex;
7452 - color: var(--grey-700);
7453 - padding: 5px 10px;
7454 - font-size: var(--text-md);
7455 - gap: var(--gap-xs);
7456 - align-items: center;
6767 + display: block;
6768 + color: var(--dark-grey);
6769 + padding: 3px 25px;
6770 + font-size: 15px;
7457 6771 }
7458 6772
6773 +#frm_field_group_controls .frm-dropdown-menu,
6774 +.frm-field-action-icons .frm-dropdown-menu {
6775 + padding: 0;
6776 + margin: 0;
6777 +}
6778 +
6779 +#frm_builder_page .frm-dropdown-menu .frm_dropdown_li.frm_more_options_li {
6780 + padding: 0;
6781 + color: rgba(40, 47, 54, 0.85);
6782 + cursor: pointer;
6783 + position: relative;
6784 + height: 32px;
6785 +}
6786 +
6787 +#frm_builder_page .frm-dropdown-menu .frm_dropdown_li.frm_more_options_li .frmsvg {
6788 + color: rgba(40, 47, 54, 0.85) !important;
6789 +}
6790 +
6791 +#frm_builder_page .frm-dropdown-menu .frm_dropdown_li.frm_more_options_li a {
6792 + padding: 6px 10px;
6793 + position: absolute;
6794 + top: 0;
6795 + left: 0;
6796 + bottom: 0;
6797 + width: 100%;
6798 + box-sizing: border-box;
6799 +}
6800 +
6801 +#frm_builder_page .frm-dropdown-menu .frm_dropdown_li.frm_more_options_li:hover {
6802 + background: #F6F7FB;
6803 +}
6804 +
7459 6805 .frm_code_list.frm-full-hover a span {
6806 + color: var(--grey);
6807 + float: right;
6808 + font-size: 14px;
7460 6809 max-width: 83px;
7461 6810 text-align: right;
7462 - margin-left: auto;
7463 6811 }
7464 6812
7465 6813 .frm_code_list.frm-full-hover a,
7466 6814 .frm_code_list.frm-full-hover a span {
@@ -7468,54 +6816,24 @@
7468 6816 overflow: hidden;
7469 6817 text-overflow: ellipsis;
7470 6818 }
7471 6819
7472 -.frm_code_list.frm-full-hover.frmcenter a {
7473 - display: block;
7474 -}
7475 -
7476 -#frm-layout-classes frm-full-hover a span {
7477 - max-width: 45%;
7478 -}
7479 -
7480 -.frm-select-list-item.active,
7481 -.frm-select-list-item:hover,
7482 -.frm_wrap .ui-autocomplete li div.ui-state-active,
7483 -.frm_wrap .ui-autocomplete li.ui-state-focus,
7484 -.multiselect-container button.multiselect-option.active,
7485 -.multiselect-container button.multiselect-option:hover,
7486 -.frm-dropdown-menu > .dropdown-item > a:hover,
6820 +.frm-dropdown-menu > li > a:hover,
7487 6821 .frm_code_list.frm-full-hover a:hover span,
7488 6822 .frm_code_list.frm-full-hover a:hover {
7489 - background: var(--primary-25);
7490 - color: var(--primary-500);
7491 - border-radius: var(--small-radius);
6823 + background: var(--sidebar-color);
6824 + color: var(--primary-color);
7492 6825 }
7493 6826
7494 -.frm-select-list-item .frmsvg,
7495 -.frm-dropdown-menu > .dropdown-item > a .frmsvg {
7496 - opacity: .8;
7497 -}
7498 -
7499 -.frm-select-list-item:hover .frmsvg,
7500 -.frm-dropdown-menu > .dropdown-item > a:hover .frmsvg {
7501 - opacity: 1;
7502 -}
7503 -
7504 6827 .frm-dropdown-menu.frm_code_list > li > a {
7505 6828 padding: 3px 15px;
7506 6829 width: 300px;
7507 6830 }
7508 6831
7509 -#frm_edit_box_content_modal .frm-with-search, /* Temp. Add .frm-dropdown-menu in Views */
7510 -.frm-dropdown-menu .frm-with-search {
7511 - padding: var(--gap-xs) 10px 0;
6832 +.frm-dropdown-menu.frm_code_list .frm-with-search {
6833 + padding: 3px 10px;
7512 6834 }
7513 6835
7514 -.frm-dropdown-menu .subsubsub {
7515 - padding: 0 10px;
7516 -}
7517 -
7518 6836 .frm_grid_container {
7519 6837 overflow: visible;
7520 6838 }
7521 6839
@@ -7531,16 +6849,16 @@
7531 6849 .frm_code_list.frm_grid_container a {
7532 6850 padding: 5px 0;
7533 6851 text-align: center;
7534 6852 background-color: var(--light-blue);
7535 - border: 1px solid var(--primary-500);
7536 - color: var(--primary-500);
6853 + border: 1px solid var(--primary-color);
6854 + color: var(--primary-color);
7537 6855 display: block;
7538 6856 border-radius: var(--small-radius);
7539 6857 }
7540 6858
7541 6859 .frm_code_list.frm_grid_container a:hover {
7542 - background-color: var(--primary-700);
6860 + background-color: var(--primary-hover);
7543 6861 color: #fff;
7544 6862 }
7545 6863
7546 6864 .frm_field_list #frm-insert-fields .button a {
@@ -7548,15 +6866,10 @@
7548 6866 max-width: 95%;
7549 6867 overflow: hidden;
7550 6868 }
7551 6869
7552 -.field_type_list.frm_grid_container {
7553 - gap: var(--gap-xs) var(--gap-sm);
7554 - margin: var(--gap-xs);
7555 -}
7556 -
7557 6870 .field_type_list li {
7558 - margin: 0;
6871 + margin: 0 0 10px;
7559 6872 padding: 0;
7560 6873 }
7561 6874
7562 6875 #frm-insert-fields .frm-search {
@@ -7568,13 +6881,22 @@
7568 6881 #frm-insert-fields li,
7569 6882 #frm-insert-fields li a {
7570 6883 text-decoration: none;
7571 6884 font-weight: normal;
7572 - font-size: var(--text-md) !important;
7573 - color: var(--grey-900);
6885 + font-size: 15px !important;
6886 + color: var(--dark-grey);
7574 6887 }
7575 6888
6889 +#frm-insert-fields li a {
6890 + padding: 5px 20px;
6891 + display: block;
6892 + border-radius: 0 var(--border-radius) var(--border-radius) 0;
6893 +}
6894 +
7576 6895 #frm-insert-fields li.frm_show_upgrade {
6896 + margin: 0 0 10px;
6897 + padding: 5px 20px;
6898 + box-sizing: border-box;
7577 6899 cursor: pointer;
7578 6900 opacity: .5;
7579 6901 }
7580 6902
@@ -7581,11 +6903,14 @@
7581 6903 #frm-insert-fields li a span {
7582 6904 vertical-align: middle;
7583 6905 }
7584 6906
7585 -.frmbutton.ui-draggable-dragging a,
6907 +#frm-insert-fields li:nth-child(2n) a {
6908 + border-radius: var(--border-radius) 0 0 var(--border-radius);
6909 +}
6910 +
7586 6911 #frm-insert-fields li a:not(.disabled):hover {
7587 - background: var(--grey-100);
6912 + background: var(--sidebar-hover);
7588 6913 }
7589 6914
7590 6915 #frm-insert-fields li a.disabled:hover {
7591 6916 cursor: not-allowed;
@@ -7607,9 +6932,9 @@
7607 6932 .frmsvg {
7608 6933 fill: currentColor;
7609 6934 width: 18px;
7610 6935 height: 18px;
7611 - vertical-align: middle;
6936 + vertical-align: text-bottom;
7612 6937 }
7613 6938
7614 6939 input[disabled],
7615 6940 .frmsvg svg {
@@ -7635,27 +6960,40 @@
7635 6960 width: 13px;
7636 6961 height: 13px;
7637 6962 }
7638 6963
6964 +.frm_code_list a .frmsvg,
7639 6965 .frmbutton.ui-sortable-helper .frmsvg,
7640 6966 .field_type_list li.frmbutton .frmsvg,
6967 +.frm_code_list a i,
7641 6968 .frmbutton.ui-sortable-helper i,
7642 -.field_type_list li.frmbutton i,
7643 -.frm_code_list a .frmsvg,
7644 -.frm_code_list a i {
7645 - color: var(--grey-500);
6969 +.field_type_list li.frmbutton i {
6970 + margin: .15em .2em;
6971 + color: var(--grey);
7646 6972 display: inline-block;
7647 6973 vertical-align: middle;
7648 - width: var(--text-md);
7649 - font-size: var(--text-md);
6974 + width: 20px;
6975 + height: 20px;
6976 + padding-right: 15px;
6977 + text-align: left;
6978 + font-size: 18px;
7650 6979 }
7651 6980
7652 -/* Standardize icon size for field buttons in the builder */
7653 -.field_type_list li.frmbutton .frmsvg {
7654 - width: var(--text-xl);
7655 - font-size: var(--text-xl);
6981 +/* Icon for Name field is larger */
6982 +.field_type_list li.frm_tname.frmbutton .frmsvg {
6983 + width: 24px;
6984 + height: 24px;
6985 + padding-right: 11px;
7656 6986 }
7657 6987
6988 +.frm_code_list a .frmsvg,
6989 +.frm_code_list a i {
6990 + margin: 0 5px 0 0;
6991 + padding: 0;
6992 + width: 15px;
6993 + font-size: 15px;
6994 +}
6995 +
7658 6996 .frm_code_list i:before {
7659 6997 font-size: inherit;
7660 6998 }
7661 6999
@@ -7660,58 +6998,62 @@
7660 6998 }
7661 6999
7662 7000 #frm-insert-fields li a:not(.disabled):hover .frmsvg,
7663 7001 #frm-insert-fields li a:not(.disabled):hover i {
7664 - color: var(--grey-600);
7002 + color: var(--dark-grey);
7665 7003 }
7666 7004
7667 -/* Icon while dragging */
7668 7005 .frmbutton.ui-draggable-dragging {
7669 - pointer-events: none;
7006 + width: auto !important;
7670 7007 }
7671 7008
7672 -#frm-insert-fields li.frm_show_upgrade,
7673 -#frm-insert-fields li a,
7009 +/* Icon while dragging */
7010 +.frmbutton.ui-draggable-dragging,
7674 7011 .frmbutton.ui-draggable-dragging a {
7675 - text-decoration: none;
7676 - display: inline-flex !important;
7677 - gap: var(--gap-xs);
7678 - align-items: center;
7679 - border-radius: var(--border-radius) !important;
7680 - padding: var(--gap-xs) var(--gap-sm) !important;
7681 - color: var(--grey-900) !important;
7012 + cursor: move;
7682 7013 }
7683 7014
7684 -/* Adjust field button size to full width in builder */
7685 -#frm-insert-fields li a {
7686 - display: flex !important;
7015 +.frmbutton.ui-sortable-helper a,
7016 +.frmbutton.ui-draggable-dragging a:hover,
7017 +.frmbutton.ui-draggable-dragging a {
7018 + text-decoration: none;
7019 + height: 25px !important;
7020 + width: 180px;
7021 + text-align: center;
7022 + display: block !important;
7023 + background-color: var(--primary-hover) !important;
7024 + border-radius: 35px !important;
7025 + padding: 5px 20px !important;
7026 + color: #fff !important;
7687 7027 }
7688 7028
7689 -/* Prevents advanced fields from always appearing in search results */
7690 -#frm-insert-fields li.frm_show_upgrade.frm_hidden {
7691 - display: none !important;
7029 +.frmbutton.ui-draggable-dragging:not(.ui-sortable-helper) a {
7030 + /* When the new field is held outside of a dropzone */
7031 + cursor: not-allowed;
7032 + background: var(--sidebar-color) !important;
7033 + color: var(--dark-grey) !important;
7692 7034 }
7693 7035
7694 -.frmbutton.ui-draggable-dragging a {
7695 - border: 1px solid var(--grey-300);
7696 - box-shadow: var(--box-shadow-md);
7697 -}
7698 -
7699 7036 .frmbutton.ui-draggable-dragging span {
7700 7037 font-size: 15px;
7701 7038 }
7702 7039
7703 7040 #frm-show-fields .frmbutton.ui-sortable-helper i,
7041 +.frmbutton.ui-sortable-helper span,
7704 7042 .frmbutton.ui-draggable-dragging i,
7705 7043 .frmbutton.ui-draggable-dragging .frmsvg {
7706 7044 color: #fff !important;
7707 7045 }
7708 7046
7709 -.frmbutton.ui-draggable-dragging i,
7710 -.frmbutton.ui-draggable-dragging .frmsvg {
7711 - color: var(--grey-700) !important;
7047 +.frmbutton.ui-draggable-dragging:not(.ui-sortable-helper) i,
7048 +.frmbutton.ui-draggable-dragging:not(.ui-sortable-helper) .frmsvg {
7049 + color: var(--dark-grey) !important;
7712 7050 }
7713 7051
7052 +.frmbutton.ui-draggable-dragging .frm-dropdown-menu {
7053 + display: none;
7054 +}
7055 +
7714 7056 .frm_sorting li.ui-state-default.ui-sortable-helper,
7715 7057 .frmbutton.ui-sortable-helper {
7716 7058 transition: opacity .2s;
7717 7059 opacity: 1;
@@ -7716,13 +7058,10 @@
7716 7058 transition: opacity .2s;
7717 7059 opacity: 1;
7718 7060 }
7719 7061
7720 -.frm-field-group-count {
7721 - background-color: var(--sidebar-hover);
7722 - padding: 5px;
7723 - color: #fff !important;
7724 - border-radius: 10px;
7062 +.frmbutton.ui-sortable-helper:not(.ui-draggable-dragging) {
7063 + opacity: 0;
7725 7064 }
7726 7065
7727 7066 /* End dragging */
7728 7067
@@ -7748,64 +7087,13 @@
7748 7087 .frm_noallow a {
7749 7088 color: inherit;
7750 7089 }
7751 7090
7752 -#frm_upgrade_modal_image {
7753 - max-width: 200px;
7754 -}
7755 -
7756 -.frm-tab-message {
7757 - max-width: 600px;
7758 - margin: 20px auto;
7759 - color: rgba(63, 75, 91, 0.8);
7760 -}
7761 -
7762 -.frm-settings-screenshot-toolbar {
7763 - min-height: 39px;
7764 - display: flex;
7765 -}
7766 -
7767 -.frm-settings-screenshot-toolbar .frm-minmax-icon {
7768 - height: 8px;
7769 - width: 8px;
7770 - border-radius: 50%;
7771 - align-self: center;
7772 - margin-left: 10px;
7773 -}
7774 -
7775 -.frm-settings-screenshot-toolbar .frm-minmax-icon:first-of-type {
7776 - margin-left: 20px;
7777 -}
7778 -
7779 -.frm-settings-screenshot-toolbar img {
7780 - object-fit: contain;
7781 - align-self: flex-end;
7782 - margin-left: 25px;
7783 -}
7784 -
7785 -.frm-settings-screenshot-toolbar + div {
7786 - background: #fff;
7787 - padding-top: 25px;
7788 - border-radius: 0 0 16px 16px;
7789 -}
7790 -
7791 -.frm-settings-screenshot-toolbar + div img {
7792 - max-width: calc( 100% - 40px );
7793 -}
7794 -
7795 -.frm-settings-screenshot-wrapper {
7796 - max-width: 700px;
7797 - margin: 50px auto 0;
7798 - box-shadow: 0px 4px 4px rgba(189, 196, 205, 0.25), 0px 12px 56px rgba(42, 57, 75, 0.25);
7799 - border-radius: 16px;
7800 - background: #EBECF1;
7801 -}
7802 -
7803 7091 .frm-dialog {
7804 7092 z-index: 100;
7805 7093 padding: 0 !important;
7806 - border-radius: 16px;
7807 - border: none;
7094 + border-radius: 10px;
7095 + border: 1px solid var(--grey);
7808 7096 background-color: #fff;
7809 7097 max-width: 100% !important;
7810 7098 }
7811 7099
@@ -7812,14 +7100,20 @@
7812 7100 .frm-dialog .postbox {
7813 7101 background: transparent;
7814 7102 box-shadow: none;
7815 7103 border: none;
7816 - line-height: var(--leading);
7817 7104 }
7818 7105
7106 +.frm-dialog .frm-sub-label,
7107 +.frm-dialog label {
7108 + color: var(--dark-grey);
7109 + font-size: 17px;
7110 + font-weight: 300;
7111 +}
7112 +
7819 7113 .frm-dialog input[type=text],
7820 7114 .frm-dialog textarea {
7821 - font-size: var(--text-md);
7115 + font-size: 16px;
7822 7116 }
7823 7117
7824 7118 .frm-dialog textarea {
7825 7119 height: 75px;
@@ -7832,19 +7126,16 @@
7832 7126 .frm-dialog .frm-sub-label,
7833 7127 .frm-sub-label {
7834 7128 color: var(--grey);
7835 7129 text-transform: none;
7836 - padding-left: 8px;
7837 7130 }
7838 7131
7839 7132 h2 .frm-sub-label {
7840 - font-size: var(--text-md);
7133 + font-size: 16px;
7841 7134 }
7842 7135
7843 -.frm-views-editor-body .ui-widget-overlay,
7844 7136 .frm-white-body .ui-widget-overlay,
7845 -.toplevel_page_formidable .ui-widget-overlay,
7846 -body[class*=formidable-payments] .ui-widget-overlay {
7137 +.toplevel_page_formidable .ui-widget-overlay {
7847 7138 position: fixed;
7848 7139 width: 100%;
7849 7140 height: 100%;
7850 7141 top: 0;
@@ -7850,10 +7141,9 @@
7850 7141 top: 0;
7851 7142 left: 0;
7852 7143 right: 0;
7853 7144 bottom: 0;
7854 - background: var(--grey-500);
7855 - opacity: .5;
7145 + background: var(--grey-border);
7856 7146 z-index: 2;
7857 7147 }
7858 7148
7859 7149 #frm_upgrade_modal {
@@ -7868,15 +7158,15 @@
7868 7158 color: #c4c4c4;
7869 7159 padding-bottom: 20px;
7870 7160 }
7871 7161
7872 -.frm-upgrade-message img {
7162 +#frm-upgrade-message img {
7873 7163 max-width: 100%;
7874 7164 }
7875 7165
7876 7166 a.frm-link-secondary {
7877 7167 color: #c4c4c4;
7878 - font-size: var(--text-sm);
7168 + font-size: 14px;
7879 7169 text-decoration: underline;
7880 7170 }
7881 7171
7882 7172 .field_type_list li.button.frm_noallow,
@@ -7892,136 +7182,132 @@
7892 7182 min-height: 150px;
7893 7183 }
7894 7184
7895 7185 /*!
7896 - * Bootstrap v4.6.1
7186 + * Bootstrap v3.0.2
7897 7187 */
7898 7188
7899 7189 .tooltip {
7900 - /* Copied from Bootstrap */
7901 7190 position: absolute;
7191 + z-index: 9999999;
7902 7192 display: block;
7903 - margin: 0;
7904 - font-style: normal;
7905 - font-weight: 400;
7906 - line-height: 1.5;
7907 - text-align: left;
7908 - text-align: start;
7909 - text-decoration: none;
7910 - text-shadow: none;
7911 - text-transform: none;
7912 - letter-spacing: normal;
7913 - word-break: normal;
7914 - word-spacing: normal;
7915 - white-space: normal;
7916 - line-break: auto;
7917 - font-size: 0.875rem;
7918 - word-wrap: break-word;
7193 + visibility: visible;
7194 + font-size: 14px;
7195 + line-height: 1.4;
7919 7196 opacity: 0;
7920 -
7921 - /* Custom rules */
7922 - z-index: 9999999;
7923 - pointer-events: none;
7197 + filter: alpha(opacity=0);
7924 7198 }
7925 7199
7926 -.tooltip.show {
7927 - opacity: 0.9;
7200 +.tooltip.in {
7201 + opacity: 1;
7202 + filter: alpha(opacity=100);
7928 7203 }
7929 7204
7930 -.tooltip .arrow {
7931 - position: absolute;
7932 - display: block;
7933 - width: 0.8rem;
7934 - height: 0.4rem;
7935 - margin-left: 0 !important;
7205 +.tooltip.top {
7206 + margin-top: -3px;
7207 + padding: 5px 0;
7936 7208 }
7937 7209
7938 -.tooltip .arrow::before {
7939 - position: absolute;
7940 - content: "";
7941 - border-color: transparent;
7942 - border-style: solid;
7210 +.tooltip.right {
7211 + margin-left: 3px;
7212 + padding: 0 5px;
7943 7213 }
7944 7214
7945 -.bs-tooltip-top, .bs-tooltip-auto[x-placement^="top"] {
7946 - padding: 0.4rem 0;
7215 +.tooltip.bottom {
7216 + margin-top: 3px;
7217 + padding: 5px 0;
7947 7218 }
7948 7219
7949 -.bs-tooltip-top .arrow, .bs-tooltip-auto[x-placement^="top"] .arrow {
7950 - bottom: 0;
7220 +.tooltip.left {
7221 + margin-left: -3px;
7222 + padding: 0 5px;
7951 7223 }
7952 7224
7953 -.bs-tooltip-top .arrow::before, .bs-tooltip-auto[x-placement^="top"] .arrow::before {
7954 - top: 0;
7955 - border-width: 0.4rem 0.4rem 0;
7956 - border-top-color: #000;
7225 +.tooltip-inner {
7226 + max-width: 200px;
7227 + padding: 10px;
7228 + color: #fff;
7229 + text-align: left;
7230 + text-decoration: none;
7231 + background-color: var(--dark-grey);
7232 + border-radius: 4px;
7233 + z-index: 99999999;
7234 + text-transform: none;
7957 7235 }
7958 7236
7959 -.bs-tooltip-right, .bs-tooltip-auto[x-placement^="right"] {
7960 - padding: 0 0.4rem;
7237 +.tooltip.right .tooltip-inner {
7238 + min-width: 150px;
7239 + max-width: 300px;
7961 7240 }
7962 7241
7963 -.bs-tooltip-right .arrow, .bs-tooltip-auto[x-placement^="right"] .arrow {
7964 - left: 0;
7965 - width: 0.4rem;
7966 - height: 0.8rem;
7242 +.tooltip-arrow {
7243 + position: absolute;
7244 + width: 0;
7245 + height: 0;
7246 + border-color: transparent;
7247 + border-style: solid;
7967 7248 }
7968 7249
7969 -.bs-tooltip-right .arrow::before, .bs-tooltip-auto[x-placement^="right"] .arrow::before {
7970 - right: 0;
7971 - border-width: 0.4rem 0.4rem 0.4rem 0;
7972 - border-right-color: #000;
7250 +.tooltip.top .tooltip-arrow {
7251 + bottom: 0;
7252 + left: 50%;
7253 + margin-left: -5px;
7254 + border-width: 5px 5px 0;
7255 + border-top-color: var(--dark-grey);
7973 7256 }
7974 7257
7975 -.bs-tooltip-bottom, .bs-tooltip-auto[x-placement^="bottom"] {
7976 - padding: 0.4rem 0;
7258 +.tooltip.top-left .tooltip-arrow {
7259 + bottom: 0;
7260 + left: 5px;
7261 + border-width: 5px 5px 0;
7262 + border-top-color: var(--dark-grey);
7977 7263 }
7978 7264
7979 -.bs-tooltip-bottom .arrow, .bs-tooltip-auto[x-placement^="bottom"] .arrow {
7980 - top: 0;
7981 -}
7982 -
7983 -.bs-tooltip-bottom .arrow::before, .bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
7265 +.tooltip.top-right .tooltip-arrow {
7984 7266 bottom: 0;
7985 - border-width: 0 0.4rem 0.4rem;
7986 - border-bottom-color: #000;
7267 + right: 5px;
7268 + border-width: 5px 5px 0;
7269 + border-top-color: var(--dark-grey);
7987 7270 }
7988 7271
7989 -.bs-tooltip-left, .bs-tooltip-auto[x-placement^="left"] {
7990 - padding: 0 0.4rem;
7272 +.tooltip.right .tooltip-arrow {
7273 + top: 50%;
7274 + left: 0;
7275 + margin-top: -5px;
7276 + border-width: 5px 5px 5px 0;
7277 + border-right-color: var(--dark-grey);
7991 7278 }
7992 7279
7993 -.bs-tooltip-left .arrow, .bs-tooltip-auto[x-placement^="left"] .arrow {
7280 +.tooltip.left .tooltip-arrow {
7281 + top: 50%;
7994 7282 right: 0;
7995 - width: 0.4rem;
7996 - height: 0.8rem;
7283 + margin-top: -5px;
7284 + border-width: 5px 0 5px 5px;
7285 + border-left-color: var(--dark-grey);
7997 7286 }
7998 7287
7999 -.bs-tooltip-left .arrow::before, .bs-tooltip-auto[x-placement^="left"] .arrow::before {
8000 - left: 0;
8001 - border-width: 0.4rem 0 0.4rem 0.4rem;
8002 - border-left-color: #000;
7288 +.tooltip.bottom .tooltip-arrow {
7289 + top: 0;
7290 + left: 50%;
7291 + margin-left: -5px;
7292 + border-width: 0 5px 5px;
7293 + border-bottom-color: var(--dark-grey);
8003 7294 }
8004 7295
8005 -.tooltip-inner {
8006 - max-width: 200px;
8007 - padding: 0.25rem 0.5rem;
8008 - color: #fff;
8009 - text-align: center;
8010 - background-color: #000;
8011 - border-radius: 0.25rem;
7296 +.tooltip.bottom-left .tooltip-arrow {
7297 + top: 0;
7298 + left: 5px;
7299 + border-width: 0 5px 5px;
7300 + border-bottom-color: var(--dark-grey);
8012 7301 }
8013 7302
8014 -.frm-dropdown-menu.show {
8015 - display: block;
7303 +.tooltip.bottom-right .tooltip-arrow {
7304 + top: 0;
7305 + right: 5px;
7306 + border-width: 0 5px 5px;
7307 + border-bottom-color: var(--dark-grey);
8016 7308 }
8017 7309
8018 -/* End Bootstrap */
8019 -
8020 -.preview.dropdown .dropdown-menu {
8021 - min-width: 205px;
8022 -}
8023 -
8024 7310 .frm_clear {
8025 7311 clear: both;
8026 7312 }
8027 7313
@@ -8059,8 +7345,10 @@
8059 7345 transition: width 0.6s ease;
8060 7346 background-color: #04A4CC;
8061 7347 }
8062 7348
7349 +/* End Bootstrap */
7350 +
8063 7351 .tooltip.frm_tooltip {
8064 7352 position: fixed;
8065 7353 top: auto !important;
8066 7354 bottom: 0 !important;
@@ -8081,25 +7369,93 @@
8081 7369 box-shadow: 5px 5px 25px rgba(0, 0, 0, 0.5);
8082 7370 padding: 10px 40px;
8083 7371 border-top-color: #ccc;
8084 7372 background: var(--sidebar-color);
8085 - color: var(--grey-700);
7373 + color: var(--dark-grey);
8086 7374 border-radius: 0;
8087 7375 opacity: 1;
8088 - font-size: var(--text-sm);
7376 + font-size: 14px;
8089 7377 }
8090 7378
7379 +#frm_styling_form #post-body {
7380 + padding: 20px;
7381 +}
7382 +
7383 +.ui-datepicker-inline.ui-datepicker {
7384 + max-width: 19em;
7385 +}
7386 +
7387 +.default-style-box.howto {
7388 + margin-left: 20px;
7389 + font-style: normal;
7390 +}
7391 +
8091 7392 #frm_custom_css_box {
8092 7393 width: 100%;
8093 7394 }
8094 7395
7396 +#frm_styling_form .wp-picker-container .wp-color-result.button {
7397 + width: 100%;
7398 + overflow: hidden;
7399 + margin: 0 !important;
7400 + height: 32px !important;
7401 + padding: 0 0 0 30px !important;
7402 + border-radius: var(--small-radius);
7403 + border-color: var(--grey-border);
7404 +}
7405 +
7406 +#frm_styling_form .wp-color-result-text {
7407 + line-height: 30px !important;
7408 + font-size: 15px;
7409 + background: #fff !important;
7410 +}
7411 +
7412 +.wp-picker-open + .wp-picker-input-wrap {
7413 + position: absolute;
7414 + margin-left: -87px;
7415 + margin-top: 1px;
7416 + width: 86px;
7417 +}
7418 +
7419 +.wp-picker-container input[type="text"].wp-color-picker {
7420 + border: none;
7421 + padding: 3px;
7422 + font-family: inherit;
7423 + color: var(--dark-grey);
7424 + font-size: 15px;
7425 + width: 100%;
7426 + line-height: 1;
7427 + text-align: center;
7428 +}
7429 +
7430 +.wp-picker-input-wrap .wp-picker-clear {
7431 + display: none !important;
7432 +}
7433 +
7434 +.wp-picker-holder {
7435 + position: absolute;
7436 + z-index: 999;
7437 +}
7438 +
7439 +.frm_end .wp-picker-holder {
7440 + margin-left: -145px;
7441 +}
7442 +
7443 +.frm_end.frm6 .wp-picker-holder {
7444 + margin-left: -86px;
7445 +}
7446 +
7447 +#frm_styling_form div.tabs-panel {
7448 + padding-left: 5px;
7449 + padding-right: 5px;
7450 +}
7451 +
8095 7452 /*form inputs/selects */
8096 7453 .frm_form_field.frm_scroll_box .frm_opt_container,
8097 -.frm-white-body .wrap input[type="text"], /* Cover Views pages */
8098 -.frm-white-body .wrap input[type="search"],
8099 -.frm-white-body .wrap input[type="number"],
8100 -.frm-white-body .wrap select,
8101 -.frm-white-body .wrap textarea,
7454 +#postbox-container-2 input[type="text"],
7455 +#postbox-container-2 input[type="number"],
7456 +#postbox-container-2 select,
7457 +#postbox-container-2 textarea,
8102 7458 button.frm_choose_image_box,
8103 7459 #titlediv input[type="text"],
8104 7460 .frm-fields button.btn,
8105 7461 .frm_wrap textarea,
@@ -8104,11 +7460,9 @@
8104 7460 .frm-fields button.btn,
8105 7461 .frm_wrap textarea,
8106 7462 .frm_wrap input[type="tel"],
8107 7463 .frm_wrap input[type="text"],
8108 -.frm_wrap input[type=search],
8109 7464 .frm_wrap input[type="number"],
8110 -.frm_wrap input[type="date"],
8111 7465 .frm_wrap select,
8112 7466 .wp-admin .frm_wrap select,
8113 7467 .field-group textarea,
8114 7468 .field-group input[type="text"],
@@ -8115,33 +7469,17 @@
8115 7469 .field-group select {
8116 7470 outline: 0;
8117 7471 box-shadow: none;
8118 7472 border-radius: var(--small-radius);
8119 - padding: 5px 14px;
8120 - border-color: var(--grey-300);
8121 - color: var(--grey-800);
8122 - font-size: var(--text-md);
7473 + padding: 6px 9px;
7474 + border-color: var(--grey-border);
7475 + color: var(--dark-grey);
7476 + font-size: 15px;
8123 7477 margin: 0;
8124 7478 background-color: #fff;
8125 - line-height: var(--leading);
7479 + line-height: 1;
8126 7480 }
8127 7481
8128 -.frm_wrap ::-webkit-datetime-edit {
8129 - line-height: var(--leading);
8130 -}
8131 -
8132 -.frm-white-body textarea:focus,
8133 -.frm-white-body input:focus,
8134 -.frm-white-body select:focus,
8135 -.frm_wrap input:focus,
8136 -.frm_wrap select:focus,
8137 -.wp-core-ui .frm_wrap select:focus,
8138 -.frm-btn-group .multiselect.dropdown-toggle:focus,
8139 -.frm_wrap textarea:focus {
8140 - border-color: var(--primary-500) !important;
8141 - box-shadow: none !important;
8142 -}
8143 -
8144 7482 #postbox-container-2 textarea,
8145 7483 .frm_wrap textarea,
8146 7484 .field-group textarea {
8147 7485 line-height: 2;
@@ -8158,12 +7496,19 @@
8158 7496 .wp-admin .frm_wrap select {
8159 7497 max-width: 100%;
8160 7498 }
8161 7499
8162 -.frm_form_field.frm_scroll_box .frm_opt_container {
7500 +.frm_form_field.frm_scroll_box .frm_opt_container,
7501 +.frm_wrap .frm_form_builder textarea,
7502 +.frm_wrap .frm_form_builder input[type="tel"],
7503 +.frm_wrap .frm_form_builder input[type="text"] {
8163 7504 padding: 10px 12px;
8164 7505 }
8165 7506
7507 +.frm_wrap .frm_form_builder input[type="text"].frm_other_input {
7508 + padding: 6px 9px;
7509 +}
7510 +
8166 7511 .frm_wrap input[disabled],
8167 7512 .frm_wrap select[disabled],
8168 7513 .frm_wrap textarea[disabled],
8169 7514 .frm_wrap input[readonly],
@@ -8169,23 +7514,37 @@
8169 7514 .frm_wrap input[readonly],
8170 7515 .frm_wrap select[readonly],
8171 7516 .frm_wrap textarea[readonly],
8172 7517 .frm_wrap input::placeholder {
8173 - color: var(--grey-500);
7518 + color: var(--grey);
8174 7519 }
8175 7520
7521 +#postcustomstuff table input {
7522 + width: 100% !important;
7523 + margin: 0 !important;
7524 +}
7525 +
7526 +#postcustomstuff table td {
7527 + padding: 7px 0 7px 7px !important;
7528 + line-height: 30px;
7529 +}
7530 +
8176 7531 #postcustomstuff table td > div {
8177 7532 /* To override some inline css in add-on */
8178 7533 padding-top: 0 !important;
8179 7534 }
8180 7535
8181 -.wp-admin .frm_wrap .form-table select {
7536 +.wp-admin .frm_wrap .form-table select,
7537 +#postbox-container-2 select,
7538 +.wp-admin .frm_wrap select {
7539 + line-height: 32px;
7540 + height: 32px;
8182 7541 vertical-align: top;
8183 7542 }
8184 7543
8185 7544 .frm_wrap .frm_form_builder select {
8186 - line-height: var(--leading);
8187 - height: var(--text-md);
7545 + line-height: 40px;
7546 + height: 40px;
8188 7547 width: 100%;
8189 7548 }
8190 7549
8191 7550 #postbox-container-2 select,
@@ -8191,25 +7550,11 @@
8191 7550 #postbox-container-2 select,
8192 7551 .wp-admin .frm_wrap select,
8193 7552 .frm_wrap .frm_form_builder select {
8194 7553 height: auto;
8195 - background-position: right 11px top 55%;
7554 + padding: 0 24px 0 12px;
8196 7555 }
8197 7556
8198 -.frm-white-body .tablenav select,
8199 -.frm-white-body .tablenav input[type="text"],
8200 -.wp-admin .frm_wrap .tablenav select,
8201 -.frm_wrap .tablenav input[type="date"],
8202 -.frm_wrap .tablenav input[type="text"] {
8203 - padding-top: 0;
8204 - padding-bottom: 0;
8205 - line-height: 1;
8206 -}
8207 -
8208 -.frm_wrap .tablenav ::-webkit-datetime-edit {
8209 - line-height: 1;
8210 -}
8211 -
8212 7557 .frm-fields button.btn,
8213 7558 .frm-fields textarea,
8214 7559 .frm-fields input[type="text"],
8215 7560 .frm-fields select,
@@ -8221,9 +7566,10 @@
8221 7566 outline: 0;
8222 7567 }
8223 7568
8224 7569 .frm-fields button.btn {
8225 - height: var(--h-md);
7570 + line-height: normal;
7571 + height: auto;
8226 7572 text-align: inherit;
8227 7573 }
8228 7574
8229 7575 .global-font .field-group input[type="text"] {
@@ -8264,9 +7610,9 @@
8264 7610 }
8265 7611
8266 7612 .frm_images_dropdown input[type="radio"]:checked + .frm_image_option_container {
8267 7613 background: #fff !important;
8268 - border-color: var(--primary-500);
7614 + border-color: var(--primary-color);
8269 7615 }
8270 7616
8271 7617 .frm_images_dropdown .frm_text_label_for_image {
8272 7618 padding: 0;
@@ -8294,9 +7640,9 @@
8294 7640 }
8295 7641
8296 7642 .windows::-webkit-scrollbar-thumb,
8297 7643 .windows ::-webkit-scrollbar-thumb {
8298 - background: var(--grey-300);
7644 + background: var(--grey-border);
8299 7645 -webkit-border-radius: var(--border-radius);
8300 7646 -webkit-box-shadow: none;
8301 7647 }
8302 7648
@@ -8318,9 +7664,8 @@
8318 7664 .rtl #frm_top_bar #frm_bs_dropdown {
8319 7665 padding-left: 15px;
8320 7666 }
8321 7667
8322 -.rtl .frm-full-close,
8323 7668 .rtl .frm_wrap .columns-2 .frm-right-panel,
8324 7669 .rtl .frm-right-panel {
8325 7670 border-right-width: 1px;
8326 7671 border-left-width: 0;
@@ -8325,14 +7670,9 @@
8325 7670 border-right-width: 1px;
8326 7671 border-left-width: 0;
8327 7672 }
8328 7673
8329 -.rtl .frm-full-close {
8330 - padding-left: 0;
8331 - padding-right: var(--gap-md);
8332 -}
8333 -
8334 -.rtl .frm-text-right {
7674 +.rtl .frm_right_text {
8335 7675 text-align: left;
8336 7676 }
8337 7677
8338 7678 .rtl .frm_wrap #frm_adv_info ul.category-tabs li:first-child {
@@ -8377,39 +7717,22 @@
8377 7717 right: unset;
8378 7718 left: 2px;
8379 7719 }
8380 7720
7721 +.rtl #frm_upgrade_modal .dismiss i,
7722 +.rtl .frm-inline-modal i,
7723 +.rtl #frm-bulk-modal i,
8381 7724 .rtl .frm_has_shortcodes > i {
8382 7725 right: auto;
8383 7726 left: 5px;
8384 7727 }
8385 7728
7729 +.rtl .frm_code_list.frm-full-hover a span,
8386 7730 .rtl .frm_reply_to_container,
8387 7731 .rtl .frm_bcc_cc_container {
8388 7732 float: left;
8389 7733 }
8390 7734
8391 -.rtl .frm-default-switcher {
8392 - float: left;
8393 - position: relative;
8394 -}
8395 -
8396 -.rtl .frm-with-right-icon .frmsvg {
8397 - right: auto;
8398 - left: 0;
8399 -}
8400 -
8401 -.rtl .frm-inline-modal > a.dismiss {
8402 - left: 13px;
8403 - right: auto;
8404 -}
8405 -
8406 -.rtl.wp-admin .frm_wrap select {
8407 - padding-left: var(--gap-lg) !important;
8408 - padding-right: 5px !important;
8409 - background-position: left 11px top 55%;
8410 -}
8411 -
8412 7735 /* ---------------------------------------------------------------
8413 7736 Clearfix
8414 7737 --------------------------------------------------------------- */
8415 7738 span.clear {
@@ -8451,12 +7774,15 @@
8451 7774 @media only screen and (max-width: 1200px) {
8452 7775 .frm-addons {
8453 7776 grid-template-columns: 1fr 1fr;
8454 7777 }
7778 +
7779 + ul.frm_form_nav > li {
7780 + margin-right: 2.5%;
7781 + }
8455 7782 }
8456 7783
8457 7784 @media only screen and (max-width: 1050px) {
8458 - .frm-white-body,
8459 7785 .frm_wrap {
8460 7786 --biggest-sidebar: 390px;
8461 7787 }
8462 7788
@@ -8466,18 +7792,15 @@
8466 7792
8467 7793 .frm_actions_list {
8468 7794 margin-left: 0;
8469 7795 }
7796 +
7797 + ul.frm_form_nav > li {
7798 + margin-right: 1.5%;
7799 + }
8470 7800 }
8471 7801
8472 7802 @media only screen and (max-width: 960px) {
8473 - .frm-white-body,
8474 - .frm_wrap {
8475 - --gap-sm: 8px;
8476 - --gap-md: 16px;
8477 - --gap-2xl: 24px;
8478 - }
8479 -
8480 7803 .auto-fold #adminmenuwrap {
8481 7804 width: 36px;
8482 7805 }
8483 7806
@@ -8488,40 +7811,36 @@
8488 7811 p.howto {
8489 7812 display: inline-block;
8490 7813 }
8491 7814
8492 - /* Fix: Issue where the admin page content had extra white space to the left on small screens */
8493 - .auto-fold.frm-admin-page-styles:not(.frm-full-screen) .frm_page_container,
8494 - .auto-fold:not(.frm-full-screen) .frm_wrap .frm_page_container {
8495 - left: 36px;
7815 + ul.frm_form_nav {
7816 + clear: left;
7817 + padding-top: 0;
8496 7818 }
8497 7819
8498 - .frm-admin-footer-links {
8499 - padding-left: 36px;
7820 + ul.frm_form_nav > li {
7821 + margin-right: 3.5%;
8500 7822 }
8501 7823
8502 - body.rtl .frm-admin-footer-links {
8503 - padding-right: 36px;
7824 + .frm-full-screen #frm_top_bar {
7825 + padding: 0 10px !important;
8504 7826 }
7827 +
7828 + .frm-full-close {
7829 + padding: 15px 0 10px 10px;
7830 + }
7831 +
7832 + .frm-full-close .frmsvg {
7833 + padding: 0;
7834 + }
8505 7835 }
8506 7836
8507 7837 @media only screen and (max-width: 850px) {
8508 - #frm_bs_dropdown {
8509 - /* There isn't enough room for the title on a screen this size so just hide it. */
8510 - display: none;
8511 - }
8512 -
8513 - .frm-white-body,
8514 7838 .frm_wrap {
8515 7839 --biggest-sidebar: 350px;
8516 7840 --big-sidebar: 350px;
8517 7841 }
8518 7842
8519 - #frm_bs_dropdown .frm_bstooltip {
8520 - /* There isn't enough room for the title on a screen this size so just hide it. */
8521 - display: none !important;
8522 - }
8523 -
8524 7843 .frm_col_one {
8525 7844 clear: none;
8526 7845 }
8527 7846
@@ -8530,9 +7849,10 @@
8530 7849 display: block;
8531 7850 margin: 5px 0;
8532 7851 }
8533 7852
8534 - #frm_top_bar h1 {
7853 + .post-type-frm_display #frm_top_bar h1,
7854 + .frm_page_container #frm_top_bar h1 {
8535 7855 width: auto;
8536 7856 max-width: 200px;
8537 7857 }
8538 7858
@@ -8602,9 +7922,8 @@
8602 7922 }
8603 7923 }
8604 7924
8605 7925 @media only screen and (max-width: 782px) {
8606 - .frm-white-body,
8607 7926 .frm_wrap {
8608 7927 --small-sidebar: 20%;
8609 7928 --medium-sidebar: 35%
8610 7929 }
@@ -8618,9 +7937,9 @@
8618 7937 .frm_wrap #publishing-action {
8619 7938 line-height: normal;
8620 7939 }
8621 7940
8622 - .frm-white-body #screen-meta-links {
7941 + .frm-full-screen #screen-meta-links {
8623 7942 display: none;
8624 7943 }
8625 7944
8626 7945 .frm_wrap .misc-pub-section {
@@ -8679,13 +7998,8 @@
8679 7998 .with_frm_style .frm_checkbox input[type=checkbox] {
8680 7999 width: 25px !important;
8681 8000 }
8682 8001
8683 - .frm_single_entry_page .with_frm_style .frm_radio input[type=radio],
8684 - .frm_single_entry_page .with_frm_style .frm_checkbox input[type=checkbox] {
8685 - width: 18px !important;
8686 - }
8687 -
8688 8002 .wp-list-table.toplevel_page_formidable .column-entries,
8689 8003 .wp-list-table.toplevel_page_formidable .column-form_key,
8690 8004 .wp-list-table.toplevel_page_formidable .column-shortcode,
8691 8005 .wp-list-table.toplevel_page_formidable .column-created_at {
@@ -8699,13 +8013,27 @@
8699 8013 padding: 3px 8px 3px 35%;
8700 8014 text-align: left;
8701 8015 }
8702 8016
8017 + .wp-list-table.toplevel_page_formidable td.column-title:before,
8018 + .wp-list-table.toplevel_page_formidable td.column-id:before {
8019 + display: none !important;
8020 + }
8021 +
8022 + .wp-list-table.toplevel_page_formidable td.column-title,
8023 + .wp-list-table.toplevel_page_formidable td.column-id {
8024 + display: table-cell !important;
8025 + }
8026 +
8703 8027 #form_entries_page .wp-list-table th.frm_hidden,
8704 8028 #form_entries_page .wp-list-table td.frm_hidden {
8705 8029 display: none !important;
8706 8030 }
8707 8031
8032 + ul.frm_form_nav > li {
8033 + margin-right: 15px;
8034 + }
8035 +
8708 8036 .frm-white-body.auto-fold #wpcontent {
8709 8037 padding-left: 0;
8710 8038 }
8711 8039
@@ -8716,13 +8044,11 @@
8716 8044 .frm-addons {
8717 8045 grid-template-columns: 1fr;
8718 8046 }
8719 8047
8720 - .frm-admin-page-styles .frm_page_container,
8721 - .frm_wrap .frm_page_container {
8722 - left: 0 !important;
8723 - top: 46px !important;
8724 - height: calc( 100vh - 46px ) !important;
8048 + .frm_single_entry_page.frm_wrap .frm_page_container {
8049 + height: auto;
8050 + display: block;
8725 8051 }
8726 8052
8727 8053 .frm_single_entry_page.frm_wrap .columns-2 {
8728 8054 display: block;
@@ -8740,22 +8066,13 @@
8740 8066 border-radius: 6px;
8741 8067 }
8742 8068
8743 8069 #wp-content-media-buttons a.frm_insert_form {
8744 - padding: 0 var(--gap-sm);
8070 + padding: 0 15px;
8745 8071 }
8746 -
8747 - .frm-admin-footer-links {
8748 - padding-left: 0;
8749 - }
8750 -
8751 - body.rtl .frm-admin-footer-links {
8752 - padding-right: 0;
8753 - }
8754 8072 }
8755 8073
8756 8074 @media only screen and (max-width: 700px) {
8757 - .frm-white-body,
8758 8075 .frm_wrap {
8759 8076 --biggest-sidebar: 50%;
8760 8077 --big-sidebar: 50%;
8761 8078 }
@@ -8761,9 +8078,8 @@
8761 8078 }
8762 8079 }
8763 8080
8764 8081 @media only screen and (max-width: 600px) {
8765 - .frm-white-body,
8766 8082 .frm_wrap {
8767 8083 --small-sidebar: 45px;
8768 8084 }
8769 8085
@@ -8769,9 +8085,9 @@
8769 8085
8770 8086 .frm-form-setting-tabs a {
8771 8087 visibility: collapse;
8772 8088 font-size: 0;
8773 - padding: 0 var(--gap-sm);
8089 + padding: 0 15px;
8774 8090 }
8775 8091
8776 8092 .frm-form-setting-tabs a .frmsvg,
8777 8093 .frm-form-setting-tabs a i {
@@ -8843,12 +8159,8 @@
8843 8159 .rtl #frm_builder_page .frm_actions_dropdown > .frm-dropdown-menu {
8844 8160 right: auto;
8845 8161 left: 0;
8846 8162 }
8847 -
8848 - .frm_on_submit_type svg {
8849 - display: none;
8850 - }
8851 8163 }
8852 8164
8853 8165 @media only screen and (max-width: 475px) {
8854 8166 #frm_bs_dropdown {
@@ -8864,18 +8176,8 @@
8864 8176 margin-right: 0;
8865 8177 }
8866 8178 }
8867 8179
8868 -/* Firefox */
8869 -@-moz-document url-prefix() {
8870 - .frm-white-body .tablenav select,
8871 - .frm-white-body .tablenav input[type="text"],
8872 - .wp-admin .frm_wrap .tablenav select,
8873 - .frm_wrap .tablenav input[type="text"] {
8874 - padding-top: 5px;
8875 - }
8876 -}
8877 -
8878 8180 /* PRINT */
8879 8181 @media print {
8880 8182 a, .misc-pub-section a {
8881 8183 color: #000 !important;
@@ -8926,9 +8228,9 @@
8926 8228 display: block;
8927 8229 padding: 20px;
8928 8230 }
8929 8231
8930 - .frm_wrap .columns-2,
8232 + .frm_page_container .columns-2,
8931 8233 .frm_wrap .frm_page_container {
8932 8234 height: auto;
8933 8235 display: block;
8934 8236 }
@@ -8965,10 +8267,9 @@
8965 8267 width: 100%;
8966 8268 }
8967 8269 }
8968 8270
8969 -.frm-admin-page-styles #frm-publishing #save_menu_header,
8970 -.frm-admin-page-styles2 #frm-publishing #save_menu_header {
8271 +.frm-admin-page-styles #frm-publishing #save_menu_header {
8971 8272 display: inline-block;
8972 8273 }
8973 8274
8974 8275 /* Change the order of subfields of the Name field in the backend */
@@ -8975,12 +8276,16 @@
8975 8276 .edit_form_item .frm_combo_inputs_container[data-name-layout="last_first"] .frm_form_subfield-first {
8976 8277 order: 2;
8977 8278 }
8978 8279
8280 +.frm-video-wrapper {
8281 + padding: 0 20px;
8282 +}
8283 +
8979 8284 .frm-video-wrapper iframe {
8980 8285 width: 100%;
8981 8286 max-width: 843px;
8982 - border-radius: var(--border-radius);
8287 + border-radius: 10px;
8983 8288 }
8984 8289
8985 8290 #frm_field_group_popup {
8986 8291 position: absolute;
@@ -8986,9 +8291,9 @@
8986 8291 position: absolute;
8987 8292 top: 0;
8988 8293 right: 0;
8989 8294 width: 366px;
8990 - max-height: 231px;
8295 + height: 231px;
8991 8296 border-radius: 8px;
8992 8297 background: #fff;
8993 8298 box-shadow: 0px 20px 48px rgba(40, 47, 54, 0.15);
8994 8299 z-index: 3;
@@ -9006,23 +8311,8 @@
9006 8311 bottom: 50px;
9007 8312 height: 196px;
9008 8313 }
9009 8314
9010 -#frm_field_group_popup > hr {
9011 - margin: 12px 0;
9012 -}
9013 -
9014 -#frm_field_group_popup .frm-cancel-custom-field-group-layout,
9015 -#frm_field_group_popup .frm-save-custom-field-group-layout {
9016 - padding: 4px 18px;
9017 -}
9018 -
9019 -#frm_field_group_popup .frm-cancel-custom-field-group-layout:hover {
9020 - border-color: var(--primary-500) !important;
9021 - color: var(--primary-500);
9022 - background-color: transparent !important;
9023 -}
9024 -
9025 8315 .frm-merge-fields-into-row #frm_field_group_popup .frm-break-field-group {
9026 8316 display: none;
9027 8317 }
9028 8318
@@ -9037,9 +8327,9 @@
9037 8327 font-size: 11px;
9038 8328 line-height: 15px;
9039 8329 text-transform: uppercase;
9040 8330 color: rgba(40, 47, 54, 0.45);
9041 - margin-bottom: 27px;
8331 + margin-bottom: 40px;
9042 8332 }
9043 8333
9044 8334 .frm-row-layout-option {
9045 8335 background: #F6F7FB;
@@ -9044,9 +8334,9 @@
9044 8334 .frm-row-layout-option {
9045 8335 background: #F6F7FB;
9046 8336 box-sizing: border-box;
9047 8337 border-radius: 2px;
9048 - padding: 15px 10px;
8338 + padding: 18px 11px;
9049 8339 }
9050 8340
9051 8341 #frm_field_group_popup .frm-row-layout-option .frm_grid_container {
9052 8342 grid-gap: 0 5%;
@@ -9054,23 +8344,22 @@
9054 8344 }
9055 8345
9056 8346 #frm_field_group_popup .frm-row-layout-option {
9057 8347 cursor: pointer;
9058 - border: 2px solid transparent;
9059 8348 }
9060 8349
9061 8350 #frm_field_group_popup .frm-row-layout-option.frm-active-row-layout,
9062 8351 #frm_field_group_popup .frm-row-layout-option:hover {
9063 - border-color: var(--primary-500);
8352 + outline: 1px solid var(--primary-color);
9064 8353 }
9065 8354
9066 8355 .frm-custom-field-group-layout,
9067 8356 .frm-break-field-group {
9068 - padding: 4px 24px;
8357 + padding: 5px 15px;
9069 8358 cursor: pointer;
9070 - font-size: var(--text-sm);
8359 + font-size: 14px;
9071 8360 line-height: 19px;
9072 - color: rgba(72, 78, 84, 1);
8361 + color: rgba(40, 47, 54, 0.85);
9073 8362 }
9074 8363
9075 8364 .frm-custom-field-group-layout:hover,
9076 8365 .frm-break-field-group:hover {
@@ -9115,13 +8404,12 @@
9115 8404 }
9116 8405
9117 8406 .frm-builder-popup-heading {
9118 8407 font-weight: 600;
9119 - font-size: 11px;
8408 + font-size: 12px;
9120 8409 line-height: 15px;
9121 8410 text-transform: uppercase;
9122 8411 color: rgba(40, 47, 54, 0.45);
9123 - margin-bottom: 7px;
9124 8412 }
9125 8413
9126 8414 .frm-builder-popup-subheading {
9127 8415 font-size: 12px;
@@ -9128,17 +8416,8 @@
9128 8416 line-height: 16px;
9129 8417 color: rgba(40, 47, 54, 0.45);
9130 8418 }
9131 8419
9132 -#frm_field_group_popup input[type="text"] {
9133 - height: 30px;
9134 - border-radius: 3px;
9135 - font-size: 14px;
9136 - padding: 8px;
9137 - color: rgba(84, 95, 110, 1);
9138 - border-color: rgba(40, 47, 54, 0.2);
9139 -}
9140 -
9141 8420 .frm-multiselect-popup-separator {
9142 8421 height: 36px;
9143 8422 width: 1px;
9144 8423 position: relative;
@@ -9145,22 +8424,18 @@
9145 8424 top: 6px;
9146 8425 background: #C4C4C4;
9147 8426 }
9148 8427
8428 +
9149 8429 .frm-sortable-helper,
9150 8430 .frm-multiselect-key-is-down li.form-field:not(.edit_field_type_divider) {
9151 8431 pointer-events: none;
9152 8432 }
9153 8433
9154 -.frm-sortable-helper {
9155 - /* Make sure the item being dragged appears above other form builder fields */
9156 - z-index: 99;
9157 -}
9158 -
9159 8434 #frm_banner {
9160 8435 width: 100%;
9161 8436 color: #fff;
9162 - background: var(--primary-500);
8437 + background: var(--primary-color);
9163 8438 height: 40px;
9164 8439 line-height: 40px;
9165 8440 text-align: center;
9166 8441 position: relative;
@@ -9190,89 +8465,4 @@
9190 8465
9191 8466 .frm-banner-dismiss .frmsvg {
9192 8467 vertical-align: top;
9193 8468 }
9194 -
9195 -.frm-ready-made-solution:not(.frm-search-result) {
9196 - display: none !important;
9197 -}
9198 -
9199 -#frm_new_form_modal .frm-ready-made-solution {
9200 - padding: var(--gap-xs) !important;
9201 - margin: var(--gap-xs) 0 var(--gap-sm);
9202 - display: flex;
9203 - gap: var(--gap-sm);
9204 - position: relative;
9205 - overflow: visible !important;
9206 -}
9207 -
9208 -#frm_new_form_modal .frm-ready-made-solution:after {
9209 - width: 100%;
9210 - height: 1px;
9211 - background: var(--grey-300);
9212 - content: '';
9213 - position: absolute;
9214 - bottom: -10px;
9215 - left: 0;
9216 -}
9217 -
9218 -#frm_new_form_modal .frm-ready-made-solution.frm-search-result:last-of-type::after {
9219 - content: none;
9220 -}
9221 -
9222 -#frm_new_form_modal .frm-solution-details {
9223 - flex: 1;
9224 - display: flex;
9225 - gap: var(--gap-2xs);
9226 - flex-direction: column;
9227 -}
9228 -
9229 -#frm_new_form_modal .frm-ready-made-solution > div:first-child {
9230 - width: 30%;
9231 - text-align: center;
9232 -}
9233 -
9234 -.frm-ready-made-solution h3 ~ a {
9235 - color: var(--primary-500);
9236 -}
9237 -
9238 -.frm-ready-made-solution img {
9239 - max-width: 100%;
9240 - display: block;
9241 - box-shadow: var(--box-shadow-lg);
9242 -}
9243 -
9244 -/* On Submit action */
9245 -.frm_single_on_submit_settings .frm_form_field {
9246 - margin: 8px 0;
9247 -}
9248 -
9249 -.frm_on_submit_type_setting {
9250 - padding: 8px 0;
9251 -}
9252 -
9253 -.frm_on_submit_type label {
9254 - display: flex;
9255 - border: 1px solid var(--grey-border);
9256 - border-radius: var(--small-radius);
9257 - gap: 16px;
9258 - padding: 16px;
9259 - align-items: center;
9260 - justify-content: center;
9261 -}
9262 -
9263 -.frm_on_submit_type input {
9264 - opacity: 0 !important;
9265 - position: absolute;
9266 - z-index: -1;
9267 -}
9268 -
9269 -.frm_on_submit_type input[type="radio"]:checked + label {
9270 - border-color: var(--primary-color);
9271 - box-shadow: 0 0 0 1px var(--primary-color);
9272 -}
9273 -
9274 -#form_settings_page .frm_on_submit_type label:hover,
9275 -.frm_on_submit_type input[type="radio"]:checked + label svg {
9276 - color: var(--primary-color);
9277 -}
9278 -/* End On Submit action */