PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 4.07.01
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v4.07.01
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 +1494 -3124 6.5.3 → 4.07.01 View file →
@@ -1,116 +1,41 @@
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-300: #FECDCA;
32 - --error-500: #F04438;
33 - --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);
34 17 --green: rgb(63, 172, 37);
35 18 --orange: #F15A24;
36 19 --pink: rgb(226, 42, 110);
37 20 --purple: rgb(141, 53, 245);
38 21 --border-radius: 35px;
39 - --small-radius: 8px;
22 + --small-radius: 6px;
40 23 --small-sidebar: 275px;
41 24 --medium-sidebar: 350px;
42 25 --big-sidebar: 390px;
43 26 --biggest-sidebar: 450px;
44 - --text-xs: 12px;
45 - --text-sm: 14px;
46 - --text-md: 16px;
47 - --text-lg: 18px;
48 - --text-xl: 20px;
49 - --h-xs: 24px;
50 - --h-sm: 30px;
51 - --h-md: 36px;
52 - --leading: 1.5;
53 - --gap-2xs: 4px;
54 - --gap-xs: 8px;
55 - --gap-sm: 16px;
56 - --gap-md: 24px;
57 - --gap-lg: 32px;
58 - --gap-xl: 40px;
59 - --gap-2xl: 48px;
60 - --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);
61 - --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);
62 - --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);
63 - --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);
64 27 }
65 28
66 -@font-face {
67 - font-family: 'Inter';
68 - src: url('../fonts/Inter-VariableFont_slnt,wght.ttf?v=1') format('truetype');
69 -}
70 -
71 -.with_frm_style,
72 -.frm-white-body .wpbody-content,
73 -.frm_wrap {
74 - font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
75 -}
76 -
77 -/* Safari 11+ */
78 -@media not all and (min-resolution:.001dpcm) {
79 - @supports (-webkit-appearance:none) and (stroke-color:transparent) {
80 - .with_frm_style,
81 - .frm-white-body .wpbody-content,
82 - .frm_wrap {
83 - -webkit-font-smoothing: antialiased;
84 - }
85 - }
86 -}
87 -
88 -.frm-white-body,
89 -.frm-white-body p,
90 -.frm_wrap,
91 -.frm_wrap p,
92 -.frm-modal,
93 -.frm-white-body .postbox .inside {
94 - font-size: var(--text-sm);
95 - color: var(--grey-500);
96 - line-height: var(--leading);
97 -}
98 -
99 -body:not(.frm-admin-page-styles):not(.frm-admin-page-style) .with_frm_style .frm_form_fields > fieldset {
100 - --fieldset-padding: 15px 0;
101 -}
102 -
103 29 a, .widget .widget-top, .stuffbox h3, .frm-collapsed {
104 30 cursor: pointer;
105 31 text-decoration: none;
106 32 }
107 33
108 -.post-type-frm_display .wrap > #posts-filter,
109 34 .wrap.frm-with-margin,
110 35 #frm_top_bar + .wrap,
111 36 .frm_wrap > .wrap {
112 - margin: var(--gap-sm) var(--gap-md) var(--gap-md);
37 + margin: 10px 40px 30px;
113 38 }
114 39
115 40 .frm-full-screen #wpbody-content > .wrap {
116 41 margin: 0;
@@ -119,12 +44,23 @@
119 44 .post-type-frm_display .wrap {
120 45 margin: 0;
121 46 }
122 47
48 +.columns-2 .frm-right-panel + #post-body-content {
49 + padding-bottom: 26px;
50 + border-left: 1px solid var(--sidebar-hover);
51 +}
52 +
123 53 .toplevel_page_formidable #post-body-content {
124 54 overflow-x: visible;
125 55 }
126 56
57 +.formidable_page_formidable-pro-upgrade #wpfooter,
58 +.toplevel_page_formidable #wpfooter {
59 + border-top: 1px solid #ddd;
60 + background: #fff;
61 +}
62 +
127 63 .frm-full-screen {
128 64 height: 100%;
129 65 overflow: hidden;
130 66 }
@@ -134,57 +70,37 @@
134 70 .frm-full-screen.post-type-frm_display {
135 71 overflow: auto;
136 72 }
137 73
138 -.frm-full-screen #wpadminbar,
139 -.frm-full-screen #adminmenumain,
140 74 .frm-full-screen .wp-header-end {
141 75 display: none;
142 76 }
143 77
144 -body.frm-white-body:not(.frm-full-screen) .mce-fullscreen {
145 - top: 32px;
146 - left: 160px;
147 -}
148 -
149 78 .frm-full-screen #wpbody-content,
150 79 .frm-full-screen #wpbody,
151 80 .frm-full-screen #wpcontent {
152 - padding: 0;
81 + padding-bottom: 0;
153 82 overflow: hidden;
154 - margin: 0 !important;
155 83 }
156 84
157 -.frm-white-body #wpbody-content {
158 - position: relative; /* For screen meta links */
159 - padding-bottom: 0;
160 -}
161 -
162 85 .post-new-php.post-type-frm_display #screen-meta-links,
163 -.post-php.post-type-frm_display #screen-meta-links {
86 +.post-php.post-type-frm_display #screen-meta-links,
87 +.frm-full-screen #wpfooter {
164 88 display: none;
165 89 }
166 90
167 -.frm-white-body #screen-meta-links {
168 - position: fixed;
169 - bottom: 0;
170 - right: 20px;
91 +.frm-white-body #screen-meta-links .screen-meta-toggle {
92 + position: absolute;
93 + right: 160px;
94 + box-shadow: none;
95 + border-bottom-left-radius: var(--small-radius);
96 + border-bottom-right-radius: var(--small-radius);
171 97 }
172 98
173 -.frm-full-screen #screen-meta-links .screen-meta-toggle {
174 - right: 55px;
175 -}
176 -
177 99 .frm-white-body #screen-meta-links .show-settings {
178 - border-radius: var(--small-radius) var(--small-radius) 0 0;
179 - border: 1px solid var(--grey-300);
180 - border-bottom: none;
100 + box-shadow: none;
181 101 }
182 102
183 -.frm-white-body.frm-lite #screen-meta-links .screen-meta-toggle {
184 - right: 125px; /* Don't cover the lite upgrade button */
185 -}
186 -
187 103 .frm-white-body #screen-meta {
188 104 margin: 0;
189 105 }
190 106
@@ -192,9 +108,9 @@
192 108 color: var(--grey);
193 109 }
194 110
195 111 .frm-white-body .columns-2 {
196 - border-bottom: 1px solid var(--grey-300);
112 + border-bottom: 1px solid var(--grey-border);
197 113 }
198 114
199 115 .frm-full-screen .columns-2 {
200 116 border: none;
@@ -224,13 +140,8 @@
224 140 .frm_wrap .tablenav {
225 141 margin-bottom: 10px;
226 142 }
227 143
228 -.frm-white-body .tablenav .actions select,
229 -.wp-admin .frm_wrap .tablenav select {
230 - margin-right: var(--gap-xs);
231 -}
232 -
233 144 .tablenav .actions .button {
234 145 margin-top: 1px;
235 146 }
236 147
@@ -246,17 +157,17 @@
246 157 background: #fff;
247 158 }
248 159
249 160 .frm-white-body table.widefat th {
250 - font-size: var(--text-md);
161 + font-size: 16px;
251 162 }
252 163
253 164 .frm-white-body table.widefat th a {
254 - color: var(--grey-700);
165 + color: var(--dark-grey);
255 166 }
256 167
257 168 .frm-white-body table.widefat strong a {
258 - color: var(--primary-700);
169 + color: var(--primary-hover);
259 170 }
260 171
261 172 .frm-scroll-box {
262 173 clear: both;
@@ -261,9 +172,9 @@
261 172 .frm-scroll-box {
262 173 clear: both;
263 174 overflow: auto;
264 175 max-height: 405px;
265 - border: 1px solid var(--grey-300);
176 + border: 1px solid var(--grey-border);
266 177 border-radius: var(--small-radius);
267 178 }
268 179
269 180 .frm_form_field.frm_scroll_box .frm_opt_container {
@@ -268,9 +179,9 @@
268 179
269 180 .frm_form_field.frm_scroll_box .frm_opt_container {
270 181 height: 100px;
271 182 overflow: auto;
272 - border: 1px solid var(--grey-300);
183 + border: 1px solid var(--grey-border);
273 184 }
274 185
275 186 .frm-short-list {
276 187 overflow: auto;
@@ -277,9 +188,9 @@
277 188 max-height: 190px;
278 189 }
279 190
280 191 .frm-white-body table.frm-border td {
281 - font-size: var(--text-sm);
192 + font-size: 14px;
282 193 }
283 194
284 195 .frm-white-body .striped > tbody > :nth-child(odd) {
285 196 background-color: #fff;
@@ -293,149 +204,44 @@
293 204 float: right;
294 205 }
295 206
296 207 #frm_top_bar {
297 - display: flex;
298 - gap: var(--gap-sm);
208 + display: block;
299 209 width: 100%;
300 - height: 72px;
210 + max-height: 100px;
211 + padding: 25px 40px 25px;
301 212 margin: 0;
302 213 box-sizing: border-box;
303 214 text-align: center;
304 - padding: 0 var(--gap-md);
305 215 }
306 216
307 -#frm_top_bar > .frm-full-close:last-child,
308 -#frm_top_bar > #frm-publishing:last-child {
309 - margin-left: auto;
310 -}
311 -
312 -#frm_top_bar {
313 - border-bottom: 1px solid var(--grey-300);
314 - padding: 0 var(--gap-md);
217 +.post-type-frm_display:not(.edit-php) #frm_top_bar,
218 +.frm-full-screen.post-type-frm_display #frm_top_bar,
219 +.frm_page_container #frm_top_bar {
220 + border-bottom: 1px solid var(--grey-border);
221 + padding: 0 20px;
315 222 overflow: visible;
316 223 }
317 224
318 -.frm-white-body h1,
319 -.frm-white-body h2,
320 -.frm-white-body h3,
321 -.frm-white-body h4 {
322 - color: var(--grey-900);
323 - font-weight: 400;
324 - line-height: var(--leading) !important;
225 +.frm-full-screen #frm_top_bar {
226 + padding: 0 15px !important;
325 227 }
326 228
327 -.frm-white-body .wrap h1,
328 -.frm-white-body h1 {
329 - font-size: var(--text-xl);
330 -}
331 -
332 -.frm-white-body .wrap h2,
333 -.frm-white-body h2 {
334 - font-size: var(--text-lg);
335 -}
336 -
337 -.frm-white-body .wrap h3,
338 -.frm-white-body h3 {
339 - font-size: var(--text-md);
340 -}
341 -
342 -.frm-white-body .wrap h4,
343 -.frm-white-body h4 {
344 - font-size: var(--text-sm);
345 - font-weight: 500;
346 -}
347 -
348 -/* Override CSS in Views plugin. */
349 -.frm-views-editor-body .frm_page_container #frm_top_bar h1 {
350 - padding: 0 !important;
351 - color: var(--grey-900);
352 - font-size: var(--text-xl) !important;
353 -}
354 -
355 -.post-type-frm_display .frm_top_left {
356 - padding-bottom: 0 !important;
357 -}
358 -
359 -.frm-new-table-view-option.frm-selected-table-view-option {
360 - border-radius: var(--small-radius);
361 - background: var(--primary-25);
362 -}
363 -
364 -.frm-views-editor-body #frm_adv_info .tabs-panel { /* Views sidebar */
365 - padding-left: 4px;
366 - padding-right: 4px;
367 -}
368 -
369 -#frm_edit_box_content_modal .frm_modal_footer {
370 - padding-top: var(--gap-sm);
371 - border-top: 1px solid var(--grey-300);
372 -}
373 -
374 -#frm_edit_box_content_modal .frm_modal_footer > div {
375 - display: flex;
376 - justify-content: space-between;
377 -}
378 -
379 -#frm_edit_box_content_modal #frm_modal_box_select_area,
380 -#frm_edit_box_content_modal #frm_box_content_wysiwyg_wrapper,
381 -#frm_edit_box_content_modal .frm_modal_content {
382 - max-height: calc(100vh - 176px) !important;
383 -}
384 -
385 -#frm_edit_box_content_modal #frm_modal_box_select_area {
386 - height: calc(100vh - 176px) !important;
387 -}
388 -
389 -#frm_edit_box_content_modal #wp-content-editor-tools {
390 - padding-top: 0;
391 -}
392 -
393 -#frm_edit_box_content_modal.frm-modal .postbox .frm-modal-title + div:last-child {
394 - right: var(--gap-md);
395 -}
396 -
397 -.frm_code_list.frm-full-hover .frm-dropdown-view a {
398 - flex-direction: row-reverse; /* Switch in the HTML */
399 -}
400 -
401 -#frm_view_editor_left.frm-right-panel .accordion-section-title:before {
402 - content: '' !important;
403 - margin: 0;
404 -}
405 -/** End Temporary View CSS */
406 -
407 -.frm-upgrade-bar {
408 - background: rgba(188, 224, 253, 0.23);
409 - border-bottom: 1px solid var(--sidebar-hover);
410 - padding: 3px 0 3px 40px;
411 - font-size: 95%;
412 -}
413 -
414 -.frm-upgrade-bar span {
415 - opacity: .9;
416 -}
417 -
418 229 a h1 .frmsvg {
419 - color: var(--grey-400);
420 - vertical-align: middle;
421 - min-width: var(--text-sm);
230 + color: var(--medium-grey);
231 + vertical-align: baseline;
422 232 }
423 233
424 -a .frmsvg {
425 - color: currentColor;
426 -}
427 -
428 234 .frm_wrap .view-switch a.current:before,
429 -.frm-white-body a,
430 -.frm_wrap a,
431 -.frm_wrap a i {
235 +a .frmsvg,
236 +.frm_wrap a i,
237 +.frm_wrap a {
432 238 color: var(--primary-color);
433 239 }
434 240
435 241 .frm_wrap a:active,
436 242 .frm_wrap a:hover {
437 - color: var(--primary-700);
243 + color: var(--primary-hover);
438 244 box-shadow: none;
439 245 }
440 246
441 247 .post-type-frm_display a:focus,
@@ -449,30 +255,34 @@
449 255 white-space: nowrap;
450 256 max-width: 250px;
451 257 overflow: hidden;
452 258 text-overflow: ellipsis;
453 - align-self: center;
454 259 }
455 260
456 -.post-type-frm_display .frm_top_left,
457 261 .frm_top_left.frm_top_wide {
458 262 max-width: 100%;
459 263 }
460 264
461 -.post-type-frm_display .frm_nav_bar .frm-header-logo,
462 -.frm_nav_bar .frm-header-logo {
463 - margin: 18px 0 10px;
265 +.frm-header-logo,
266 +.edit-php.post-type-frm_display .frm-header-logo {
267 + float: left;
268 + margin: 0 15px 0 0;
464 269 }
465 270
466 -#frm_top_bar .frm_form_nav {
467 - flex: 1;
271 +.frm-full-screen.post-type-frm_display .frm-header-logo,
272 +.post-type-frm_display .frm-header-logo,
273 +.frm_page_container .frm-header-logo {
274 + margin: 13px 0 0;
468 275 }
469 276
277 +.frm_page_container .frm-header-logo {
278 + margin-bottom: 6px;
279 +}
280 +
470 281 ul.frm_form_nav {
471 282 margin: 0 auto;
472 - padding-top: 18px;
283 + padding-top: 19px;
473 284 display: block;
474 - min-width: 240px;
475 285 }
476 286
477 287 .nav-tab-wrapper.frm_form_nav {
478 288 padding: 0 25px;
@@ -478,9 +288,9 @@
478 288 padding: 0 25px;
479 289 }
480 290
481 291 ul.frm_form_nav > li {
482 - margin: 0 min(3.5%, 32px) 0 0;
292 + margin: 0 3.5% 0 0;
483 293 display: inline-block;
484 294 }
485 295
486 296 .post-type-frm_display #advanced-sortables h2.hndle,
@@ -490,12 +300,13 @@
490 300 .frm_form_nav > li > a {
491 301 font-size: 1.3em;
492 302 text-decoration: none;
493 303 display: block;
494 - padding: 6px 2px 4px;
304 + padding: 5px 2px 15px;
495 305 font-weight: 500;
496 - color: var(--grey-700);
497 - border-bottom: 2px solid transparent;
306 + color: var(--dark-grey);
307 + border-bottom: 3px solid transparent;
308 + letter-spacing: 1px;
498 309 }
499 310
500 311 .post-type-frm_display.js .postbox .handlediv .toggle-indicator:before {
501 312 margin-top: 10px;
@@ -509,16 +320,10 @@
509 320 -webkit-box-shadow: none;
510 321 box-shadow: none;
511 322 }
512 323
513 -.frm_form_nav > li > a {
514 - font-size: var(--text-md);
515 - font-weight: 400;
516 - color: var(--grey-500);
517 -}
518 -
519 324 .frm_form_nav > li > a:hover {
520 - border-color: var(--primary-700);
325 + border-color: var(--primary-hover);
521 326 }
522 327
523 328 .frm_form_nav .frm-dropdown-menu a:hover {
524 329 background-color: #eaf2fa;
@@ -526,27 +331,24 @@
526 331
527 332 .post-type-frm_display .frm_form_nav .nav-tab-active,
528 333 .post-type-frm_display .frm_form_nav .nav-tab-active:hover,
529 334 .frm_form_nav > li a.current_page {
530 - color: var(--primary-500);
531 - border-color: var(--primary-500);
335 + color: var(--primary-color);
336 + border-color: var(--primary-color);
532 337 background: transparent;
533 - opacity: 1;
534 - font-weight: 600;
535 338 }
536 339
537 340 .frm-full-close {
538 341 display: none;
539 - padding-left: var(--gap-md);
540 - border: 0 solid var(--grey-300);
541 - border-left-width: 1px; /* Make RTL a bit less maintenance */
342 + float: right;
343 + padding: 15px 0 14px 12px;
344 + border-left: 1px solid var(--grey-border);
542 345 height: 100%;
543 346 box-sizing: border-box;
544 347 }
545 348
546 349 .frm-full-screen .frm-full-close {
547 - display: flex;
548 - align-items: center;
350 + display: block;
549 351 }
550 352
551 353 .frm-full-close a {
552 354 display: block;
@@ -555,49 +357,57 @@
555 357 .frm-full-close .frmsvg {
556 358 font-size: 20px;
557 359 width: 20px;
558 360 height: 20px;
559 - color: var(--grey-500);
361 + padding: 5px;
362 + color: var(--grey);
560 363 }
561 364
562 -#frm_top_bar h1 {
365 +.edit-php.post-type-frm_display #frm_top_bar h1,
366 +.frm_wrap #frm_top_bar h1 {
367 + font-size: 22px;
563 368 font-weight: 400;
564 369 padding: 0;
565 370 margin: 0;
566 - color: var(--grey-900);
567 - display: inline-flex;
568 - gap: var(--gap-sm);
569 - align-items: center;
371 + color: var(--medium-grey);
372 + display: inline-block;
373 + line-height: 1.4;
374 +}
375 +
376 +.frm-full-screen.post-type-frm_display #frm_top_bar h1,
377 +.post-type-frm_display #frm_top_bar h1,
378 +.frm_page_container #frm_top_bar h1 {
379 + margin: 0 15px;
380 + padding: 20px 0 0;
570 381 text-align: left;
571 382 width: 200px;
383 + line-height: 1.16;
572 384 }
573 385
574 -#frm_top_bar h1 span {
386 +.frm-full-screen.post-type-frm_display #frm_top_bar h1 span,
387 +.post-type-frm_display #frm_top_bar h1 span,
388 +.frm_page_container #frm_top_bar h1 span {
389 + font-size: 19px;
575 390 max-width: 175px;
576 391 text-overflow: ellipsis;
577 392 overflow: hidden;
578 393 white-space: nowrap;
579 394 display: inline-block;
580 - vertical-align: bottom;
581 395 }
582 396
583 -#frm_top_bar ul.frm_form_nav,
584 -#frm_top_bar .frm-header-logo,
585 -#frm_top_bar #frm_bs_dropdown {
586 - align-self: center;
587 - margin-top: 0;
588 - margin-bottom: 0;
589 - padding-top: 0;
397 +#frm_top_bar h1,
398 +#frm_top_bar h2 {
399 + color: var(--medium-grey);
590 400 }
591 401
592 -#frm_top_bar .frm-header-logo {
593 - display: flex; /* Get rid of extra padding below logo */
402 +#frm_top_bar #frm_bs_dropdown {
403 + float: left;
594 404 }
595 405
596 406 #frm_top_bar h2 {
597 407 float: left;
598 - margin: 0 0 0 var(--gap-sm);
599 - padding: 2px 0 2px var(--gap-sm);
408 + margin: 0 0 0 15px;
409 + padding: 2px 0 2px 15px;
600 410 font-weight: normal;
601 411 border-left: 2px solid var(--grey);
602 412 }
603 413
@@ -605,19 +415,26 @@
605 415 margin-top: 0;
606 416 }
607 417
608 418 #frm-publishing {
609 - min-width: 225px;
610 - align-self: center;
611 - align-items: center;
612 - display: flex;
613 - flex-direction: row-reverse;
614 - gap: 0 var(--gap-sm);
615 - flex-wrap: wrap;
419 + float: right;
420 + margin-top: 15px;
421 + width: 225px;
422 + min-height: 10px;
616 423 }
617 424
425 +#frm-publishing #publishing-action,
426 +#frm-publishing #preview-action,
427 +#frm-preview-action,
428 +#frm-publishing > input[type=submit],
429 +#frm-publishing > .button,
430 +#frm-publishing > button {
431 + float: right;
432 + margin: 0 10px 0 0;
433 +}
434 +
618 435 .frm_wrap .postbox {
619 - border-color: var(--grey-300);
436 + border-color: var(--grey-border);
620 437 border-radius: 6px;
621 438 box-shadow: none;
622 439 }
623 440
@@ -625,9 +442,9 @@
625 442 cursor: default;
626 443 padding: 10px 20px;
627 444 margin: 0;
628 445 line-height: 1.4em;
629 - border-color: var(--grey-300);
446 + border-color: var(--grey-border);
630 447 }
631 448
632 449 .frm-pre-hndle {
633 450 font-size: 15px;
@@ -638,12 +455,8 @@
638 455 .frm-empty-row {
639 456 display: none;
640 457 }
641 458
642 -.frm-child-row {
643 - box-shadow: 5px 0px 0px 0px inset var(--sidebar-hover);
644 -}
645 -
646 459 .frm_animate_bg {
647 460 transition: background 200ms linear, color 200ms linear;
648 461 }
649 462
@@ -651,48 +464,16 @@
651 464 clear: both;
652 465 margin: 0;
653 466 }
654 467
655 -.frm_wrap .subsubsub a {
656 - line-height: var(--leading);
657 - font-size: var(--text-sm);
658 -}
659 -
660 -.frm-admin-page-styles .frm_page_container,
661 -.frm_wrap .frm_page_container { /* Use .frm_wrap to avoid messing up Views editor layout */
468 +.frm_wrap .frm_page_container {
662 469 height: calc( 100vh - 32px );
663 470 display: flex;
664 471 flex-direction: column;
665 472 overflow: hidden;
666 473 padding-top: 0;
667 - position: fixed;
668 - top: 32px;
669 - bottom: 0;
670 - left: 0;
671 - right: 0;
672 474 }
673 475
674 -.frm-admin-page-translate .frm_wrap .frm_page_container, .frm-admin-page-update_translations .frm_wrap .frm_page_container {
675 - position: static;
676 -}
677 -
678 -.auto-fold.frm-admin-page-styles .frm_page_container,
679 -.auto-fold .frm_wrap .frm_page_container {
680 - left: 160px;
681 -}
682 -
683 -.folded.frm-admin-page-styles .frm_page_container,
684 -.folded .frm_wrap .frm_page_container {
685 - left: 38px;
686 -}
687 -
688 -.frm-full-screen.frm-admin-page-styles .frm_page_container,
689 -.frm-full-screen .frm_wrap .frm_page_container {
690 - height: 100vh;
691 - top: 0;
692 - left: 0;
693 -}
694 -
695 476 .frm-full-screen.frm-admin-page-entries .frm_page_container,
696 477 .frm-new-entry .frm_page_container,
697 478 .frm-admin-page-reports .frm_page_container,
698 479 .frm_list_entry_page .frm_page_container {
@@ -703,22 +484,16 @@
703 484 .frm-new-entry .columns-2 {
704 485 border: none;
705 486 }
706 487
707 -.frm-white-body #frm_top_bar,
708 -.frm-white-body .columns-2 {
488 +.frm_wrap #frm_top_bar,
489 +.frm_wrap .columns-2 {
709 490 flex: 0 0 auto;
710 491 }
711 492
712 -.columns-2 .frm-right-panel + div {
713 - padding-bottom: var(--gap-md);
714 - border-left: 1px solid var(--sidebar-hover);
715 -}
716 -
717 -.columns-2 .frm-right-panel + div,
718 493 .frm_wrap #post-body-content {
719 494 padding-bottom: 0;
720 - padding-top: var(--gap-sm);
495 + padding-top: 20px;
721 496 margin-bottom: 0;
722 497 background: #fff;
723 498 width: auto;
724 499 float: none;
@@ -724,17 +499,16 @@
724 499 float: none;
725 500 flex: 2;
726 501 }
727 502
728 -.frm-white-body .columns-2 {
503 +.frm_wrap .columns-2 {
729 504 flex: 1;
730 505 display: flex;
731 506 overflow: hidden;
732 507 }
733 508
734 -.frm-white-body .columns-2 > div {
509 +.frm_wrap .columns-2 > div {
735 510 overflow-y: auto;
736 - box-sizing: border-box;
737 511 }
738 512
739 513 .frm_wrap .columns-2 .frm-right-panel,
740 514 .frm-right-panel {
@@ -781,9 +555,9 @@
781 555
782 556 .frm-default-switcher a.current,
783 557 .frm-default-switcher a.current .frmsvg,
784 558 .frm-default-switcher a.current i {
785 - color: var( --primary-500);
559 + color: var( --primary-color);
786 560 }
787 561
788 562 #new_fields,
789 563 .frm-has-modal,
@@ -791,15 +565,41 @@
791 565 position: relative;
792 566 }
793 567
794 568 .frm-inline-modal.postbox {
569 + border-color: var(--blue-border);
795 570 background: #fff;
796 571 }
797 572
573 +#frm_upgrade_modal .dismiss .frmsvg,
574 +.frm-inline-modal .frmsvg,
575 +#frm-bulk-modal .frmsvg,
576 +.frm_has_shortcodes > .frmsvg,
577 +#frm_upgrade_modal .dismiss i,
578 +.frm-inline-modal i,
579 +#frm-bulk-modal i,
580 +.frm_has_shortcodes > i {
581 + top: 37px;
582 + right: 5px;
583 + margin-top: -9px;
584 + padding: 5px;
585 + font-size: 10px;
586 + height: 10px;
587 + width: 10px;
588 + line-height: 9px;
589 + font-weight: bold;
590 +}
591 +
592 +#frm_upgrade_modal .dismiss .frmsvg,
593 +.frm-inline-modal .frmsvg,
594 +#frm-bulk-modal .frmsvg,
798 595 .frm_has_shortcodes .frmsvg,
799 -.frm_has_shortcodes i:not([class*=mce-]) {
596 +#frm_upgrade_modal .dismiss i,
597 +.frm-inline-modal i,
598 +#frm-bulk-modal i,
599 +.frm_has_shortcodes i {
800 600 position: absolute;
801 - color: var(--primary-500);
601 + color: var(--primary-color);
802 602 border-radius: 50%;
803 603 border: 1px solid transparent;
804 604 z-index: 100;
805 605 text-align: center;
@@ -804,8 +604,51 @@
804 604 z-index: 100;
805 605 text-align: center;
806 606 }
807 607
608 +#frm_info_modal .dismiss .frmsvg,
609 +#frm_confirm_modal .dismiss .frmsvg,
610 +#frm_upgrade_modal .dismiss .frmsvg,
611 +#frm_info_modal .dismiss i,
612 +#frm_confirm_modal .dismiss i,
613 +#frm_upgrade_modal .dismiss i {
614 + top: 7px;
615 + right: 7px;
616 +}
617 +
618 +#frm-bulk-modal .frmsvg,
619 +#frm-bulk-modal i {
620 + top: 15px;
621 + right: 7px;
622 +}
623 +
624 +.frm-inline-modal .frmsvg,
625 +.frm-inline-modal i {
626 + top: 18px;
627 + right: 7px;
628 + font-size: 11px;
629 + height: 11px;
630 + width: 11px;
631 +}
632 +
633 +#frm_upgrade_modal .dismiss:hover .frmsvg,
634 +.frm-inline-modal .dismiss:hover .frmsvg,
635 +#frm-bulk-modal .dismiss:hover .frmsvg,
636 +#frm_upgrade_modal .dismiss i:hover,
637 +.frm-inline-modal i:hover,
638 +#frm-bulk-modal i:hover {
639 + background: var(--sidebar-color);
640 +}
641 +
642 +#frm_upgrade_modal .dismiss .frmsvg,
643 +.frm-inline-modal .dismiss .frmsvg,
644 +#frm-bulk-modal .dismiss .frmsvg,
645 +#frm_upgrade_modal .dismiss .frm_close_icon,
646 +.frm-inline-modal .frm_close_icon,
647 +#frm-bulk-modal .frm_close_icon {
648 + border-color: var(--primary-color);
649 +}
650 +
808 651 .frm_has_shortcodes input,
809 652 .frm_has_shortcodes textarea {
810 653 padding-left: 18px;
811 654 box-sizing: border-box;
@@ -812,11 +655,13 @@
812 655 }
813 656
814 657 #form_settings_page #frm_adv_info {
815 658 display: none;
659 + position: absolute;
816 660 top: 0;
817 - width: 310px;
818 - max-height: 315px;
661 + left: 0;
662 + width: 300px;
663 + max-height: 350px;
819 664 min-height: 200px;
820 665 overflow-y: scroll;
821 666 z-index: 100;
822 667 }
@@ -827,14 +672,10 @@
827 672 width: var(--small-sidebar);
828 673 min-width: var(--small-sidebar);
829 674 }
830 675
831 -#form_global_settings .frm_grid_container {
832 - gap: 0 var(--gap-md);
833 -}
834 -
835 676 .frm-inner-content {
836 - padding: var(--gap-md);
677 + padding: 10px 25px;
837 678 }
838 679
839 680 .post-type-frm_display #poststuff {
840 681 padding: 0 0 10px 40px;
@@ -900,17 +741,18 @@
900 741 }
901 742
902 743 .frm-right-panel .frm_field_list #frm-insert-fields {
903 744 max-height: none;
904 - font-size: var(--text-sm);
745 + font-size: 14px;
905 746 padding: 0;
906 747 }
907 748
908 -.frm-nav-tabs {
749 +.frm-nav-tabs,
750 +#frm-bulk-modal h2 {
909 751 margin: 10px 0 20px;
910 - padding: 0 var(--gap-sm);
752 + padding: 0 15px;
911 753 display: block;
912 - border-bottom: 1px solid var(--grey-300);
754 + border-bottom: 2px solid var(--sidebar-hover);
913 755 }
914 756
915 757 #frm-nav-tabs {
916 758 position: -webkit-sticky;
@@ -921,20 +763,11 @@
921 763 margin-top: 0;
922 764 padding-top: 5px;
923 765 }
924 766
925 -.frm_form_settings #frm_adv_info #frm-nav-tabs {
926 - background-color: #fff;
927 - margin: 0 -4px;
928 -}
929 -
930 -.frm_form_settings span.frm-with-right-icon {
931 - display: block;
932 -}
933 -
934 767 .frm-inline-modal .frm-nav-tabs,
935 768 #frm_adv_info .frm-nav-tabs {
936 - margin: 5px 0 0;
769 + margin: 5px 0 10px;
937 770 }
938 771
939 772 #frm_adv_info .frm-nav-tabs.frm-compact-nav {
940 773 padding-right: 0;
@@ -940,25 +773,23 @@
940 773 padding-right: 0;
941 774 padding-left: 20px;
942 775 }
943 776
777 +#frm-bulk-modal h2,
944 778 .frm-nav-tabs li {
945 779 display: inline-block;
780 + font-size: 15px;
946 781 margin: 0;
947 782 }
948 783
784 +#frm-bulk-modal h2,
949 785 .frm-nav-tabs a {
950 - color: var(--grey-700);
786 + color: var(--grey);
951 787 padding: 10px 1px;
952 788 margin: 0 9px;
953 789 border-bottom: 2px solid transparent;
954 790 }
955 791
956 -.frm_form_settings #frm_adv_info .frm-nav-tabs a {
957 - padding: 5px 1px;
958 - color: var(--grey-500);
959 -}
960 -
961 792 .frm-nav-tabs.frm-compact-nav a {
962 793 margin: 0 5px;
963 794 }
964 795
@@ -963,41 +794,36 @@
963 794 }
964 795
965 796 .frm-nav-tabs a {
966 797 display: block;
967 - opacity: .9;
968 798 }
969 799
970 800 #frm_adv_info .frm-nav-tabs a {
971 - color: var(--grey-700);
801 + color: var(--dark-grey);
972 802 }
973 803
804 +#frm-bulk-modal h2,
974 805 .frm-nav-tabs a:hover,
975 806 .frm-nav-tabs .frm-tabs a {
976 - color: var(--primary-500) !important;
977 - border-color: var(--primary-500);
807 + color: var(--primary-color) !important;
808 + border-color: var(--primary-color);
978 809 }
979 810
980 -.frm_form_settings #frm_adv_info .frm-nav-tabs .frm-tabs a {
981 - font-weight: 500;
811 +#frm-bulk-modal h3,
812 +#frm-bulk-modal h2 {
813 + font-size: 16px;
814 + margin-left: 20px;
815 + font-weight: 400;
982 816 }
983 817
984 -#frm-bulk-modal .howto,
985 818 #frm-bulk-modal h3 {
986 - font-size: var(--text-sm);
987 - font-weight: 400;
988 - margin: 5px 0 10px;
819 + margin: 5px 20px 10px;
989 820 color: var(--grey);
990 821 }
991 822
992 -#frm-bulk-modal h3 {
993 - margin-left: 20px;
994 -}
995 -
996 -.frm-right-panel a.frm_add_logic_link,
997 823 .frm-right-panel h3 {
998 - color: var(--grey-700);
999 - font-size: var(--text-lg);
824 + color: var(--dark-grey);
825 + font-size: 20px;
1000 826 font-weight: 400;
1001 827 border-top: 2px solid var(--sidebar-hover);
1002 828 margin: 0;
1003 829 }
@@ -1007,17 +833,10 @@
1007 833 border-top: none;
1008 834 padding-top: 0 !important;
1009 835 }
1010 836
1011 -.frm-flex-justify,
1012 -.frm-right-panel .frm-single-settings h3 {
1013 - display: flex;
1014 - justify-content: space-between;
1015 - align-items: center;
1016 -}
1017 -
1018 837 .frm-right-panel h3 i {
1019 - color: var(--grey-700);
838 + color: var(--dark-grey);
1020 839 float: right;
1021 840 width: 16px;
1022 841 cursor: pointer;
1023 842 }
@@ -1079,12 +898,8 @@
1079 898 .frm_wrap #frm-categorydiv {
1080 899 border-right: none;
1081 900 }
1082 901
1083 -#frm_adv_info #frm-conditionals {
1084 - padding-top: var(--gap-sm);
1085 -}
1086 -
1087 902 #postbox-container-1 #taxonomy-linkcategory #frm-html-tags {
1088 903 display: none;
1089 904 max-height: none;
1090 905 }
@@ -1092,53 +907,12 @@
1092 907 #postbox-container-1 .frm_field_list #frm-insert-fields .frmbutton.dropdown {
1093 908 position: relative;
1094 909 }
1095 910
1096 -/* Admin footer */
1097 -.frm-white-body #footer-upgrade {
911 +.toplevel_page_formidable #footer-upgrade {
1098 912 display: none;
1099 913 }
1100 914
1101 -.frm-admin-footer-links,
1102 -.frm-admin-footer-links-nav,
1103 -.frm-admin-footer-links-socials {
1104 - display: flex;
1105 - justify-content: center;
1106 -}
1107 -
1108 -.frm-admin-footer-links {
1109 - gap: var(--gap-2xs);
1110 - flex-direction: column;
1111 - text-align: center;
1112 - padding: var(--gap-xl) 0 var(--gap-lg) 160px;
1113 - font-size: var(--text-xs);
1114 - color: var(--grey-400);
1115 -}
1116 -
1117 -body.rtl .frm-admin-footer-links {
1118 - padding-left: unset;
1119 - padding-right: 160px;
1120 -}
1121 -
1122 -body.frm-hidden-overflow {
1123 - height: 100%;
1124 - overflow: hidden;
1125 -}
1126 -
1127 -.frm-admin-footer-links-nav {
1128 - gap: var(--gap-2xs);
1129 - margin-bottom: var(--gap-xs);
1130 -}
1131 -
1132 -.frm-admin-footer-links-socials {
1133 - gap: var(--gap-xs);
1134 -}
1135 -
1136 -.frm-admin-footer-links-socials a {
1137 - color: var(--grey-400);
1138 -}
1139 -/* End Admin footer */
1140 -
1141 915 .frm_list_entry_page h2 {
1142 916 float: left;
1143 917 }
1144 918
@@ -1145,8 +919,13 @@
1145 919 .frm_list_entry_page h2 + .error {
1146 920 clear: both;
1147 921 }
1148 922
923 +#titlediv #title {
924 + line-height: 1.5;
925 + height: auto;
926 +}
927 +
1149 928 .frm_sidebar select {
1150 929 width: 100%;
1151 930 margin-left: 0;
1152 931 margin-right: 0;
@@ -1183,12 +962,14 @@
1183 962
1184 963 /* Buttons */
1185 964
1186 965 .frm_orange_button,
1187 -.frm_reverse_button {
966 +.frm_reverse_button,
967 +.post-type-frm_display .wrap .add-new-h2 {
1188 968 font-size: 12px;
1189 969 border: 1px solid var(--orange);
1190 970 color: var(--orange);
971 + line-height: 1.4;
1191 972 font-weight: 600;
1192 973 padding: 1px 4px;
1193 974 border-radius: 4px;
1194 975 background: transparent;
@@ -1193,11 +974,33 @@
1193 974 border-radius: 4px;
1194 975 background: transparent;
1195 976 }
1196 977
978 +.post-type-frm_display .wrap .add-new-h2 {
979 + margin: 1px 0 0 10px;
980 + text-transform: lowercase;
981 + position: initial;
982 + vertical-align: middle;
983 +}
984 +
985 +h1 .frm-button-secondary,
986 +h1 .frm-button-primary,
987 +h2 .frm-button-secondary,
988 +h2 .frm-button-primary {
989 + font-size: 14px !important;
990 + font-weight: normal;
991 + margin: 0 5px !important;
992 + line-height: 23px !important;
993 + vertical-align: text-bottom !important;
994 + height: auto !important;
995 +}
996 +
1197 997 .frm_reverse_button:hover,
1198 998 .frm_reverse_button:active,
1199 -.frm_reverse_button:focus {
999 +.frm_reverse_button:focus,
1000 +.post-type-frm_display .wrap .add-new-h2:hover,
1001 +.post-type-frm_display .wrap .add-new-h2:active,
1002 +.post-type-frm_display .wrap .add-new-h2:focus {
1200 1003 color: #fff;
1201 1004 background: var(--orange);
1202 1005 border: 1px solid var(--orange);
1203 1006 }
@@ -1208,108 +1011,42 @@
1208 1011 }
1209 1012
1210 1013 .frm-button-primary,
1211 1014 .wp-core-ui .button-primary.frm-button-primary,
1212 -.wp-core-ui .button.frm-button-primary,
1213 1015 .frm-button-secondary,
1214 1016 .wp-core-ui .button-secondary.frm-button-secondary,
1215 1017 .wp-core-ui .button.frm-button-secondary,
1216 -.frm-white-body .frm-search .button,
1217 -.frm-white-body .search-box .button, /* Views */
1218 -.frm-white-body .tablenav .button,
1219 1018 .frm_orange_button,
1220 1019 .toplevel_page_formidable #frm_upgrade_modal .button-primary,
1020 +#form_global_settings .button-secondary,
1221 1021 .wp-core-ui.frm-white-body .button-primary,
1222 1022 .wp-core-ui.frm-white-body .button-secondary,
1223 1023 .frm-white-body .button-primary,
1224 1024 .frm-white-body .button-secondary,
1225 -#frm-form-button button,
1226 -.frm-preview-buttons button,
1227 -.frm-button-red,
1228 -.frm-button-tertiary {
1025 +.wp-core-ui.frm-white-body .button:not(.button-small),
1026 +.frm-white-body button:not(.wp-switch-editor):not(.dropdown-toggle):not(.media-menu-item):not(.media-modal-close):not(.frm_no_style_button){
1229 1027 text-shadow: none;
1230 1028 box-shadow: none;
1231 1029 border-radius: 30px;
1232 - border: 1px solid var(--primary-500);
1233 - font-size: var(--text-sm);
1030 + border-color: var(--primary-color);
1031 + font-size: 1em;
1234 1032 transition: all .2s ease;
1235 - padding: 7px 16px;
1236 - height: auto;
1033 + padding: 0 15px;
1034 + height: 28px;
1237 1035 min-height: 28px;
1238 1036 outline: none;
1239 - line-height: var(--leading);
1240 - box-sizing: border-box;
1241 - font-weight: 500;
1242 - margin-bottom: 0;
1243 - display: inline-block;
1037 + line-height: 26px;
1244 1038 }
1245 1039
1246 -.frm-button-tertiary {
1247 - border-color: transparent;
1248 - color: var(--primary-500);
1249 -}
1250 -
1251 -.frm-button-red,
1252 -.frm-button-red:focus {
1253 - color: #fff !important;
1254 - --primary-500: var(--error-500);
1255 - --primary-700: var(--error-700);
1256 -}
1257 -
1258 -.frm-white-body h2 .button,
1259 -.post-type-frm_display h2 .frm-button-primary,
1260 -.frm-white-body .tablenav .button,
1261 -.frm-button-primary.frm-button-sm,
1262 -.frm-button-secondary.frm-button-sm,
1263 -.frm-button-tertiary.frm-button-sm,
1264 -.frm-button-red.frm-button-sm {
1265 - padding: 4px 12px !important;
1266 - font-size: var(--text-xs) !important;
1267 -}
1268 -
1269 -.frm_no_style_button {
1270 - background: transparent;
1271 -}
1272 -
1273 -.frm-with-icon {
1274 - display: flex;
1275 - gap: var(--gap-xs);
1276 - align-items: center;
1277 -}
1278 -
1279 -.frm-with-icon svg {
1280 - opacity: .65; /* Get close to grey-500 without overriding hover colors */
1281 -}
1282 -
1283 -.frm-with-icon.button svg {
1284 - height: var(--text-sm);
1285 - width: var(--text-sm);
1286 -}
1287 -
1288 -.frm-with-icon.frm-button-sm svg {
1289 - height: var(--text-xs);
1290 - width: var(--text-xs);
1291 -}
1292 -
1293 -.frm-white-body .button.add_media {
1294 - /* Media buttons above RTE */
1295 - padding-left: 12px !important;
1296 - padding-right: 12px !important;
1297 - font-size: var(--text-xs);
1298 - border-radius: var(--border-radius);
1299 -}
1300 -
1301 1040 .wp-core-ui.frm-white-body #post-query-submit.button,
1302 -.wp-core-ui.frm-white-body .button.tablenav-pages-navspan,
1303 1041 .wp-core-ui.frm-white-body .button.first-page,
1304 1042 .wp-core-ui.frm-white-body .button.prev-page,
1305 1043 .wp-core-ui.frm-white-body .button.next-page,
1306 1044 .wp-core-ui.frm-white-body .button.last-page,
1307 1045 .wp-core-ui.frm-white-body .button.action {
1308 - background-color: transparent;
1309 - border-color: var(--grey-300);
1310 - color: var(--grey-700);
1311 - border-radius: var(--border-radius);
1046 + background-color: var(--lightest-grey);
1047 + border-color: var(--grey-border);
1048 + color: var(--dark-grey);
1312 1049 }
1313 1050
1314 1051 .post-type-frm_display.wp-core-ui .button-primary,
1315 1052 .frm-button-primary,
@@ -1314,16 +1051,16 @@
1314 1051 .post-type-frm_display.wp-core-ui .button-primary,
1315 1052 .frm-button-primary,
1316 1053 .wp-core-ui .button-primary.frm-button-primary,
1317 1054 .frm_single_entry_page .button-primary {
1318 - background-color: var(--primary-500) !important;
1055 + background-color: var(--primary-color) !important;
1319 1056 color: #fff !important;
1320 1057 }
1321 1058
1322 1059 .frm-button-primary.frm_large{
1323 - font-size: var(--text-md) !important;
1060 + font-size: 22px !important;
1324 1061 height: auto !important;
1325 - padding: 9px 18px !important;
1062 + padding: 16px 32px !important;
1326 1063 }
1327 1064
1328 1065 .frm-button-primary i:before {
1329 1066 color: #fff;
@@ -1330,10 +1067,10 @@
1330 1067 }
1331 1068
1332 1069 .wp-core-ui .button-primary.frm-button-primary:hover,
1333 1070 .frm-button-primary:hover {
1334 - background: var(--primary-700) !important;
1335 - border-color: var(--primary-700) !important;
1071 + background: var(--primary-hover) !important;
1072 + border-color: var(--primary-hover) !important;
1336 1073 }
1337 1074
1338 1075 .wp-core-ui .button-primary.frm-button-primary:active {
1339 1076 vertical-align: inherit;
@@ -1338,25 +1075,20 @@
1338 1075 .wp-core-ui .button-primary.frm-button-primary:active {
1339 1076 vertical-align: inherit;
1340 1077 }
1341 1078
1342 -.frm-white-body #search-submit,
1343 1079 #frm-form-button .frm_button_submit,
1344 -.frm-white-body .frm-preview-buttons button,
1345 -.frm-white-body .button:not(.frm-button-primary),
1346 1080 .wp-core-ui.frm-white-body .button-secondary,
1347 1081 .wp-core-ui .button-secondary.frm-button-secondary,
1348 1082 .wp-core-ui .button.frm-button-secondary,
1349 -.frm-white-body .frm-button-secondary,
1350 1083 .frm-button-secondary {
1351 - color: var(--grey-800);
1352 - border-color: var(--grey-300);
1353 - background-color: #fff;
1084 + color: var(--primary-color);
1085 + background-color: transparent;
1354 1086 }
1355 1087
1356 1088 #wp-content-media-buttons button,
1357 1089 #wp-content-media-buttons a.button {
1358 - border-color: var(--grey-300);
1090 + border-color: var(--grey-border);
1359 1091 }
1360 1092
1361 1093 .frm_orange_button {
1362 1094 border-color: #da791d !important;
@@ -1363,23 +1095,22 @@
1363 1095 background: var(--orange);
1364 1096 color: #fff;
1365 1097 }
1366 1098
1367 -.frm-white-body .button:not(.frm-button-primary):focus,
1368 -.frm-white-body .button:not(.frm-button-primary):active,
1369 -.frm-white-body .frm-button-secondary:hover,
1370 1099 .wp-core-ui.frm-white-body .frm-button-secondary:hover,
1371 1100 .wp-core-ui.frm-white-body .button-secondary:hover,
1372 1101 .wp-core-ui.frm-white-body .button-secondary:focus,
1373 -.wp-core-ui.frm-white-body .tablenav .button:hover,
1374 1102 .frm_wrap .preview > .button:hover {
1375 - border-color: var(--grey-300) !important;
1376 - color: var(--grey-800);
1377 - background: var(--grey-50) !important;
1378 - box-shadow: none !important;
1379 - outline: none !important;
1103 + border-color: var(--primary-hover) !important;
1104 + background: var(--primary-hover);
1105 + color: #fff;
1106 + box-shadow: none;
1380 1107 }
1381 1108
1109 +.frm-with-plus {
1110 + padding-left: 10px !important;
1111 +}
1112 +
1382 1113 .frm-button-primary .frmsvg {
1383 1114 color: #fff;
1384 1115 }
1385 1116
@@ -1386,20 +1117,23 @@
1386 1117 .frm_wrap .preview i {
1387 1118 font-size: inherit;
1388 1119 }
1389 1120
1390 -.frm-white-body .frm-button-primary:focus,
1391 -.frm-white-body .frm-button-primary:active,
1121 +.wp-core-ui.frm-white-body .frm-button-secondary:hover .frmsvg,
1122 +.frm_wrap .preview > .button:hover .frmsvg,
1123 +.wp-core-ui.frm-white-body .frm-button-secondary:hover i,
1124 +.frm_wrap .preview > .button:hover i {
1125 + color: #fff;
1126 +}
1127 +
1392 1128 #frm-addons-page .button-primary:focus,
1393 1129 #form_global_settings .button-primary:focus,
1394 -#frm_upgrade_modal .button:focus {
1395 - border-color: var(--primary-700) !important;
1396 - background-color: var(--primary-700) !important;
1397 - box-shadow: none !important;
1398 - outline: none !important;
1130 +#frm_upgrade_modal .button:focus,
1131 +.frm_wrap .preview > .button:focus {
1132 + border-color: var(--primary-hover) !important;
1133 + outline: none;
1399 1134 }
1400 1135
1401 -.frm_wrap .preview > .button:focus,
1402 1136 .frm_orange_button:hover,
1403 1137 .frm_orange_button:focus,
1404 1138 .toplevel_page_formidable #frm_upgrade_modal .button-primary:hover,
1405 1139 .toplevel_page_formidable #frm_upgrade_modal .button-primary:focus,
@@ -1447,9 +1181,9 @@
1447 1181 }
1448 1182
1449 1183 .frm-review-notice.notice form,
1450 1184 .frm-review-notice.notice p {
1451 - font-size: var(--text-sm);
1185 + font-size: 14px;
1452 1186 max-width: 600px;
1453 1187 margin-left: auto;
1454 1188 margin-right: auto;
1455 1189 }
@@ -1454,14 +1188,17 @@
1454 1188 margin-right: auto;
1455 1189 }
1456 1190
1457 1191 .frm-review-notice a {
1458 - margin: 0 var(--gap-xs) !important;
1192 + margin: 5px;
1459 1193 }
1460 1194
1461 1195 .frm-review-notice .frm-button-primary,
1462 1196 .frm-review-notice .frm-button-secondary {
1463 1197 min-width: 100px;
1198 + display: inline-block;
1199 + text-align: center;
1200 + padding: 2px 10px;
1464 1201 }
1465 1202
1466 1203 .frm-review-notice p > span {
1467 1204 font-size: 13px;
@@ -1468,9 +1205,9 @@
1468 1205 opacity: 0.75;
1469 1206 }
1470 1207
1471 1208 #frmapi-feedback {
1472 - margin-top: var(--gap-lg);
1209 + margin-top: 30px;
1473 1210 }
1474 1211
1475 1212 .frm-review-notice .frm_error,
1476 1213 .frm-review-notice label {
@@ -1478,112 +1215,12 @@
1478 1215 text-align: left;
1479 1216 }
1480 1217
1481 1218 .frm-review-notice label {
1482 - font-size: var(--text-sm);
1219 + font-size: 14px;
1483 1220 }
1484 1221
1485 -.frm-floating-success-message {
1486 - border-radius: 4px;
1487 - right: 10px !important;
1488 - bottom: 10px !important;
1489 -}
1490 -
1491 1222 /* Generic Classes */
1492 -.frm_no_margin, /* deprecated */
1493 -.frm-m-0 {
1494 - margin: 0 !important;
1495 -}
1496 -
1497 -.frm-m-12 {
1498 - margin: var(--gap-2xl);
1499 -
1500 -}
1501 -
1502 -.frm_no_top_margin, /* deprecated */
1503 -.frm-mt-0 {
1504 - margin-top: 0 !important;
1505 -}
1506 -
1507 -.frm_no_bottom_margin, /* deprecated */
1508 -.frm-mb-0 {
1509 - margin-bottom: 0 !important;
1510 -}
1511 -
1512 -.frm-mb-sm {
1513 - margin-bottom: var(--gap-sm) !important;
1514 -}
1515 -
1516 -.frm-mb-md {
1517 - margin-bottom: var(--gap-md) !important;
1518 -}
1519 -
1520 -.frm-mb-lg {
1521 - margin-bottom: var(--gap-lg) !important;
1522 -}
1523 -
1524 -.frm-mx-sm {
1525 - margin-left: var(--gap-sm) !important;
1526 - margin-right: var(--gap-sm) !important;
1527 -}
1528 -
1529 -.frm-p-1 {
1530 - padding: 4px;
1531 -}
1532 -
1533 -.frm-p-4 {
1534 - padding: var(--gap-sm);
1535 -}
1536 -
1537 -.frm-p-6 {
1538 - padding: var(--gap-md);
1539 -}
1540 -
1541 -.frm-text-md {
1542 - font-size: var(--text-md);
1543 -}
1544 -
1545 -.frm-text-lg {
1546 - font-size: var(--text-lg);
1547 -}
1548 -
1549 -.frm-text-xl {
1550 - font-size: var(--text-xl);
1551 -}
1552 -
1553 -.frm-w-auto {
1554 - width: auto !important;
1555 -}
1556 -
1557 -.frm-w-full {
1558 - width: 100% !important;
1559 -}
1560 -
1561 -.frm-flex-box {
1562 - display: flex;
1563 - gap: var(--gap-sm);
1564 -}
1565 -
1566 -.frm-gap-xs {
1567 - gap: var(--gap-xs);
1568 -}
1569 -
1570 -.frm-gap-sm {
1571 - gap: var(--gap-sm);
1572 -}
1573 -
1574 -.frm-gap-md {
1575 - gap: var(--gap-md);
1576 -}
1577 -
1578 -.frm-justify-between {
1579 - justify-content: space-between;
1580 -}
1581 -
1582 -.frm-transition-ease {
1583 - transition: all .2s ease;
1584 -}
1585 -
1586 1223 .frm_invisible {
1587 1224 visibility: hidden;
1588 1225 transition: all .2s ease;
1589 1226 }
@@ -1591,10 +1228,10 @@
1591 1228 .frm_no_float {
1592 1229 float: none;
1593 1230 }
1594 1231
1595 -.frm_block, /* deprecated */
1596 -.frm-block {
1232 +.frm_block,
1233 +.frm_no_section_fields.frm_block {
1597 1234 display: block;
1598 1235 }
1599 1236
1600 1237 .frm_inline {
@@ -1604,81 +1241,80 @@
1604 1241 .frm_inline_block {
1605 1242 display: inline-block !important;
1606 1243 }
1607 1244
1245 +.frm-lookup-modal .dismiss,
1246 +.frm-right-panel .inside a.frm_hidden,
1247 +ul.frm_form_nav > li.frm_hidden,
1248 +a.frm_hidden,
1249 +.button.frm_hidden,
1250 +.wp-core-ui .button.frm_hidden,
1608 1251 .frm_hidden {
1609 1252 display: none;
1610 1253 }
1611 1254
1612 -.frm-text-right {
1613 - text-align: right;
1255 +.frm_no_margin {
1256 + margin: 0;
1614 1257 }
1615 1258
1616 -.frm-border-b {
1617 - border-bottom: 1px solid var(--grey-300);
1259 +.frm_no_top_margin {
1260 + margin-top: 0 !important;
1618 1261 }
1619 1262
1620 -.frm-no-border {
1621 - border: none !important;
1263 +.postbox .inside > p.frm_no_bottom_margin:last-child,
1264 +.frm_no_bottom_margin {
1265 + margin-bottom: 0 !important;
1622 1266 }
1623 1267
1624 -.frm-opacity-100 {
1625 - opacity: 1;
1268 +.frm_tiny_top_margin {
1269 + margin-top: 1px;
1626 1270 }
1627 1271
1628 -.frm-on-bottom {
1629 - z-index: -1;
1272 +.frm_small_top_margin {
1273 + margin-top: 5px;
1630 1274 }
1631 -/* End Generic Classes, Start Forced Generic Classes */
1632 1275
1633 -.frm-fields p > label.frm_hidden,
1634 -.frm-lookup-modal .dismiss,
1635 -.frm-right-panel .inside a.frm_hidden,
1636 -#form_global_settings .frm_hidden,
1637 -ul.frm_form_nav > li.frm_hidden,
1638 -a.frm_hidden,
1639 -.button.frm_hidden,
1640 -.wp-core-ui .button.frm_hidden {
1641 - display: none;
1276 +.frm_cursor_pointer {
1277 + cursor: pointer;
1642 1278 }
1643 1279
1644 -.postbox .inside > p.frm_no_bottom_margin:last-child {
1645 - margin-bottom: 0 !important;
1280 +.frm_right_text {
1281 + text-align: right;
1646 1282 }
1647 1283
1648 -.frm_no_section_fields.frm_block {
1649 - display: block;
1284 +.frm_submit .frm_full_opacity, .frm_full_opacity {
1285 + opacity: 1;
1650 1286 }
1651 1287
1288 +.frm_med_padding {
1289 + padding: 10px;
1290 +}
1291 +
1652 1292 .actions.frm_visible_overflow {
1653 1293 overflow: visible !important;
1654 1294 }
1655 1295
1656 -.frm_full_opacity, /* deprecated */
1657 -.frm_submit .frm_full_opacity,
1658 -.frm_submit .frm-opacity-100 {
1659 - opacity: 1;
1660 -}
1661 -
1662 1296 .frm-dropdown-menu.frm-on-top {
1663 1297 z-index: 99999;
1664 1298 }
1665 1299
1666 -/* End Forced Generic Classes */
1300 +.frm-on-bottom {
1301 + z-index: -1;
1302 +}
1667 1303
1668 1304 .frm_forms.with_frm_style {
1669 1305 max-width: 100%;
1670 1306 }
1671 1307
1308 +.post-type-frm_display .wrap > #posts-filter,
1672 1309 .post-type-frm_display .wrap > .subsubsub,
1673 -.post-type-frm_display .wrap > .icl_subsubsub,
1674 1310 .frm_form_settings > p {
1675 - margin: 6px var(--gap-md);
1311 + margin: 6px 40px;
1676 1312 padding: 0;
1677 1313 }
1678 1314
1679 1315 .frm-entry-container {
1680 - margin: 0 40px 40px;
1316 + margin: 20px 40px 40px;
1681 1317 padding: 0;
1682 1318 }
1683 1319
1684 1320 #form_reports_page .frm-inner-content {
@@ -1692,24 +1328,24 @@
1692 1328 clear: both;
1693 1329 }
1694 1330
1695 1331 .post-type-frm_display h2,
1696 -.frm_wrap h2 {
1697 - margin-top: 0 !important;
1698 - font-size: var(--text-lg);
1699 - line-height: var(--leading);
1332 +.frm_page_container h2 {
1333 + margin: 10px 0 !important;
1334 + color: var(--medium-grey);
1335 + font-weight: 500;
1336 + font-size: 19px;
1700 1337 }
1701 1338
1702 1339 .post-type-frm_display .wrap > h2:first-child,
1703 -.frm_wrap .wrap > h2:first-child {
1704 - padding-top: 0;
1340 +.frm_page_container .wrap > h2:first-child {
1705 1341 margin-top: 0 !important;
1706 - font-size: var(--text-lg);
1342 + font-size: 22px;
1707 1343 }
1708 1344
1709 1345 #frm_form_editor_container {
1710 1346 position: relative;
1711 - margin-top: 28px;
1347 + margin: 25px 50px 50px;
1712 1348 }
1713 1349
1714 1350 .form-field p {
1715 1351 /* for conflicts */
@@ -1722,36 +1358,23 @@
1722 1358 float: none;
1723 1359 width: auto;
1724 1360 }
1725 1361
1726 -#frm_view_editor_left label, /* Views */
1727 -#frm_view_editor_left .frm_primary_label, /* Views */
1728 -.frm-dialog .frm-sub-label,
1729 -.frm-dialog label,
1730 -.dropdown .frm_primary_label,
1731 1362 .accordion-container label,
1732 1363 .frm-fields td > label,
1733 1364 .frm-fields td > div > label,
1734 -.frm_form_field > label:first-child,
1735 1365 .frm-fields p > label,
1736 -.frm_on_submit_type > label,
1737 1366 .post-type-frm_display .frm_form_field > label,
1738 1367 #new_fields .frm_primary_label,
1739 -#form_global_settings .frm_primary_label,
1740 1368 #frm_form_editor_container .frm_primary_label {
1741 - color: var(--grey-700);
1369 + color: var(--dark-grey);
1742 1370 margin: 0 0 3px;
1743 1371 padding: 0;
1744 1372 width: auto;
1745 - font-size: var(--text-sm);
1373 + font-size: 14px;
1746 1374 display: block;
1747 - line-height: var(--leading);
1748 1375 }
1749 1376
1750 -#frm_form_editor_container #frm-show-fields .frm_primary_label {
1751 - min-height: 21px;
1752 -}
1753 -
1754 1377 .frm-fields td input + label {
1755 1378 display: inline;
1756 1379 }
1757 1380
@@ -1767,12 +1390,8 @@
1767 1390 .with_frm_style form .form-field {
1768 1391 margin-bottom: 20px;
1769 1392 }
1770 1393
1771 -#frm_builder_page .with_frm_style form .frm_combo_inputs_container > .form-field {
1772 - margin-bottom: 0;
1773 -}
1774 -
1775 1394 .frm_description,
1776 1395 .with_frm_style form div.description,
1777 1396 .frm_error,
1778 1397 .with_frm_style form div.description textarea {
@@ -1784,18 +1403,11 @@
1784 1403 color: inherit;
1785 1404 }
1786 1405
1787 1406 #frm_form_editor_container .divider_section_only .frm_primary_label {
1788 - display: flex;
1789 - align-items: center;
1790 - gap: var(--gap-xs);
1791 1407 font-size: 20px;
1792 1408 }
1793 1409
1794 -#frm_form_editor_container .divider_section_only .frm_primary_label .frm-sub-label {
1795 - padding: 0;
1796 -}
1797 -
1798 1410 form .form-field.frm_field_loading {
1799 1411 margin-bottom: 0;
1800 1412 min-height: 0;
1801 1413 padding: 0;
@@ -1883,8 +1495,14 @@
1883 1495 max-width: 700px;
1884 1496 margin: 20px auto !important;
1885 1497 }
1886 1498
1499 +.upgrade_to_pro h1,
1500 +.upgrade_to_pro h3,
1501 +.upgrade_to_pro {
1502 + color: #444;
1503 +}
1504 +
1887 1505 .upgrade_to_pro .error {
1888 1506 display: none;
1889 1507 }
1890 1508
@@ -1894,22 +1512,22 @@
1894 1512 }
1895 1513
1896 1514 .frm_error_style,
1897 1515 .frm_warning_style,
1898 -.frm_note_style,
1899 1516 .frm_message,
1900 1517 #post-body-content .frm_updated_message,
1901 1518 div.frm_updated_message {
1902 - border-radius: var(--small-radius);
1903 - background-color: #D5F2DC;
1904 - color: #1E561F;
1905 - padding: var(--gap-sm) var(--gap-md);
1906 - font-size: var(--text-sm);
1907 - margin: var(--gap-sm) 0;
1908 - text-align: left;
1519 + border-radius: var(--border-radius);
1520 + border: 1px solid #D6E9C6;
1521 + background-color: #DFF0D8;
1522 + color: #468847;
1523 + padding: 5px 25px;
1524 + font-size: 14px;
1525 + margin: 5px 0 15px;
1526 + text-align: center;
1909 1527 }
1910 1528
1911 -#frm_top_bar + .wrap > .frm_updated_message, #frm_top_bar + .wrap > .frm_warning_style {
1529 +#frm_top_bar + .wrap > .frm_updated_message {
1912 1530 display: inline-block;
1913 1531 width: 100%;
1914 1532 box-sizing: border-box;
1915 1533 }
@@ -1917,20 +1535,20 @@
1917 1535 #post-body-content > .frm_updated_message {
1918 1536 margin: 5px 65px;
1919 1537 }
1920 1538
1921 -#form_global_settings #post-body-content > .frm_updated_message,
1922 -#form_global_settings #post-body-content > .frm_warning_style {
1539 +#form_global_settings .frm_updated_message {
1923 1540 margin: 5px 25px;
1924 1541 }
1925 1542
1926 1543 .frm_error_style {
1927 1544 color: #973937;
1928 - background-color: #EBCCCC;
1929 - clear: both;
1545 + border-color: #F2DEDE;
1546 + background-color: #F2DEDE;
1930 1547 }
1931 1548
1932 1549 .frm_error_style a {
1550 + color: #973937;
1933 1551 text-decoration: underline;
1934 1552 font-weight: 600;
1935 1553 }
1936 1554
@@ -1938,10 +1556,14 @@
1938 1556 opacity: .7;
1939 1557 }
1940 1558
1941 1559 .frm_warning_style {
1942 - color: #7A4D05;
1943 - background-color: #FFF2D2;
1560 + color: #8B6E3C;
1561 + border-color: #FBECCD;
1562 + background-color: #FDF9E3;
1563 + border-radius: 10px;
1564 + text-align: left;
1565 + padding-top: 5px;
1944 1566 }
1945 1567
1946 1568 .frm_warning_heading{
1947 1569 font-weight: bold;
@@ -1947,61 +1569,8 @@
1947 1569 font-weight: bold;
1948 1570 margin-bottom:4px;
1949 1571 }
1950 1572
1951 -/* Warning message dismiss */
1952 -.frm_warning_style {
1953 - position: relative;
1954 - padding-right: calc(var(--gap-md) + 15px);
1955 -}
1956 -
1957 -body.rtl .frm_warning_style {
1958 - padding-right: var(--gap-md);
1959 - padding-left: calc(var(--gap-md) + 15px);
1960 -}
1961 -
1962 -.frm-warning-dismiss {
1963 - position: absolute;
1964 - top: 10px;
1965 - right: 10px;
1966 - display: flex;
1967 - cursor: pointer;
1968 - transition: opacity 0.2s ease-out;
1969 -}
1970 -
1971 -body.rtl .frm-warning-dismiss {
1972 - left: 10px;
1973 - right: auto;
1974 -}
1975 -
1976 -.frm-warning-dismiss:hover {
1977 - opacity: 0.8;
1978 -}
1979 -
1980 -.frm-warning-dismiss.frmsvg,
1981 -.frm-warning-dismiss.frmsvg svg {
1982 - width: 15px;
1983 - height: 15px;
1984 -}
1985 -
1986 -.frm_note_style {
1987 - background: rgba(188, 224, 253, 0.23);
1988 - color: var(--grey-700);
1989 -}
1990 -
1991 -.frm-banner-alert {
1992 - text-align: left;
1993 - margin: 0;
1994 - border-radius: 0;
1995 - padding: 10px 0 10px 40px;
1996 -}
1997 -
1998 -.frm-banner-alert a {
1999 - color: var(--primary-500);
2000 - font-weight: 400;
2001 - text-decoration: none;
2002 -}
2003 -
2004 1573 .frm_updated_message ul,
2005 1574 .frm_updated_message li,
2006 1575 .frm_warning_style ul,
2007 1576 .frm_warning_style li,
@@ -2010,24 +1579,63 @@
2010 1579 margin: 0;
2011 1580 }
2012 1581
2013 1582 .frm-inline-message {
2014 - border: 1px solid var(--primary-700);
1583 + border: 1px solid var(--primary-hover);
2015 1584 border-radius: var(--small-radius);
2016 - color: var(--primary-700);
1585 + color: var(--primary-hover);
2017 1586 background: #fff;
2018 1587 text-align: center;
2019 1588 padding: 20px;
2020 - font-size: var(--text-sm);
2021 - line-height: var(--leading);
1589 + font-size: 14px;
1590 + line-height: 1.4em;
2022 1591 }
2023 1592
2024 1593 .frm-inline-message a {
2025 - text-decoration: underline;
2026 1594 font-weight: 600;
2027 - color: var(--primary-700);
1595 + color: var(--primary-hover);
2028 1596 }
2029 1597
1598 +.frm_ribbon {
1599 + -webkit-transform: rotate(45deg);
1600 + -moz-transform: rotate(45deg);
1601 + -ms-transform: rotate(45deg);
1602 + -o-transform: rotate(45deg);
1603 + transform: rotate(45deg);
1604 + border: 25px solid transparent;
1605 + border-bottom: 25px solid var(--orange);
1606 + position: absolute;
1607 + top: 4px;
1608 + right: -38px;
1609 + padding: 0 10px;
1610 + width: 65px;
1611 + color: white;
1612 + font-family: sans-serif;
1613 + size: 11px;
1614 +}
1615 +
1616 +.frm_ribbon span {
1617 + position: absolute;
1618 + top: 2px;
1619 + left: 25px;
1620 + font-size: 17px;
1621 +}
1622 +
1623 +#frm-premium-templates .frm_ribbon {
1624 + border: 15px solid transparent;
1625 + border-bottom: 15px solid var(--orange);
1626 + top: -4px;
1627 + right: -21px;
1628 + width: 16px;
1629 + z-index: 1;
1630 +}
1631 +
1632 +#frm-premium-templates .frm_ribbon span {
1633 + top: -2px;
1634 + left: 3px;
1635 + font-size: 15px;
1636 +}
1637 +
2030 1638 .frm_pro_heading span {
2031 1639 margin-top: 10px;
2032 1640 }
2033 1641
@@ -2036,14 +1644,15 @@
2036 1644 }
2037 1645
2038 1646 .frm-yes {
2039 1647 color: var(--green);
2040 - font-size: var(--text-xl);
1648 + font-size: 21px;
1649 + font-weight: 500;
2041 1650 }
2042 1651
2043 1652 .frm-nope {
2044 - color: var(--grey-400);
2045 - font-size: var(--text-xl);
1653 + color: #d2e0f2;
1654 + font-size: 21px;
2046 1655 }
2047 1656
2048 1657 .upgrade_to_pro a {
2049 1658 color: var(--orange);
@@ -2049,10 +1658,10 @@
2049 1658 color: var(--orange);
2050 1659 }
2051 1660
2052 1661 .upgrade_to_pro table .frmsvg {
2053 - height: var(--text-xl);
2054 - width: var(--text-xl);
1662 + height: 20px;
1663 + width: 20px;
2055 1664 }
2056 1665
2057 1666 .upgrade_to_pro table.widefat {
2058 1667 background-color: #fff;
@@ -2058,14 +1667,12 @@
2058 1667 background-color: #fff;
2059 1668 border-collapse: collapse;
2060 1669 }
2061 1670
2062 -.frm-white-body .upgrade_to_pro table th,
1671 +.upgrade_to_pro table th,
2063 1672 .upgrade_to_pro table td {
2064 1673 padding: 10px 15px;
2065 - border: 1px solid var(--grey-300);
2066 - line-height: var(--leading);
2067 - font-size: var(--text-sm);
1674 + border: 1px solid #d2e0f2;
2068 1675 }
2069 1676
2070 1677 .upgrade_to_pro table th.frmcenter {
2071 1678 text-align: center;
@@ -2071,9 +1678,9 @@
2071 1678 text-align: center;
2072 1679 }
2073 1680
2074 1681 .widefat th.frm_table_break {
2075 - background-color: var(--sidebar-color);
1682 + background-color: #f6f7fb;
2076 1683 }
2077 1684
2078 1685 h2.frm-h2 + .howto {
2079 1686 color: var(--medium-grey);
@@ -2089,18 +1696,18 @@
2089 1696 margin-top: 0;
2090 1697 }
2091 1698
2092 1699 .frm-addons {
2093 - margin-top: var(--gap-lg);
1700 + margin-top: 30px;
2094 1701 display: grid;
2095 1702 grid-template-columns: 1fr 1fr 1fr;
2096 - grid-gap: var(--gap-md);
1703 + grid-gap: 30px 2%;
2097 1704 }
2098 1705
2099 1706 .frm-addons,
2100 1707 .frm-addons h2,
2101 1708 .frm-addons h3 {
2102 - color: var(--grey-700);
1709 + color: var(--dark-grey);
2103 1710 }
2104 1711
2105 1712 .frm-addons h2 {
2106 1713 font-size: 17px;
@@ -2112,9 +1719,9 @@
2112 1719
2113 1720 .frm-card {
2114 1721 width: 100%;
2115 1722 border-radius: 10px;
2116 - border: 1px solid var(--grey-300);
1723 + border: 1px solid var(--grey-border);
2117 1724 opacity: 1;
2118 1725 transition: opacity 1s;
2119 1726 }
2120 1727
@@ -2123,15 +1730,11 @@
2123 1730 transition: all 1s;
2124 1731 }
2125 1732
2126 1733 /* Add-on tiles */
2127 -.frm-addons .frm-card.frm-addon-not-installed {
2128 - position: relative;
2129 -}
2130 -
2131 1734 .frm-addons .plugin-card-top {
2132 - min-height: 155px;
2133 - padding-top: var(--gap-lg);
1735 + height: 140px;
1736 + padding-top: 30px;
2134 1737 overflow: hidden;
2135 1738 }
2136 1739
2137 1740 .frm-addons .plugin-card-top h2 {
@@ -2168,18 +1771,8 @@
2168 1771 .frm-addon-active .button {
2169 1772 visibility: hidden;
2170 1773 }
2171 1774
2172 -.frm-save-and-reload-options {
2173 - margin-top: 10px;
2174 - font-size: 13px;
2175 -}
2176 -
2177 -.frm-save-and-reload,
2178 -.frm-save-and-reload + .frm-button-secondary {
2179 - visibility: visible !important;
2180 -}
2181 -
2182 1775 .addon-status-label {
2183 1776 opacity: .7;
2184 1777 }
2185 1778
@@ -2189,692 +1782,220 @@
2189 1782 }
2190 1783
2191 1784 .frm-addon-error {
2192 1785 position: absolute;
2193 - top: 55px;
2194 - left: 10px;
2195 - right: 10px;
1786 + width: 100%;
2196 1787 font-weight: bold;
2197 1788 text-align: center;
1789 + max-width: 291px;
1790 + margin: 0;
1791 + margin-top: -205px;
1792 + margin-left: -17px;
2198 1793 }
2199 1794
2200 1795 /* Form Templates */
2201 -
2202 -.frm-featured-form .frm-inner-circle {
2203 - margin: 0 auto 5px;
2204 -}
2205 -
2206 -.frm-new-template.plugin-card-bottom {
2207 - overflow: visible;
2208 -}
2209 -
2210 -#frm-new-template p:first-child {
2211 - margin-top: 0;
2212 -}
2213 -
2214 -.frm-admin-page-formidableedit #wpbody-content > *:not(.frm-review-notice):not(.frm_previous_install):not(.frm-banner-alert),
2215 -#wpbody-content > .updated,
2216 -#wpbody-content > #update-nag,
2217 -#wpbody-content > .update-nag,
2218 -#wpbody-content > .notice:not(.frm-review-notice),
2219 -#wpbody-content > .error:not(.frm_previous_install),
2220 -.frm-white-body .updated,
2221 -.frm-white-body .notice:not(.frm-review-notice),
2222 -.frm-white-body .error:not(.frm_previous_install)
2223 -{
2224 - display: none;
2225 -}
2226 -
2227 -.frm-admin-page-formidableedit #frm_builder_page {
2228 - display: block !important;
2229 -}
2230 -
2231 -.frm-white-body .updated,
2232 -.frm-white-body .notice,
2233 -.frm-white-body .error {
2234 - margin: 0;
2235 - padding: 10px 20px;
2236 -}
2237 -
2238 -.frm-modal .postbox,
2239 -#frm_new_form_modal .postbox {
2240 - max-height: 600px;
2241 - overflow: hidden;
2242 - margin-bottom: 0;
2243 -}
2244 -
2245 -.frm-modal .postbox .frm_modal_top,
2246 -.frm-dialog .frm_common_modal .postbox > div:first-child {
2247 - padding: var(--gap-md) var(--gap-md) 0;
2248 - position: relative;
2249 -}
2250 -
2251 -.frm-modal .postbox .frm-modal-title,
2252 -.frm-dialog .frm_common_modal .postbox > div:first-child > div:first-child {
1796 +.frm-featured-forms li {
2253 1797 display: inline-block;
2254 - font-size: var(--text-xl);
2255 - color: var(--grey-900);
2256 -}
2257 -
2258 -.frm-inline-modal > a.dismiss,
2259 -.frm-modal .postbox > a.dismiss,
2260 -.frm-modal .postbox .frm-modal-title + div:last-child,
2261 -.frm-dialog .frm_common_modal .postbox > div:first-child > div:last-child {
2262 - position: absolute;
2263 - right: 30px;
2264 - top: 25px;
2265 - z-index: 2;
2266 -}
2267 -
2268 -body.rtl .frm-inline-modal > a.dismiss,
2269 -body.rtl .frm-modal .postbox > a.dismiss,
2270 -body.rtl .frm-modal .postbox .frm-modal-title + div:last-child,
2271 -body.rtl .frm-dialog .frm_common_modal .postbox > div:first-child > div:last-child {
2272 - right: unset;
2273 - left: 30px;
2274 -}
2275 -
2276 -.frm-info-modal .postbox > a.dismiss,
2277 -.frm-inline-modal > a.dismiss {
2278 - right: 13px;
2279 - top: 13px;
2280 -}
2281 -
2282 -.frm-modal .postbox .frm-modal-title + div:last-child a,
2283 -.frm-modal a.dismiss .frmsvg,
2284 -.frm_common_modal .frm_modal_top a .frmsvg {
2285 - color: var(--grey-900);
2286 -}
2287 -
2288 -.frm-modal .frm_modal_content > div.inside,
2289 -.frm_common_modal .frm_modal_content > div.inside {
2290 - padding: var(--gap-md);
2291 - margin: 0;
2292 - font-size: var(--text-sm);
2293 - color: var(--grey-700);
2294 -}
2295 -
2296 -.frm_common_modal .postbox {
2297 - display: flex;
2298 - flex-direction: column;
2299 -}
2300 -
2301 -.frm-modal .postbox > div.inside .cta-inside {
2302 - overflow-y: auto;
2303 - height: auto;
2304 - padding: 0 var(--gap-sm);
2305 -}
2306 -
2307 -.frm_modal_footer {
2308 - padding: 0 var(--gap-md) var(--gap-sm);
2309 - text-align: right;
2310 -}
2311 -
2312 -body.frm-body-with-open-modal {
2313 - overflow-y: hidden;
2314 -}
2315 -
2316 -#frm_new_form_modal .postbox > div.inside {
2317 - max-height: 490px;
2318 - overflow-y: auto;
2319 - overflow-x: hidden;
2320 - margin: 0;
2321 - padding: 10px 0 0;
2322 -}
2323 -
2324 -#frm_new_form_modal .postbox > div.inside .cta-inside {
2325 - overflow-y: auto;
2326 - height: auto;
2327 - padding: 0 var(--gap-md);
2328 -}
2329 -
2330 -#frm_new_form_modal .accordion-container {
2331 - width: 100%;
2332 -}
2333 -
2334 -.frm-templates-list {
2335 - margin-top: 0;
2336 -}
2337 -
2338 -.frm-templates-list.frm_grid_container li {
2339 - margin-bottom: 0;
2340 -}
2341 -
2342 -.frm-templates-list li {
1798 + margin-right: 15px;
1799 + text-align: center;
1800 + width: 135px;
2343 1801 vertical-align: top;
2344 1802 position: relative;
2345 - box-sizing: border-box;
2346 - border-radius: 6px;
2347 - border: 1px solid transparent;
2348 - text-align: left;
2349 1803 }
2350 1804
2351 -.frm-templates-list li:not(.frm_hidden) {
2352 - display: inline-block;
1805 +a.frm-featured-form {
1806 + display: block;
1807 + padding: 10px 5px 5px;
2353 1808 }
2354 1809
2355 -.frm-templates-list.frm-categories-list li {
2356 - width: 100%;
1810 +.frm-featured-forms li:hover,
1811 +a.frm-featured-form:hover {
1812 + background: var(--sidebar-color);
1813 + border-radius: 10px;
2357 1814 }
2358 1815
2359 -.frm-templates-list li.frm-selectable {
2360 - cursor: pointer;
1816 +.frm-featured-forms li:hover .frm-preview-template,
1817 +a.frm-featured-form:hover + .frm-preview-template {
1818 + display: block;
2361 1819 }
2362 1820
2363 -.frm-templates-list li.frm-selectable:hover {
2364 - background: var(--light-blue);
2365 - border-color: rgba(65, 153, 253, 0.5);
1821 +.frm-template-row.install-now:hover .frm-inner-circle,
1822 +.frm-featured-forms li:hover .install-now .frm-inner-circle {
1823 + opacity: .4;
2366 1824 }
2367 1825
2368 -.frm-templates-list li.frm-selectable:hover h3,
2369 -.frm-templates-list li.frm-selectable:hover p {
2370 - max-width: calc( 100% - 65px );
1826 +.frm-template-row.install-now:hover .frm-inner-circle .frmsvg,
1827 +.frm-featured-forms li:hover .install-now .frmsvg {
1828 + display: none;
2371 1829 }
2372 1830
2373 -.frm-templates-list .frm-featured-form {
2374 - display: flex;
2375 - width: 100%;
1831 +.frm-template-row.install-now:hover .frm-inner-circle .frm_hidden,
1832 +.frm-template-row.install-now:hover .frm-inner-circle .frm_hidden .frmsvg,
1833 +.frm-featured-forms li:hover .install-now .frm_hidden,
1834 +.frm-featured-forms li:hover .install-now .frm_hidden .frmsvg {
1835 + display: inline;
2376 1836 }
2377 1837
2378 -.frm-templates-list li .frm-featured-form {
2379 - padding: 7px 5px;
1838 +.frm-featured-form .frm-inner-circle {
1839 + display: block;
1840 + margin: 0 auto 5px;
1841 + padding: 27px;
2380 1842 }
2381 1843
2382 -.frm-templates-list li li > div {
2383 - padding-left: 0;
2384 -}
2385 -
2386 -.frm-templates-list li > div > div {
2387 - vertical-align: middle;
2388 -}
2389 -
2390 -.frm-templates-list .frm-inner-circle,
2391 -.frm-category-icon, /* Deprecated */
2392 -.frm-icon-wrapper {
2393 - background: var(--primary-500);
2394 - border-radius: var(--small-radius);
1844 +.frm-featured-form .frm-inner-circle,
1845 +.frm-featured-form .frmsvg {
1846 + height: 28px;
1847 + width: 28px;
2395 1848 color: #fff;
2396 - width: 40px;
2397 - height: 40px;
2398 - font-size: 18px;
2399 - box-sizing: border-box;
2400 - align-self: center;
2401 - justify-content: center;
2402 - align-items: center;
2403 - display: inline-flex;
2404 1849 }
2405 1850
2406 -.frm-templates-list .frm-inner-circle .frmsvg {
2407 - vertical-align: top;
1851 +.frm-featured-forms h3 {
1852 + font-size: 14px;
1853 + height: 36px;
2408 1854 }
2409 1855
2410 -.frm-templates-list li .frm-category-icon {
2411 - overflow: hidden;
2412 - align-self: flex-start;
2413 -}
2414 -
2415 -.frm-templates-list .frm-template-details {
2416 - /* the content container to the right of the icon in Create new form modal */
2417 - display: inline-block;
2418 - width: calc( 100% - 40px );
2419 - padding-left: var(--gap-sm);
2420 - box-sizing: border-box;
2421 - transform: translateY(-2px);
2422 -}
2423 -
2424 -.frm-templates-list li h3,
2425 -.frm-templates-list li p {
2426 - text-align: left;
2427 - margin: 0;
2428 - white-space: nowrap;
2429 - text-overflow: ellipsis;
2430 - overflow: hidden;
2431 -}
2432 -
2433 -.frm-templates-list li h3,
2434 -.frm-templates-list .frm-install-template h3 {
2435 - font-size: var(--text-sm) !important;
2436 -}
2437 -
2438 -.frm-templates-list .frm-install-template div {
2439 - text-align: left;
2440 -}
2441 -
2442 -#frm_new_form_modal .frm-search {
2443 - width: 100%;
2444 - margin: var(--gap-sm) 0 var(--gap-md);
2445 -}
2446 -
2447 -#frm_leave_email,
2448 -#frm_code_from_email
2449 -{
2450 - width: 480px;
2451 -}
2452 -
2453 -#frm_new_form_modal #template-search-input {
2454 - width: 100%;
2455 -}
2456 -
2457 -#frm-email-block .frm-with-left-icon .frmsvg {
2458 - padding: 0;
2459 - top: 0;
2460 - left: 13px;
2461 -}
2462 -
2463 -#frm_new_form_modal .accordion-container {
2464 - display: inline-block;
2465 - padding: 0;
2466 - border-top: 1px solid var(--grey-300);
2467 - box-sizing: border-box;
2468 - margin: 0 5px;
2469 - width: calc( 100% - 10px );
2470 -}
2471 -
2472 -#frm_new_form_modal .accordion-section-title {
2473 - padding: 0;
2474 -}
2475 -
2476 -#frm_new_form_modal .accordion-section-title:hover,
2477 -.control-section:hover .accordion-section-title,
2478 -#frm_new_form_modal .accordion-section.open .accordion-section-title
2479 -{
2480 - background: #fff !important;
2481 - border-bottom-color: transparent;
2482 -}
2483 -
2484 -#frm_new_form_modal .accordion-section.open:hover {
2485 - border-bottom-color: transparent;
2486 -}
2487 -
2488 -#frm_new_form_modal .accordion-section {
2489 - padding: 8px 0 4px;
2490 -}
2491 -
2492 -#frm_new_form_modal .accordion-section + .accordion-section {
2493 - border-top: 1px solid var(--grey-300);
2494 - border-radius: 0;
2495 -}
2496 -
2497 -.frm-templates-list.frm-categories-list li > div > div:last-child,
2498 -#frm_new_form_modal .accordion-section .frm-featured-form
2499 -{
2500 - padding-left: 0;
2501 -}
2502 -
2503 -#frm_new_form_modal .frm-templates-list.frm-categories-list .accordion-section-title {
2504 - padding-left: var(--gap-sm);
2505 -}
2506 -
2507 -#frm_new_form_modal .frm-templates-list.frm-categories-list li.frm-selectable {
2508 - padding: 0 10px;
2509 - overflow: hidden;
2510 -}
2511 -
2512 -#frm_new_form_modal .accordion-section-content {
2513 - padding: var(--gap-sm);
2514 -}
2515 -
2516 -.frm-hover-icons {
1856 +.frm-featured-forms .frm-preview-template {
2517 1857 position: absolute;
2518 - right: 0;
2519 - top: calc( ( 58px - 2px - 22px ) / 2 ); /* Template item height - borders - icon height */
2520 - max-width: 91px;
2521 - height: 100%;
2522 - box-sizing: border-box;
2523 - padding: 0 10px 0 5px !important;
2524 - border-radius: var(--small-radius);
2525 - text-align: right;
2526 - display: flex;
2527 - gap: 5px;
1858 + bottom: 5px;
1859 + right: 5px;
1860 + display: none;
2528 1861 }
2529 1862
2530 -.frm-ready-made-solution .frm-hover-icons {
2531 - visibility: hidden;
2532 -}
2533 -
2534 -.frm-ready-made-solution:hover .frm-hover-icons {
2535 - visibility: visible;
2536 -}
2537 -
2538 -.frm-hover-icons a {
2539 - width: 22px;
2540 - height: 22px;
2541 - font-size: var(--text-md);
2542 - display: inline-flex;
2543 - align-items: center;
2544 - justify-content: center;
2545 - border-radius: 50%;
2546 - box-sizing: border-box;
2547 - line-height: var(--leading);
2548 - text-align: center;
2549 -}
2550 -
2551 -.frm-hover-icons > .frm-preview-form,
2552 -.frm-hover-icons > .frm-delete-form {
2553 - border: 1px solid var(--primary-500);
2554 -}
2555 -
2556 -.frm-hover-icons > .frm-create-form,
2557 -.frm-ready-made-solution .frm-hover-icons a {
2558 - background-color: var(--primary-500);
2559 -}
2560 -
2561 -.frm-hover-icons > a .frmsvg {
2562 - width: 14px;
2563 - height: 14px;
2564 - vertical-align: baseline;
2565 -}
2566 -
2567 -.frm-hover-icons > .frm-preview-form .frmsvg,
2568 -.frm-hover-icons > .frm-delete-form .frmsvg {
2569 - color: var(--primary-500);
2570 -}
2571 -
2572 -.frm-hover-icons > .frm-unlock-form {
2573 - background-color: var(--primary-500);
2574 -}
2575 -
2576 -.frm-hover-icons > .frm-unlock-form .frmsvg {
2577 - background-color: var(--primary-500);
2578 -}
2579 -
2580 -.frm-ready-made-solution .frmsvg {
2581 - width: 14px;
2582 - height: 14px;
2583 -}
2584 -
2585 -.frm-hover-icons .frm-create-form svg,
2586 -.frm-ready-made-solution .frm-hover-icons svg {
1863 +.frm-preview-template .frm-inner-circle,
1864 +.frm-featured-forms .frm-preview-template .frmsvg {
1865 + width: 12px;
1866 + height: 12px;
2587 1867 color: #fff;
1868 + vertical-align: top;
2588 1869 }
2589 1870
2590 -.frm-hover-icons .frm-create-form:hover,
2591 -.frm-ready-made-solution .frm-hover-icons a:hover,
2592 -.frm-hover-icons > .frm-unlock-form:hover,
2593 -.frm-hover-icons > .frm-unlock-form:hover .frmsvg
2594 -{
2595 - background-color: var(--primary-700) !important;
1871 +.frm-preview-template .frm-inner-circle {
1872 + background-color: var(--primary-color);
2596 1873 }
2597 1874
2598 -.frm-hover-icons .frm-preview-form:hover,
2599 -.frm-hover-icons .frm-delete-form:hover
2600 -{
2601 - border: 1px solid var(--primary-700) !important;
1875 +.frm-add-blank-form .frm-inner-circle {
1876 + border: 1px dashed var(--grey);
1877 + background: #fff;
2602 1878 }
2603 1879
2604 -.frm-hover-icons .frm-preview-form:hover .frmsvg,
2605 -.frm-hover-icons .frm-delete-form:hover .frmsvg {
2606 - color: var(--primary-700) !important;
1880 +.frm-add-blank-form .frmsvg {
1881 + color: var(--medium-grey);
2607 1882 }
2608 1883
2609 -.frm-application-card h4 .frmsvg,
2610 -.frm-locked-template h3 .frmsvg {
2611 - height: var(--text-sm);
2612 - width: var(--text-sm);
2613 - vertical-align: text-top;
2614 - color: var(--grey-500);
1884 +.frm-featured-forms a,
1885 +.frm-featured-forms h3,
1886 +.frm-template-row h3,
1887 +.frm-template-row p {
1888 + color: var(--dark-grey)
2615 1889 }
2616 1890
2617 -#frm_new_form_modal .frm-use-this-template {
2618 - margin-left: 10px;
2619 -}
2620 -
2621 -#frm_new_form_modal #frm-preview-block {
2622 - padding: var(--gap-md) var(--gap-lg);
2623 - overflow-x: hidden;
2624 -}
2625 -
2626 -#frm_new_form_modal #frm-details-block {
2627 - padding: var(--gap-md) var(--gap-lg);
2628 -}
2629 -
2630 -.frm-modal-back {
2631 - cursor: pointer;
2632 - margin-right: 4px;
2633 -}
2634 -
2635 -.frm-modal-cancel {
1891 +.frm-template-row .frm-inner-circle {
2636 1892 float: left;
1893 + margin: 2px 10px 0 0;
1894 + padding: 6px;
2637 1895 }
2638 1896
2639 -.frm-plan-required-tag {
2640 - margin-left: 5px;
2641 - transform: translateY(-1px);
2642 - background: #FDE6DE;
2643 - color: #F15A24;
1897 +.frm-template-row .frmsvg {
1898 + vertical-align: middle;
2644 1899 }
2645 1900
2646 -.frm-ready-made-solution .frm-meta-tag {
2647 - width: fit-content;
2648 - background: #FDE6DE;
2649 - color: #F15A24;
1901 +.frm-template-row p {
1902 + margin-bottom: 0 !important;
2650 1903 }
2651 1904
2652 -.frm-meta-tag {
2653 - font-size: 10px;
2654 - padding: 4px 6px;
2655 - border-radius: 4px;
2656 - text-transform: uppercase;
2657 - font-weight: normal;
2658 - display: inline-block;
2659 - line-height: 12px;
2660 -}
2661 -
2662 -#frm_new_form_modal.frm-expired #frm-create-block,
2663 -#frm_new_form_modal.frm-expiring #frm-create-block {
2664 - max-height: 450px;
2665 -}
2666 -
2667 -#frm-create-footer {
2668 - padding: 15px 20px;
2669 -}
2670 -
2671 -#frm_code_from_email_options {
2672 - margin-top: 20px;
2673 -}
2674 -
2675 -#frm_code_from_email_options * {
2676 - color: var(--primary-500);
2677 -}
2678 -
2679 -#frm-email-block p,
2680 -#frm-code-block p,
2681 -#frm-renew-block p
2682 -{
2683 - padding: 0 40px;
2684 - max-width: 400px;
2685 - margin: 0 auto 20px;
2686 -}
2687 -
2688 -li .frm-hover-icons .frm-preview-form,
2689 -.frm-hover-icons .frm-unlock-form,
2690 -.frm-locked-template .frm-hover-icons .frm-create-form,
2691 -#frm_new_form_modal .frm-modal-back ~ span,
2692 -#frm_new_form_modal .postbox > div:first-child ~ div,
2693 -.frm-modal-back,
2694 -#frm_new_form_modal:not([frm-page="create"]) a.dismiss,
2695 -#frm_code_from_email_error span,
2696 -#frm_leave_email_error span,
2697 -#frm_new_form_modal .frm-delete-form,
2698 -#frm-details-block #frm-new-template button,
2699 -#frm-create-title span[frm-type="template"],
2700 -#frm-create-title[frm-type="template"] span[frm-type="form"]
2701 -{
2702 - display: none;
2703 -}
2704 -
2705 -#frm_new_form_modal:not([frm-page="create"]) .frm-modal-back,
2706 -#frm_new_form_modal[frm-page="create"] #frm-create-title,
2707 -#frm-create-title[frm-type="template"] span[frm-type="template"],
2708 -#frm_new_form_modal[frm-page="preview"] #frm-preview-title,
2709 -#frm_new_form_modal[frm-page="details"] #frm-create-title,
2710 -#frm_new_form_modal[frm-page="upgrade"] #frm-upgrade-title,
2711 -#frm_new_form_modal[frm-page="email"] #frm-email-title,
2712 -#frm_new_form_modal[frm-page="code"] #frm-email-title,
2713 -#frm_new_form_modal[frm-page="renew"] #frm-renew-title,
2714 -#frm_code_from_email_error[frm-error="wrong-code"] span[frm-error="wrong-code"],
2715 -#frm_code_from_email_error[frm-error="empty"] span[frm-error="empty"],
2716 -#frm_code_from_email_error[frm-error="custom"] span[frm-error="custom"],
2717 -#frm_leave_email_error[frm-error="invalid"] span[frm-error="invalid"],
2718 -#frm_leave_email_error[frm-error="empty"] span[frm-error="empty"]
2719 -{
2720 - display: inline-block;
2721 -}
2722 -
2723 -.frm-locked-template .frm-hover-icons .frm-unlock-form,
2724 -li[data-preview] .frm-hover-icons .frm-preview-form,
2725 -#frm_new_form_modal .frm-selectable[data-custom="1"] .frm-hover-icons .frm-delete-form {
2726 - display: inline-flex;
2727 -}
2728 -
2729 -#frm_new_form_modal[frm-page="create"] #frm-create-block,
2730 -#frm_new_form_modal[frm-page="preview"] #frm-preview-block,
2731 -#frm_new_form_modal[frm-page="details"] #frm-details-block,
2732 -#frm_new_form_modal[frm-page="upgrade"] #frm-upgrade-block,
2733 -#frm_new_form_modal[frm-page="email"] #frm-email-block,
2734 -#frm_new_form_modal[frm-page="code"] #frm-code-block,
2735 -#frm_new_form_modal[frm-page="renew"] #frm-renew-block,
2736 -#frm_new_form_modal[frm-page="create"] #frm-create-footer,
2737 -#frm_new_form_modal[frm-page="preview"] #frm-preview-footer,
2738 -#frm_new_form_modal[frm-page="details"] #frm-details-footer,
2739 -#frm_new_form_modal[frm-page="upgrade"] #frm-upgrade-footer,
2740 -#frm_new_form_modal[frm-page="email"] #frm-email-footer,
2741 -#frm_new_form_modal[frm-page="code"] #frm-code-footer,
2742 -#frm_new_form_modal[frm-page="renew"] #frm-renew-footer
2743 -{
2744 - display: block;
2745 -}
2746 -
2747 -.frm-modal-back svg {
2748 - color: #7F7F7F;
2749 -}
2750 -
2751 -#frm-upgrade-body-list-wrapper > div {
2752 - display: inline-block;
2753 - width: calc( 100% / 3 );
2754 - vertical-align: top;
1905 +#frm-templates-page .plugin-card-bottom {
2755 1906 text-align: left;
2756 - margin-bottom: 10px;
2757 1907 }
2758 1908
2759 -#frm-upgrade-body-list-wrapper ul {
2760 - padding-left: 40px;
1909 +.frm-new-template.plugin-card-bottom {
1910 + overflow: visible;
2761 1911 }
2762 1912
2763 -#frm-upgrade-body-list-wrapper ul li:before {
2764 - content: "\2022";
2765 - color: var(--primary-500);
2766 - display: inline-block;
2767 - width: 1em;
2768 - margin-left: -1em;
1913 +#frm-templates-page .frm-nav-tabs,
1914 +#frm_preview_template_modal .postbox {
1915 + margin-bottom: 0;
2769 1916 }
2770 1917
2771 -/* Embed Form Modal */
2772 -
2773 -.frm-embed-modal-content {
2774 - padding: var(--gap-md);
1918 +#frm-templates-page .frm-search {
1919 + margin: 0;
2775 1920 }
2776 1921
2777 -.frm-embed-modal-content.frm-loading-page-options {
2778 - display: flex;
2779 - justify-content: center;
1922 +.frm-white-body table.frm-list-templates {
1923 + margin-top: 0;
2780 1924 }
2781 1925
2782 -#frm_embed_modal .frm_embed_example {
2783 - background: var(--sidebar-color);
2784 - border: 1px solid var(--sidebar-hover);
2785 - border-radius: var(--small-radius);
2786 - color: var(--grey-900);
2787 - font-size: var(--text-sm);
2788 - padding-right: var(--gap-lg);
2789 - width: 100%;
2790 - height: auto !important;
2791 - resize: none;
1926 +table.frm-list-templates thead th {
1927 + border: none;
1928 + padding: 0;
2792 1929 }
2793 1930
2794 -#frm_embed_modal textarea.frm_embed_example {
2795 - padding-bottom: 0;
2796 -}
2797 -
2798 -.frm-embed-modal-content > div a {
2799 - position: absolute;
2800 - right: 0;
2801 - top: 0;
2802 -}
2803 -
2804 -.frm-embed-modal-content > div {
1931 +.frm-list-templates td {
2805 1932 position: relative;
2806 - margin-bottom: var(--gap-sm);
1933 + border-bottom: 2px solid #e1e1e1;
2807 1934 }
2808 1935
2809 -.frm-embed-modal-content > div:last-child {
2810 - margin-bottom: 0;
1936 +.frm-list-templates h3 {
1937 + margin: 0;
1938 + font-size: 15px;
2811 1939 }
2812 1940
2813 -.frm-embed-modal-content svg[id^="frm_copy_embed_"] {
1941 +.frm-template-actions {
1942 + display: none;
2814 1943 position: absolute;
2815 - bottom: calc( ( 38px - 18px ) / 2 ); /* Input height - SVG height */
2816 - right: 10px;
2817 - cursor: pointer;
2818 - opacity: 0.5;
1944 + top: 14px;
1945 + right: 15px;
2819 1946 }
2820 1947
2821 -.frm-border-info-box,
2822 -.frm-embed-modal-option {
2823 - border-radius: var(--small-radius);
2824 - border: 1px solid var(--grey-300);
2825 - padding: var(--gap-sm);
2826 - cursor: pointer;
2827 - display: flex;
2828 - gap: var(--gap-sm);
2829 - font-size: var(--text-sm);
1948 +.frm-list-templates tr:hover h3 + p,
1949 +.frm-list-templates .frm_plan_required {
1950 + display: none;
2830 1951 }
2831 1952
2832 -.frm-embed-modal-option + .frm-embed-modal-option {
2833 - margin-top: var(--gap-sm);
1953 +.frm-list-templates tr:hover .frm-template-actions,
1954 +.frm-list-templates tr:hover .frm_plan_required {
1955 + display: block;
2834 1956 }
2835 1957
2836 -.frm-collapsed .frmsvg,
2837 -.caret.rotate-270,
2838 -.frm-embed-modal-option .caret {
2839 - align-self: center;
2840 - margin-left: auto;
2841 - transform: rotate(-90deg);
2842 -}
2843 -
2844 -#frm_embed_modal .frm_modal_footer {
1958 +.frm-admin-page-formidableedit #wpbody-content > *:not(.frm-review-notice):not(.frm_previous_install),
1959 +#wpbody-content > .updated,
1960 +#wpbody-content > #update-nag,
1961 +#wpbody-content > .update-nag,
1962 +#wpbody-content > .notice:not(.frm-review-notice),
1963 +#wpbody-content > .error:not(.frm_previous_install),
1964 +.frm-white-body .updated,
1965 +.frm-white-body .notice:not(.frm-review-notice),
1966 +.frm-white-body .error:not(.frm_previous_install),
1967 +#frm-templates-page .updated,
1968 +#frm-templates-page .notice,
1969 +#frm-templates-page .error {
2845 1970 display: none;
2846 1971 }
2847 1972
2848 -#frm_embed_modal.frm-on-page-2 .frm_modal_footer {
2849 - display: block;
1973 +.frm-admin-page-formidableedit #frm_builder_page {
1974 + display: block !important;
2850 1975 }
2851 1976
2852 -.frm-embed-modal-content ul {
2853 - max-height: 300px;
2854 - overflow-y: scroll;
1977 +.frm-white-body .updated,
1978 +.frm-white-body .notice,
1979 +.frm-white-body .error {
1980 + margin: 0;
1981 + padding: 10px 20px;
2855 1982 }
2856 1983
2857 -.frm-embed-modal-wrapper.frm-dialog {
2858 - overflow: visible;
2859 -}
2860 -
2861 1984 /* Bulk Options */
2862 1985 #frm-bulk-modal .frm_grid_container {
1986 + border-top: 1px solid var(--grey-border);
2863 1987 grid-template-columns: repeat(12, 8.33%);
2864 1988 grid-gap: 0;
2865 1989 }
2866 1990
2867 1991 #frm-bulk-modal .frm8 {
2868 - border-right: 1px solid var(--grey-300);
2869 - padding: 10px 20px 10px var(--gap-lg);
1992 + border-right: 1px solid var(--grey-border);
1993 + padding: 0 20px 20px;
2870 1994 }
2871 1995
2872 -#frm-bulk-modal .frm4 {
2873 - padding: 10px 0;
2874 -}
2875 -
2876 -.frm-inline-modal .howto {
1996 +.frm-inline-modal .howto,
1997 +#frm-bulk-modal .howto {
2877 1998 margin: 5px 0 10px;
2878 1999 color: var(--grey);
2879 2000 }
2880 2001
@@ -2891,18 +2012,18 @@
2891 2012 }
2892 2013
2893 2014 .frm-bulk-edit-link {
2894 2015 text-align: right;
2895 - font-size: var(--text-sm);
2016 + font-size: 14px;
2896 2017 padding: 0 5px 10px;
2897 2018 }
2898 2019
2899 2020 .frm-small-add {
2900 - font-size: var(--text-sm) !important;
2021 + font-size: 14px !important;
2901 2022 }
2902 2023
2903 2024 .frm-small-add span {
2904 - color: var(--primary-500);
2025 + color: var(--primary-color);
2905 2026 font-size: 12px;
2906 2027 height: 12px;
2907 2028 width: 12px;
2908 2029 }
@@ -2917,33 +2038,34 @@
2917 2038 }
2918 2039
2919 2040 .frm-right-panel .inside a.frm_pro_tip,
2920 2041 a.frm_pro_tip {
2921 - font-size: var(--text-sm);
2042 + font-size: 14px;
2043 + border: 1px solid var(--orange);
2922 2044 display: inline-block;
2923 - color: var(--grey-700);
2924 - background: #FFE7DE;
2925 - border-radius: var(--small-radius);
2045 + color: var(--dark-grey);
2046 + background: var(--light-blue);
2047 + border-radius: var(--border-radius);
2048 + text-align: center;
2926 2049 padding: 5px 15px;
2927 2050 margin: 0 auto;
2928 - display: flex;
2929 - align-items: center;
2051 + line-height: 1.4;
2930 2052 }
2931 2053
2932 2054 a.frm_pro_tip:hover {
2933 - color: var(--grey-700);
2934 - border-color: var(--primary-500);
2055 + color: var(--dark-grey);
2056 + border-color: var(--primary-color);
2935 2057 }
2936 2058
2937 2059 a.frm_pro_tip:hover .frmsvg {
2938 - fill: var(--primary-500);
2060 + fill: var(--primary-color);
2939 2061 }
2940 2062
2941 2063 .frm_field_list .frm_pro_tip {
2942 2064 margin: 10px 15px;
2065 + padding-left: 40px;
2943 2066 position: relative;
2944 - width: calc(100% - 30px);
2945 - box-sizing: border-box;
2067 + background: #fff;
2946 2068 }
2947 2069
2948 2070 a.frm_pro_tip .frmsvg,
2949 2071 a.frm_pro_tip i {
@@ -2950,27 +2072,19 @@
2950 2072 color: var(--orange);
2951 2073 margin-right: 5px;
2952 2074 }
2953 2075
2954 -a.frm_pro_tip .frmsvg {
2955 - margin-right: 10px;
2076 +.frm_field_list a.frm_pro_tip .frmsvg {
2077 + position: absolute;
2078 + left: 15px;
2079 + top: calc(50% - 11px);
2956 2080 }
2957 2081
2958 -.frm-light-tip a.frm_pro_tip {
2959 - background: rgba(188, 224, 253, 0.23);
2082 +.pro-tip {
2083 + font-weight: 500;
2084 + color: var(--darkest-grey);
2960 2085 }
2961 2086
2962 -.frm-light-tip a.frm_pro_tip .frmsvg,
2963 -.frm-light-tip a.frm_pro_tip i,
2964 -.frm-light-tip .frm-tip-cta {
2965 - color: var(--primary-500);
2966 -}
2967 -
2968 -.frm-tip-info {
2969 - flex: 1;
2970 - text-align: left;
2971 -}
2972 -
2973 2087 .frm-tip-cta {
2974 2088 color: var(--orange);
2975 2089 }
2976 2090
@@ -2978,9 +2092,9 @@
2978 2092 float: right;
2979 2093 }
2980 2094
2981 2095 .frm_pro_tip:hover .frm-tip-cta {
2982 - color: var(--primary-500);
2096 + color: var(--primary-color);
2983 2097 }
2984 2098
2985 2099 /*Switch form dropdown*/
2986 2100 h1 .fa-caret-down {
@@ -2995,23 +2109,16 @@
2995 2109 vertical-align: middle;
2996 2110 }
2997 2111
2998 2112 .caret,
2999 -.wp-admin .frm_wrap select,
3000 -.frm_wrap .frm_form_builder select,
3001 2113 .frm_wrap .ui-autocomplete-input {
3002 - 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%;
3003 - background-size: var(--text-md) var(--text-md);
3004 - padding-right: var(--gap-lg) !important;
2114 + 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%;
2115 + background-size: 16px 16px;
3005 2116 }
3006 2117
3007 -.caret {
3008 - padding-right: var(--gap-xs) !important;
3009 -}
3010 -
3011 2118 .frm-btn-group .caret {
3012 2119 float: right;
3013 - margin-top: calc( var(--text-md) / 2 );
2120 + margin-top: 6px;
3014 2121 }
3015 2122
3016 2123 .dropdown {
3017 2124 position: relative;
@@ -3020,12 +2127,12 @@
3020 2127 .dropdown-toggle:focus {
3021 2128 outline: 0;
3022 2129 }
3023 2130
3024 -.frm_wrap .ui-autocomplete,
3025 -#frm_adv_info.frm-dropdown-menu,
3026 2131 .frm-dropdown-menu {
3027 - /* Copied from .dropdown-menu rules from Bootstrap */
2132 + max-height: 200px;
2133 + overflow: auto;
2134 + overflow-x: hidden;
3028 2135 position: absolute;
3029 2136 top: 100%;
3030 2137 left: 0;
3031 2138 z-index: 1000;
@@ -3030,27 +2137,21 @@
3030 2137 left: 0;
3031 2138 z-index: 1000;
3032 2139 display: none;
3033 2140 float: left;
3034 - padding-left: 4px;
3035 - padding-right: 4px;
3036 - margin: var(--gap-xs) 0 0;
3037 2141 text-align: left;
2142 + min-width: 160px;
2143 + width: auto;
2144 + padding: 5px 0;
2145 + margin: 2px 0 0;
3038 2146 list-style: none;
3039 - background: none;
3040 - background-color: #fff;
2147 + font-size: 12px;
2148 + background-color: #ffffff;
2149 + border: 1px solid rgba(0, 0, 0, 0.15);
2150 + border-radius: 4px;
2151 + -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
2152 + box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
3041 2153 background-clip: padding-box;
3042 - border: 1px solid var(--grey-100);
3043 - border-radius: 0.25rem;
3044 - box-shadow: var(--box-shadow-lg);
3045 -
3046 - /* Custom rules */
3047 - max-height: 200px;
3048 - overflow-y: auto;
3049 - overflow-x: hidden;
3050 - font-size: var(--text-md);
3051 - width: auto;
3052 - min-width: 160px;
3053 2154 }
3054 2155
3055 2156 .frm6 .frm-dropdown-menu {
3056 2157 min-width: 100px;
@@ -3056,35 +2157,25 @@
3056 2157 min-width: 100px;
3057 2158 max-width: 99%;
3058 2159 }
3059 2160
2161 +#frm_bs_dropdown > a {
2162 + font-size: 1em;
2163 +}
2164 +
3060 2165 #frm_bs_dropdown .frm-dropdown-menu {
3061 2166 max-width: 400px;
3062 2167 }
3063 2168
3064 -.field_type_list .frm-dropdown-menu {
3065 - min-width: 150px !important;
2169 +.preview .frm-dropdown-menu {
2170 + min-width: 60px;
3066 2171 }
3067 2172
3068 -#frm_field_group_controls .frm-dropdown-menu,
3069 -.frm-field-action-icons .frm-dropdown-menu {
3070 - min-width: 180px !important;
2173 +.field_type_list .frm-dropdown-menu {
2174 + min-width: 150px;
3071 2175 }
3072 2176
3073 -.frm-field-action-icons .frm-dropdown-toggle svg {
3074 - color: #9EA9B8;
3075 -}
3076 -
3077 -.multiselect-container.frm-dropdown-menu,
3078 -#search-submit .frm-dropdown-menu {
3079 - min-width: 200px !important;
3080 -}
3081 -
3082 -.preview .frm-dropdown-menu {
3083 - min-width: 230px !important;
3084 -}
3085 -
3086 -.frm-dropdown-menu.dropdown-menu-right {
2177 +.frm-dropdown-menu.pull-right {
3087 2178 right: 0;
3088 2179 left: auto;
3089 2180 }
3090 2181
@@ -3094,37 +2185,29 @@
3094 2185 overflow: hidden;
3095 2186 background-color: #e5e5e5;
3096 2187 }
3097 2188
3098 -.frm-dropdown-menu > .dropdown-item {
2189 +.frm-dropdown-menu > li {
3099 2190 margin: 0;
3100 2191 }
3101 2192
3102 -.frm-select-list-item,
3103 -.frm_wrap .ui-autocomplete li > div,
3104 -.multiselect-container button.multiselect-option,
3105 -.frm-dropdown-menu > .dropdown-item > a,
2193 +.frm-dropdown-menu > li > a,
3106 2194 .frm-dropdown-menu .frm_dropdown_li {
3107 2195 clear: both;
3108 2196 font-weight: normal;
3109 2197 white-space: nowrap;
3110 2198 text-decoration: none;
3111 - border-radius: var(--small-radius);
3112 2199 }
3113 2200
3114 -.frm-dropdown-menu > .active > a,
3115 -.frm-dropdown-menu > .active > a:hover,
3116 -.frm-dropdown-menu > .active > a:focus {
2201 +.frm-dropdown-menu > .active > a, .frm-dropdown-menu > .active > a:hover, .frm-dropdown-menu > .active > a:focus {
3117 2202 text-decoration: none;
3118 2203 outline: 0;
3119 2204 }
3120 2205
3121 -.frm-select-list-item.disabled,
3122 2206 .frm-dropdown-menu > .disabled > a, .frm-dropdown-menu > .disabled > a:hover, .frm-dropdown-menu > .disabled > a:focus {
3123 2207 color: #999999;
3124 2208 }
3125 2209
3126 -.frm-select-list-item.disabled:hover,
3127 2210 .frm-dropdown-menu > .disabled > a:hover,
3128 2211 .frm-dropdown-menu > .disabled > a:focus {
3129 2212 text-decoration: none;
3130 2213 background-color: transparent;
@@ -3141,11 +2224,12 @@
3141 2224 }
3142 2225
3143 2226 .dropdown-header {
3144 2227 display: block;
3145 - padding: 3px 10px;
3146 - font-size: var(--text-xs);
3147 - color: var(--grey-400);
2228 + padding: 3px 20px;
2229 + font-size: 12px;
2230 + line-height: 1.428571429;
2231 + color: #999999;
3148 2232 }
3149 2233
3150 2234 .dropdown-backdrop {
3151 2235 position: fixed;
@@ -3155,9 +2239,8 @@
3155 2239 top: 0;
3156 2240 z-index: 990;
3157 2241 }
3158 2242
3159 -.dropdown-menu-right > .frm-dropdown-menu,
3160 2243 .pull-right > .frm-dropdown-menu {
3161 2244 right: 0;
3162 2245 left: auto;
3163 2246 }
@@ -3177,13 +2260,13 @@
3177 2260 .btn {
3178 2261 border: 1px solid #ddd;
3179 2262 background: #fff;
3180 2263 height: 28px;
3181 - line-height: var(--leading);
2264 + line-height: 1.5;
3182 2265 }
3183 2266
3184 2267 a.frm_option_icon:before {
3185 - color: var(--primary-500);
2268 + color: var(--primary-color);
3186 2269 font-size: 22px;
3187 2270 width: 22px;
3188 2271 height: 22px;
3189 2272 }
@@ -3189,9 +2272,9 @@
3189 2272 }
3190 2273
3191 2274 a.frm_option_icon:focus::before,
3192 2275 a.frm_option_icon:hover::before {
3193 - color: var(--primary-700);
2276 + color: var(--primary-hover);
3194 2277 }
3195 2278
3196 2279 .frm_top_left .frm-dropdown-toggle {
3197 2280 color: #999;
@@ -3205,17 +2288,17 @@
3205 2288 text-decoration: none;
3206 2289 }
3207 2290
3208 2291 .frm-card .frm-dropdown-toggle {
3209 - border: 1px solid var(--grey-300);
2292 + border: 1px solid var(--grey-border);
3210 2293 border-radius: var(--small-radius);
3211 2294 font-size: 13px;
3212 - color: var(--grey-700);
2295 + color: var(--dark-grey);
3213 2296 padding: 7px 20px;
3214 2297 }
3215 2298
3216 2299 .frm_actions_dropdown .frm-dropdown-menu {
3217 - font-size: var(--text-sm);
2300 + font-size: 14px;
3218 2301 color: #5F6C72;
3219 2302 }
3220 2303
3221 2304 .frm-dropdown-menu .frm_icon_font {
@@ -3227,21 +2310,20 @@
3227 2310 /* BS Multiselect */
3228 2311 .multiselect-container.frm-dropdown-menu {
3229 2312 top: auto;
3230 2313 left: auto;
3231 - font-size: var(--text-sm);
3232 - padding: 4px;
2314 + font-size: 14px;
2315 + padding-top: 3px;
3233 2316 margin-bottom: 3px;
3234 2317 }
3235 2318
3236 2319 .frm-right-panel .accordion-section-content {
3237 2320 background: transparent;
3238 - padding: 0;
3239 - overflow: initial;
2321 + padding-top: 0
3240 2322 }
3241 2323
3242 -.frm-right-panel .accordion-section-content > .inside {
3243 - padding: 0 0 var(--gap-xs);
2324 +.frm-right-panel .accordion-section-content > .inside {
2325 + padding: 0;
3244 2326 }
3245 2327
3246 2328 .frm-right-panel .accordion-section-content .inside a {
3247 2329 font-size: inherit;
@@ -3248,10 +2330,10 @@
3248 2330 }
3249 2331
3250 2332 #post-body-content + .frm-right-panel h3.accordion-section-title {
3251 2333 padding: 7px 10px 8px 14px;
3252 - font-size: var(--text-md);
3253 - color: var(--grey-700);
2334 + font-size: 16px;
2335 + color: var(--dark-grey);
3254 2336 }
3255 2337
3256 2338 .frm-right-panel .control-section.open h3 {
3257 2339 border-bottom: none;
@@ -3260,22 +2342,22 @@
3260 2342 .js .frm-right-panel .control-section.open .accordion-section-title,
3261 2343 .js .frm-right-panel .control-section .accordion-section-title:focus,
3262 2344 .js .frm-right-panel .control-section .accordion-section-title:hover {
3263 2345 background: transparent;
3264 - color: var(--grey-900);
2346 + color: var(--dark-grey);
3265 2347 }
3266 2348
3267 2349 .js .frm-right-panel .control-section .accordion-section-title:hover:before {
3268 - color: var(--grey-700);
2350 + color: var(--dark-grey);
3269 2351 }
3270 2352
3271 2353 .frm-with-line,
3272 2354 .accordion-section-content h4 {
3273 - font-size: var(--text-md);
2355 + font-size: 16px;
3274 2356 font-weight: 400;
3275 2357 margin: 20px -20px 10px;
3276 2358 padding: 0 20px;
3277 - color: var(--grey-700);
2359 + color: var(--dark-grey);
3278 2360 position: relative;
3279 2361 border: none !important;
3280 2362 }
3281 2363
@@ -3305,9 +2387,9 @@
3305 2387 .accordion-section-content h4:before {
3306 2388 content: '';
3307 2389 display: block;
3308 2390 position: absolute;
3309 - border-bottom: 1px solid var(--grey-300);
2391 + border-bottom: 1px solid var(--grey-border);
3310 2392 left: 0;
3311 2393 width: 100%;
3312 2394 top: 50%;
3313 2395 }
@@ -3317,25 +2399,18 @@
3317 2399 position: relative;
3318 2400 }
3319 2401
3320 2402 .frm-right-panel .accordion-section-title:before,
3321 -.frm-right-panel .accordion-section-title:after,
3322 -#frm_new_form_modal .accordion-section-title:after
3323 -{
2403 +.frm-right-panel .accordion-section-title:after {
3324 2404 content: "\e913" !important;
3325 2405 font-family: "s11-fp" !important;
3326 2406 font-size: 18px;
3327 2407 font-variant: normal;
3328 2408 text-rendering: auto;
3329 - vertical-align: text-top;
3330 2409 }
3331 2410
3332 -#frm_new_form_modal .accordion-section.open .accordion-section-title:after {
3333 - transform: rotate(90deg);
3334 -}
3335 -
3336 2411 .frm-right-panel .accordion-section-title:after {
3337 - top: calc(50% - 10px) !important;
2412 + right: 20px;
3338 2413 }
3339 2414
3340 2415 .frm-right-panel .open .accordion-section-title:after {
3341 2416 content: "\e62a" !important;
@@ -3344,9 +2419,9 @@
3344 2419 .frm-right-panel .accordion-section-title:before {
3345 2420 content: "\f1de" !important;
3346 2421 color: var(--grey);
3347 2422 font-size: 17px !important;
3348 - margin: 0 10px 0 0;
2423 + margin: 0 10px;
3349 2424 }
3350 2425
3351 2426 .form-title-style .accordion-section-title:before,
3352 2427 .section-fields-style .accordion-section-title:before {
@@ -3404,21 +2479,16 @@
3404 2479 .progress-bars-style .accordion-section-title:before{
3405 2480 content: "\e939" !important;
3406 2481 }
3407 2482
3408 -#frm_view_editor_left.frm-right-panel .accordion-section-title,
3409 2483 .frm-right-panel h3.accordion-section-title {
3410 2484 padding: 15px 20px;
3411 2485 background: var(--sidebar-color);
3412 - line-height: var(--leading);
3413 - color: var(--grey-700);
3414 - font-size: var(--text-lg);
3415 - font-weight: 400;
2486 + line-height: 1;
3416 2487 }
3417 2488
3418 -.control-section .accordion-section-title:after, /** Form template list */
3419 -.customize-pane-child .accordion-section-title:after {
3420 - top: 15px;
2489 +.control-section .accordion-section-title:after, .customize-pane-child .accordion-section-title:after {
2490 + top: 19px;
3421 2491 }
3422 2492
3423 2493 .accordion-container .frm-dropdown-menu {
3424 2494 min-width: 40px;
@@ -3423,39 +2493,58 @@
3423 2493 .accordion-container .frm-dropdown-menu {
3424 2494 min-width: 40px;
3425 2495 }
3426 2496
3427 -.frm-btn-group .multiselect.dropdown-toggle {
3428 - box-sizing: border-box;
3429 - min-height: unset;
3430 -}
3431 -
3432 2497 .accordion-container .frm-dropdown-menu:before,
3433 2498 .accordion-container .multiselect.dropdown-toggle:before {
3434 2499 font-family: "s11-fp" !important;
3435 2500 }
3436 2501
2502 +.multiselect-container.frm-dropdown-menu input[type=radio] {
2503 + display: none;
2504 +}
2505 +
3437 2506 .multiselect-container {
3438 2507 position: absolute;
3439 2508 list-style-type: none;
3440 2509 margin: 0;
2510 + padding: 0
2511 +}
2512 +
2513 +.multiselect-container .input-group {
2514 + margin: 5px
2515 +}
2516 +
2517 +.multiselect-container > li {
3441 2518 padding: 0;
3442 - width: 100%;
3443 - max-width: 250px;
2519 + margin: 0;
3444 2520 }
3445 2521
3446 -.multiselect-container button.multiselect-option {
3447 - width: 100%;
3448 - text-align: left;
3449 - border: none;
3450 - margin-bottom: 4px;
2522 +.multiselect-container > li > a.multiselect-all label {
2523 + font-weight: 700
3451 2524 }
3452 2525
3453 -.multiselect-container button.multiselect-option label {
3454 - margin-left: 5px;
2526 +.multiselect-container > li > label.multiselect-group {
2527 + margin: 0;
2528 + padding: 3px 20px;
2529 + height: 100%;
2530 + font-weight: 700
3455 2531 }
3456 2532
3457 -.accordion-container .multiselect-container label {
2533 +.frm-dropdown-menu.multiselect-container > li > a {
2534 + padding: 0
2535 +}
2536 +
2537 +.multiselect-container > li > a > label {
2538 + margin: 0;
2539 + padding: 3px 25px;
2540 + height: 100%;
2541 + cursor: pointer;
2542 + font-weight: 400;
2543 + display: block;
2544 +}
2545 +
2546 +.accordion-container .multiselect-container > li > a > label {
3458 2547 padding: 3px 19px 3px 7px;
3459 2548 }
3460 2549
3461 2550 .frm-btn-group.btn-group > .btn-group:nth-child(2) > .multiselect.btn {
@@ -3462,19 +2551,24 @@
3462 2551 border-top-left-radius: 4px;
3463 2552 border-bottom-left-radius: 4px
3464 2553 }
3465 2554
2555 +.form-inline .multiselect-container label.checkbox,
2556 +.form-inline .multiselect-container label.radio {
2557 + padding: 3px 20px;
2558 +}
2559 +
2560 +.form-inline .multiselect-container li a label.checkbox input[type=checkbox],
2561 +.form-inline .multiselect-container li a label.radio input[type=radio] {
2562 + margin-left: -20px;
2563 + margin-right: 0;
2564 +}
2565 +
3466 2566 .frm-btn-group.btn-group, .frm-btn-group.btn-group-vertical {
3467 2567 display: block;
2568 + vertical-align: middle;
3468 2569 }
3469 2570
3470 -.multiselect-option label {
3471 - max-width: calc(100% - 22px);
3472 - text-overflow: ellipsis;
3473 - overflow: hidden;
3474 - white-space: nowrap;
3475 -}
3476 -
3477 2571 .frm_scale {
3478 2572 text-align: center;
3479 2573 float: left;
3480 2574 margin-right: 10px;
@@ -3496,13 +2590,8 @@
3496 2590 width: 100%;
3497 2591 height: auto;
3498 2592 }
3499 2593
3500 -.frm_form_builder .frm_time_wrap .frm_time_sep {
3501 - vertical-align: sub;
3502 - vertical-align: -webkit-baseline-middle;
3503 -}
3504 -
3505 2594 .frm_form_builder input[type=range]::-webkit-slider-runnable-track {
3506 2595 background-color: var(--blue-border);
3507 2596 }
3508 2597
@@ -3519,12 +2608,10 @@
3519 2608 }
3520 2609
3521 2610 .frm-embed-field-placeholder {
3522 2611 text-align: center;
2612 + position: relative;
3523 2613 height: 145px;
3524 - display: flex;
3525 - align-items: center;
3526 - justify-content: center;
3527 2614 }
3528 2615
3529 2616 .frm-fake-field {
3530 2617 display: block;
@@ -3529,9 +2616,9 @@
3529 2616 .frm-fake-field {
3530 2617 display: block;
3531 2618 height: 25px;
3532 2619 background-color: var(--light-blue);
3533 - border: 1px solid var(--grey-300);
2620 + border: 1px solid var(--grey-border);
3534 2621 margin: 10px 0;
3535 2622 border-radius: var(--small-radius);
3536 2623 }
3537 2624
@@ -3537,17 +2624,15 @@
3537 2624
3538 2625 .frm-embed-message {
3539 2626 position: absolute;
3540 2627 background: #fff;
3541 - border: 1px solid var(--grey-300);
3542 - color: var(--grey-700);
3543 - padding: var(--gap-md);
3544 - font-size: var(--text-lg);
3545 - max-width: 200px;
3546 - min-width: 50%;
3547 - margin: 0 var(--gap-md);
3548 - overflow: hidden;
3549 - text-overflow: ellipsis;
2628 + border: 1px solid var(--grey-border);
2629 + color: var(--dark-grey);
2630 + padding: 37px 0;
2631 + font-size: 18px;
2632 + width: 50%;
2633 + top: 23px;
2634 + left: 25%
3550 2635 }
3551 2636
3552 2637 .frm-summary-message {
3553 2638 top: 50%;
@@ -3552,9 +2637,9 @@
3552 2637 .frm-summary-message {
3553 2638 top: 50%;
3554 2639 left: 50%;
3555 2640 padding: 15px 0;
3556 - font-size: var(--text-md);
2641 + font-size: 16px;
3557 2642 transform: translate(-50%, -50%);
3558 2643 }
3559 2644
3560 2645 .frm-summary-learn-more {
@@ -3563,9 +2648,8 @@
3563 2648
3564 2649 .frm-single-settings .frm-embed-message {
3565 2650 width: 100%;
3566 2651 position: static;
3567 - border-radius: var(--small-radius);
3568 2652 }
3569 2653
3570 2654 #new_fields input[type=text],
3571 2655 #new_fields input[type=number],
@@ -3602,8 +2686,19 @@
3602 2686 width: 16px;
3603 2687 padding: 0;
3604 2688 }
3605 2689
2690 +.frm-star-group:not(.frm-star-hovered) input[type=radio]:checked + label:before,
2691 +.frm-star-group input + label:hover:before,
2692 +.frm-star-group:hover input + label:hover:before,
2693 +.frm-star-group .star-rating-on:before,
2694 +.frm-star-group .star-rating-hover:before,
2695 +.frm-star-group input[type=radio]:checked + label:before,
2696 +.frm-star-group input + label:before,
2697 +.frm-star-group .star-rating:before {
2698 + color: var( --blue-border);
2699 +}
2700 +
3606 2701 .frm_wrap .frm-number-range + .frm_last input,
3607 2702 .frm_wrap .frm-number-range input {
3608 2703 text-align: center;
3609 2704 font-weight: 600;
@@ -3610,9 +2705,9 @@
3610 2705 }
3611 2706
3612 2707 .frm_wrap .frm-number-range input[type=number],
3613 2708 .frm_wrap .frm-number-range input[type=text] {
3614 - color: var(--primary-700);
2709 + color: var(--primary-hover);
3615 2710 }
3616 2711
3617 2712 .frm-range-min {
3618 2713 position: relative;
@@ -3622,30 +2717,28 @@
3622 2717 content: '';
3623 2718 height: 3px;
3624 2719 width: 10px;
3625 2720 border-radius: 30%;
3626 - background: var(--primary-700);
2721 + background: var(--primary-hover);
3627 2722 position: absolute;
3628 2723 top: 17px;
3629 2724 right: -28%;
3630 2725 }
3631 2726
3632 -.frm_grid_container > p,
3633 2727 .frm_grid_container > p.frm_form_field,
3634 2728 .frm_grid_container > div.frm_form_field,
3635 2729 #new_fields .frm_grid_container > p {
3636 - margin-top: 8px;
3637 - margin-bottom: 8px;
2730 + margin-top: 7px;
2731 + margin-bottom: 7px;
3638 2732 margin-right: 0;
3639 2733 }
3640 2734
3641 2735 #new_fields div.frm_grid_container > .frm_primary_label {
3642 - margin-top: 8px;
2736 + margin-top: 7px;
3643 2737 }
3644 2738
3645 2739 #new_fields .frm_primary_label + p,
3646 -#new_fields .frm_primary_label + .frm6 + .frm6,
3647 -#new_fields .frm_primary_label + .frm6 + .frm-inline-modal + .frm6 {
2740 +#new_fields .frm_primary_label + .frm6 + .frm6 {
3648 2741 margin-top: 0;
3649 2742 }
3650 2743
3651 2744 .frm_catlevel_2, .frm_catlevel_3, .frm_catlevel_4, .frm_catlevel_5 {
@@ -3674,9 +2767,9 @@
3674 2767 }
3675 2768
3676 2769 .frm_form_builder .frm_radio label,
3677 2770 .frm_form_builder .frm_checkbox label {
3678 - font-size: var(--text-sm);
2771 + font-size: 14px;
3679 2772 }
3680 2773
3681 2774 /* Start copied front-end CSS */
3682 2775 .horizontal_radio .frm_radio,
@@ -3714,64 +2807,22 @@
3714 2807
3715 2808 .frm_wrap .with_frm_style .frm_checkbox input[type=checkbox],
3716 2809 .frm_wrap .with_frm_style .frm_radio input[type=radio],
3717 2810 .frm_wrap input[type=checkbox],
3718 -.frm-white-body input[type=checkbox],
3719 2811 .field-group input[type=checkbox],
3720 2812 .frm_scale input[type=radio],
3721 2813 .frm_radio input[type=radio],
3722 2814 .frm_checkbox input[type=checkbox] {
3723 - border: 1px solid var(--grey-300);
2815 + border: 1px solid var(--grey-border);
3724 2816 box-shadow: none;
3725 2817 -webkit-appearance: none;
3726 2818 }
3727 2819
3728 -
3729 -.frm_wrap .with_frm_style .frm_checkbox input[type=checkbox],
3730 -.frm_wrap input[type=checkbox],
3731 -.frm-white-body input[type=checkbox],
3732 -.field-group input[type=checkbox],
3733 -.frm_checkbox input[type=checkbox] {
3734 - border-radius: 4px;
3735 -}
3736 -
3737 -.frm-white-body input[type="checkbox"]:checked,
3738 -.frm_wrap input[type="checkbox"]:checked {
3739 - background-color: var(--primary-500);
3740 - border-color: var(--primary-500) !important;
3741 -}
3742 -
3743 -.frm-white-body input[type="checkbox"]:checked:focus,
3744 -.frm_wrap input[type="checkbox"]:checked:focus {
3745 - border-color: var(--primary-500);
3746 -}
3747 -
3748 -.frm-white-body input[type="checkbox"]:checked::before,
3749 -.frm_wrap input[type="checkbox"]:checked::before {
3750 - 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");
3751 - height: 12px;
3752 - width: 12px;
3753 - margin: 1px;
3754 -}
3755 -
3756 2820 .frm_radio input[type="radio"],
3757 2821 .frm_checkbox input[type="checkbox"] {
3758 2822 margin-right: 5px;
3759 2823 }
3760 2824
3761 -.frm_single_entry_page .with_frm_style .frm_radio input[type=radio] {
3762 - margin: 5px 0;
3763 - width: 18px;
3764 - position: relative; /* override Bootstrap */
3765 -}
3766 -
3767 -.frm_single_entry_page .with_frm_style .frm_radio input[type=radio]:before {
3768 - position: relative !important;
3769 - left: calc(50% - 6px);
3770 - top: calc(50% - 6px);
3771 - margin: 0 !important;
3772 -}
3773 -
3774 2825 .frm_inner_field_container {
3775 2826 margin-bottom: 10px;
3776 2827 }
3777 2828
@@ -3785,34 +2836,8 @@
3785 2836 margin-right: 2%;
3786 2837 clear: both;
3787 2838 }
3788 2839
3789 -.frm_inner_field_container > label {
3790 - text-overflow: ellipsis;
3791 - overflow: hidden;
3792 - white-space: nowrap;
3793 -}
3794 -
3795 -.frm_field_box:not(.edit_field_type_divider):hover > .frm_inner_field_container > label,
3796 -.frm_field_box .divider_section_only:hover > .frm_inner_field_container > label,
3797 -li.ui-state-default.selected > .frm_inner_field_container > label {
3798 - max-width: calc(100% - 100px);
3799 -}
3800 -
3801 -.frm-drag-fade {
3802 - background-color: var(--lightest-grey) !important;
3803 - border-radius: 4px;
3804 -}
3805 -
3806 -.frm-drag-fade * {
3807 - opacity: 0;
3808 -}
3809 -
3810 -.frm-dragging .divider_section_only,
3811 -.frm-dragging .frm_field_box {
3812 - pointer-events: none;
3813 -}
3814 -
3815 2840 .frm_form_settings #op-popup, /* 1Password */
3816 2841 .frm_form_settings com-1password-op-button,
3817 2842 .frm_conf_below .frm_conf_field_container .frm_primary_label,
3818 2843 .frm_conf_inline .frm_inner_field_container .frm-show-click a,
@@ -3947,15 +2972,15 @@
3947 2972 animation: spin 2s linear infinite;
3948 2973 }
3949 2974
3950 2975 .frm-wait:before {
3951 - border-bottom-color: var(--primary-700);
3952 - border-right-color: var(--primary-700);
2976 + border-bottom-color: var(--primary-hover);
2977 + border-right-color: var(--primary-hover);
3953 2978 }
3954 2979
3955 2980 .frm_loading_button.frm-button-secondary:before {
3956 - border-bottom-color: var(--primary-500);
3957 - border-right-color: var(--primary-500);
2981 + border-bottom-color: var(--primary-color);
2982 + border-right-color: var(--primary-color);
3958 2983 }
3959 2984
3960 2985 input[type=submit]:focus {
3961 2986 outline: none !important;
@@ -3979,9 +3004,9 @@
3979 3004 #editorcontainer #dyncontent {
3980 3005 margin: 0;
3981 3006 width: 100%;
3982 3007 padding: 6px;
3983 - line-height: var(--leading);
3008 + line-height: 1.5;
3984 3009 border: 0 none;
3985 3010 outline: none;
3986 3011 -moz-box-sizing: border-box;
3987 3012 -webkit-box-sizing: border-box;
@@ -4027,9 +3052,9 @@
4027 3052 font-size: 12px;
4028 3053 }
4029 3054
4030 3055 .frm_border_bottom {
4031 - border-bottom: 1px solid var(--grey-300);
3056 + border-bottom: 1px solid var(--grey-border);
4032 3057 margin-bottom: 10px;
4033 3058 padding-bottom: 10px;
4034 3059 }
4035 3060
@@ -4040,8 +3065,9 @@
4040 3065 .frm_posttax_opt_list .frm_border_bottom input {
4041 3066 margin-right: 1px;
4042 3067 }
4043 3068
3069 +.frm_logic_row,
4044 3070 .frm_add_remove div.frm_form_field {
4045 3071 padding-bottom: 5px;
4046 3072 }
4047 3073
@@ -4098,47 +3124,18 @@
4098 3124 max-width: 100%;
4099 3125 font-size: inherit;
4100 3126 }
4101 3127
4102 -/* Start entry statuses */
4103 -.frm-entry-status {
4104 - padding: var(--gap-2xs) var(--gap-xs);
4105 - align-items: center;
4106 - border-radius: var(--small-radius);
4107 - text-transform: uppercase;
4108 -}
4109 -
4110 -.frm-entry-status-0 {
4111 - color: #1E561F;
4112 - background: #D5F2DC;
4113 -}
4114 -
4115 -.frm-entry-status-1 {
4116 - color: #7A4D05;
4117 - background: #FFF2D2;
4118 -}
4119 -/* End entry statuses */
4120 -
4121 3128 #frm-options-panel {
4122 - padding: 0 var(--gap-sm);
4123 - color: var(--grey-900);
3129 + padding: 0 15px;
3130 + color: var(--darkest-grey);
4124 3131 }
4125 3132
4126 -.frm-right-panel a.frm_add_logic_link,
4127 3133 #frm-options-panel h3 {
4128 3134 padding: 15px 0;
4129 3135 margin-top: -2px;
4130 3136 }
4131 3137
4132 -.frm-right-panel a.frm_add_logic_link:focus {
4133 - outline: auto;
4134 -}
4135 -
4136 -#frm_style_sidebar h3,
4137 -#frm_view_editor_left.frm-right-panel .accordion-section-title {
4138 - padding: 15px 0;
4139 -}
4140 -
4141 3138 .frm_field_key {
4142 3139 background-color: #F7F7F7;
4143 3140 }
4144 3141
@@ -4172,12 +3169,8 @@
4172 3169 .frm-alt-table tr:nth-child(even) {
4173 3170 background-color: var(--sidebar-color);
4174 3171 }
4175 3172
4176 -.frm-alt-table h3 {
4177 - margin-bottom: 0;
4178 -}
4179 -
4180 3173 .form-field .frm_cb_button {
4181 3174 height: 22px;
4182 3175 line-height: 20px;
4183 3176 margin-bottom: 10px;
@@ -4262,9 +3255,8 @@
4262 3255
4263 3256 .frm_field_box {
4264 3257 padding: 5px;
4265 3258 min-height: 20px;
4266 - margin: 10px 0;
4267 3259 }
4268 3260
4269 3261 .frm_indent_opt, td.frm_indent_opt {
4270 3262 padding-left: 25px;
@@ -4279,53 +3271,47 @@
4279 3271 }
4280 3272
4281 3273 .frm_single_option.ui-sortable-placeholder,
4282 3274 li.sortable-placeholder {
3275 + width: calc(100% - 5px) !important;
3276 + height: 0 !important;
4283 3277 border: none;
3278 + box-shadow: 2px -10px 0 1px var(--primary-color);
4284 3279 margin: 0;
4285 3280 visibility: visible !important;
4286 - box-shadow: 2px -10px 0 2px var(--primary-500);
4287 3281 }
4288 3282
4289 -#frm_form_editor_container > ul > .frm_single_option.ui-sortable-placeholder,
4290 -#frm_form_editor_container > ul > li.sortable-placeholder {
4291 - width: calc(100% - 5px) !important;
4292 - height: 0 !important;
4293 -}
4294 -
4295 -#frm_form_editor_container > ul > li > ul {
4296 - position: relative;
4297 -}
4298 -
4299 -#frm_form_editor_container > ul > li > ul > li.sortable-placeholder,
4300 -#frm_form_editor_container ul.start_divider > li > ul > li.sortable-placeholder {
4301 - position: absolute;
4302 - top: 20px;
4303 - bottom: 0;
4304 -}
4305 -
4306 3283 .edit_field_type_divider + li.sortable-placeholder {
4307 - box-shadow: 2px 5px 0 2px var(--primary-500);
3284 + box-shadow: 2px 5px 0 1px var(--primary-color);
4308 3285 }
4309 3286
4310 3287 .start_divider li.sortable-placeholder {
4311 - box-shadow: 2px -5px 0 2px var(--primary-500);
3288 + box-shadow: 2px -5px 0 1px var(--primary-color);
4312 3289 }
4313 3290
4314 -.frm-is-collapsed + .sortable-placeholder {
4315 - box-shadow: 2px 15px 0 2px var(--primary-500);
3291 +.frm_single_option.ui-sortable-placeholder {
3292 + box-shadow: 20px -3px 0 1px var(--primary-color);
4316 3293 }
4317 3294
4318 -.frm_single_option.ui-sortable-placeholder {
4319 - box-shadow: 0 0 1px 1px var(--primary-500);
3295 +.frm-is-collapsed + .sortable-placeholder {
3296 + box-shadow: 2px 15px 0 1px var(--primary-color);
4320 3297 }
4321 3298
4322 3299 .frm_sorting > li.edit_field_type_end_divider:first-child,
3300 +.frm_sorting > .frmbutton + .sortable-placeholder, /* hide for first field */
3301 +.no-drop-placeholder,
4323 3302 .frm-show-click,
4324 3303 li.ui-state-default.edit_field_type_divider .frm-show-click {
4325 3304 display: none;
4326 3305 }
4327 3306
3307 +.frm_form_field.ui-sortable-helper {
3308 + height: 30px !important;
3309 + background-color: #fff !important;
3310 + overflow: hidden !important;
3311 + box-sizing: border-box;
3312 +}
3313 +
4328 3314 .frm_form_field.ui-sortable-helper .frm-field-action-icons,
4329 3315 .frm_form_field.ui-sortable-helper .frm_form_fields,
4330 3316 .frm_form_field.ui-sortable-helper .frm_description,
4331 3317 .frm_form_field.ui-sortable-helper .description {
@@ -4347,12 +3333,8 @@
4347 3333 opacity: 0;
4348 3334 transition: opacity .15s ease-in-out;
4349 3335 }
4350 3336
4351 -#frm-show-fields .frm-field-settings-open .frm-show-hover {
4352 - opacity: 1;
4353 -}
4354 -
4355 3337 .frm_sortable_field_opts {
4356 3338 margin-top: 5px;
4357 3339 }
4358 3340
@@ -4415,12 +3397,8 @@
4415 3397 li.ui-state-default.selected.edit_field_type_divider .divider_section_only .frm-show-hover {
4416 3398 opacity: 100;
4417 3399 }
4418 3400
4419 -li.frm_field_box > ul.frm_grid_container {
4420 - position: relative;
4421 -}
4422 -
4423 3401 .frm_sorting span.ui-icon {
4424 3402 width: 16px;
4425 3403 }
4426 3404
@@ -4427,10 +3405,10 @@
4427 3405 /* Image options for Radio and Checkbox */
4428 3406
4429 3407 .frm_image_options .frm_image_option_container {
4430 3408 --field-border-width: 1px;
4431 - --border-color: var(--grey-300);
4432 - --border-color-active: var(--primary-500);
3409 + --border-color: var(--grey-border);
3410 + --border-color-active: var(--primary-color);
4433 3411 --border-radius: var(--small-radius);
4434 3412 }
4435 3413
4436 3414 .frm_image_option_container svg {
@@ -4484,10 +3462,10 @@
4484 3462 height: 75px;
4485 3463 object-fit: cover;
4486 3464 }
4487 3465
4488 -.frm_list_entry_page img {
4489 - max-width: 100%;
3466 +.frm_list_entry_page .frm_file_link img {
3467 + max-width: 75px;
4490 3468 height: auto;
4491 3469 }
4492 3470
4493 3471 .frm_image_option_container .frm_empty_url {
@@ -4531,13 +3509,13 @@
4531 3509 margin-top: 17px;
4532 3510 }
4533 3511
4534 3512 .frm_image_data {
4535 - margin-left: var(--gap-xs);
3513 + margin-left: 10px;
4536 3514 display: flex;
4537 3515 flex-direction: column;
4538 - font-size: var(--text-sm);
4539 - justify-content: space-around;
3516 + font-size: 14px;
3517 + line-height: 17px;
4540 3518 }
4541 3519
4542 3520 .frm_image_styling_frame {
4543 3521 display: flex;
@@ -4561,9 +3539,10 @@
4561 3539 max-width: 54px;
4562 3540 }
4563 3541
4564 3542 .frm_image_preview_title{
4565 - color: var(--grey-500);
3543 + margin-top: 6px;
3544 + color: rgba(40, 47, 54, 0.65);
4566 3545 overflow: hidden;
4567 3546 white-space: nowrap;
4568 3547 text-overflow: ellipsis;
4569 3548 }
@@ -4569,9 +3548,9 @@
4569 3548 }
4570 3549
4571 3550 .frm_wrap .frm_choose_image_box {
4572 3551 cursor: pointer;
4573 - color: var(--grey-700);
3552 + color: var(--dark-grey);
4574 3553 background-color: #F2F2F2;
4575 3554 margin-left: 24px;
4576 3555 text-align: center;
4577 3556 width: 100%;
@@ -4580,11 +3559,13 @@
4580 3559 .frm_wrap .frm_choose_image_box:hover {
4581 3560 background: #fff;
4582 3561 }
4583 3562
3563 +a.frm_remove_image_option .frmsvg,
4584 3564 a.frm_remove_image_option,
4585 3565 .frm_remove_image_option {
4586 - color: var(--grey-400);
3566 + margin-top: 9px;
3567 + color: rgba(40, 47, 54, 0.4);
4587 3568 cursor: pointer;
4588 3569 }
4589 3570
4590 3571 a.frm_remove_image_option:hover .frmsvg,
@@ -4594,10 +3575,17 @@
4594 3575 }
4595 3576
4596 3577 /* Form settings */
4597 3578
3579 +#form_settings_page label,
3580 +.frm_form_builder label {
3581 + font-weight: normal;
3582 + font-size: 15px;
3583 + color: var(--dark-grey);
3584 +}
3585 +
4598 3586 .frm-form-setting-tabs {
4599 - margin-top: var(--gap-sm) !important;
3587 + margin-top: 20px !important;
4600 3588 }
4601 3589
4602 3590 .frm-right-panel > .postbox {
4603 3591 background-color: transparent;
@@ -4608,44 +3596,40 @@
4608 3596
4609 3597 .frm-right-panel .postbox.frm_with_icons .inside,
4610 3598 .frm-right-panel .postbox .inside,
4611 3599 .frm-right-panel .inside {
4612 - font-size: var(--text-md);
3600 + font-size: 16px;
4613 3601 padding: 15px 20px 20px;
4614 - color: var(--grey-700);
3602 + color: var(--dark-grey);
4615 3603 }
4616 3604
4617 3605 .frm-right-panel .misc-pub-section {
4618 - padding: var(--gap-xs) 0;
3606 + padding: 10px 0;
3607 + line-height: 1.4em;
4619 3608 position: relative;
4620 3609 }
4621 3610
4622 3611 .frm-right-panel .inside a,
4623 3612 .frm-form-setting-tabs a {
4624 - font-size: var(--text-md);
4625 - color: var(--grey-700);
4626 - padding: var(--gap-sm);
3613 + font-size: 16px;
3614 + color: var(--dark-grey);
3615 + padding: 15px 15px 15px 20px;
4627 3616 display: block;
4628 3617 }
4629 3618
4630 -.frm-form-setting-tabs a {
4631 - color: var(--grey-900);
4632 - padding: var(--gap-sm) var(--gap-md);
4633 -}
4634 -
4635 3619 .frm-right-panel .inside a {
4636 3620 padding: 0;
4637 - color: var(--primary-500);
3621 + color: var(--primary-color);
4638 3622 display: inline-block;
4639 3623 }
4640 3624
4641 3625 .frm-right-panel .inside a:hover {
4642 - color: var(--primary-700);
3626 + color: var(--primary-hover);
4643 3627 }
4644 3628
4645 3629 .frm-form-setting-tabs a:hover {
4646 3630 background: var(--sidebar-hover);
4647 - color: var(--grey-900);
3631 + color: var(--dark-grey);
4648 3632 }
4649 3633
4650 3634 .frm-right-panel .inside i,
4651 3635 .frm-right-panel .inside .frmsvg,
@@ -4654,20 +3638,16 @@
4654 3638 margin: 0 5px;
4655 3639 display: inline-block;
4656 3640 width: 20px;
4657 3641 height: 20px;
4658 - color: var(--grey-500);
3642 + color: var(--grey);
4659 3643 }
4660 3644
4661 -.frm-form-setting-tabs a .frmsvg {
4662 - margin: 0;
4663 -}
4664 -
4665 3645 .frm-right-panel .inside a:hover i,
4666 3646 .frm-right-panel .inside a:hover .frmsvg,
4667 3647 .frm-form-setting-tabs a:hover .frmsvg,
4668 3648 .frm-form-setting-tabs a:hover span {
4669 - color: var(--grey-700);
3649 + color: var(--dark-grey);
4670 3650 }
4671 3651
4672 3652 .frm_settings_form .tabs-panel {
4673 3653 padding: 0 25px;
@@ -4681,9 +3661,9 @@
4681 3661
4682 3662 #frm_adv_info .tabs-panel {
4683 3663 min-height: 0 !important;
4684 3664 overflow-x: hidden;
4685 - padding: 0;
3665 + padding: 0 20px;
4686 3666 border: none;
4687 3667 background: transparent;
4688 3668 }
4689 3669
@@ -4692,130 +3672,48 @@
4692 3672 }
4693 3673
4694 3674 .frm_posttax_opt_list,
4695 3675 .frm_submit_logic_rows {
4696 - border: 1px solid var(--grey-300);
4697 - padding: var(--gap-md);
3676 + border: 1px solid var(--grey-border);
3677 + padding: 25px;
4698 3678 border-radius: var(--small-radius);
4699 - margin: 5px 0 5px var(--gap-md);
3679 + margin: 5px 0 5px 25px;
4700 3680 }
4701 3681
4702 -.frm_submit_logic_rows .frm_grid_container > p.frm_form_field {
4703 - margin: 0;
4704 -}
4705 -
4706 -/* Color picker CSS */
4707 -.frm-right-panel .wp-picker-open + .wp-picker-input-wrap {
3682 +/* Admin toggle */
3683 +.frm_toggle_off,
3684 +.frm_toggle_on {
3685 + display: none;
3686 + color: #fff;
3687 + z-index: 999;
4708 3688 position: absolute;
4709 - margin-left: calc( ( 100% - 35px ) * -1 );
4710 - margin-top: 1px;
4711 - width: calc( 100% - 36px );
3689 + font-size: 10px;
3690 + line-height: 20px;
3691 + left: 6px;
4712 3692 }
4713 3693
4714 -.frm-right-panel .wp-picker-container input[type="text"].wp-color-picker {
4715 - border: none;
4716 - padding: 5px 8px;
4717 - font-family: inherit;
4718 - color: var(--grey-700);
4719 - font-size: var(--text-md);
4720 - width: 100%;
4721 - line-height: var(--leading);
4722 -}
4723 -
4724 -.frm-right-panel .wp-picker-input-wrap .wp-picker-clear {
4725 - display: none !important;
4726 -}
4727 -
4728 -.frm-right-panel .wp-picker-holder {
4729 - position: absolute;
4730 - z-index: 999;
4731 -}
4732 -
4733 -.frm-right-panel .wp-picker-input-wrap label {
4734 - margin-bottom: 0;
4735 -}
4736 -
4737 -.frm-right-panel .wp-picker-container .wp-color-result.button {
4738 - width: 100%;
4739 - overflow: hidden;
4740 - margin: 0 !important;
4741 - height: var(--h-md) !important;
4742 - padding: 0 0 0 var(--gap-lg) !important;
4743 - border-radius: var(--small-radius);
4744 - border-color: var(--grey-300);
4745 -}
4746 -
4747 -.frm-right-panel .wp-color-result-text {
4748 - line-height: var(--leading) !important;
4749 - font-size: var(--text-md);
4750 - background: #fff !important;
4751 - color: var(--grey-900);
4752 - padding: 5px 8px;
4753 - border-color: var(--grey-300);
4754 - text-align: left;
4755 -}
4756 -
4757 -.frm-right-panel .color-alpha {
4758 - width: var(--gap-lg) !important;
4759 -}
4760 -
4761 -.frm_grid_container .wp-picker-container {
4762 - width: 100%;
4763 - position: relative;
4764 -}
4765 -
4766 -.wp-picker-container button.wp-color-result {
4767 - border: 1px solid var(--grey-300) !important;
4768 -}
4769 -
4770 -.wp-picker-container .wp-picker-input-wrap input.hex.wp-color-picker {
4771 - max-width: 100%;
4772 - position: relative;
4773 -}
4774 -
4775 -.frm_end .wp-picker-holder {
4776 - margin-left: -145px;
4777 -}
4778 -
4779 -.frm_end.frm6 .wp-picker-holder {
4780 - margin-left: -86px;
4781 -}
4782 -/* End of color picker CSS */
4783 -
4784 -/*
4785 -These are the styles for the "Enable Formidable styling" toggle in the visual styler.
4786 -To use this element, you can call the FrmHtmlHelper::toggle function.
4787 -*/
4788 -.frm_toggle_opt {
4789 - padding: 0;
4790 - white-space: normal;
3694 +.frm_toggle_off {
4791 3695 display: inline;
4792 - vertical-align: middle;
4793 - font-weight: normal;
3696 + left: auto;
3697 + right: 5px;
3698 + color: var(--dark-grey);
4794 3699 }
4795 3700
4796 -.frm_on_label,
4797 -.frm_off_label {
4798 - color: #444444;
4799 -}
4800 -
4801 3701 .frm_toggle {
4802 3702 position: relative;
4803 3703 display: inline-block;
4804 - width: 40px;
4805 - height: var(--h-xs);
3704 + width: 45px;
3705 + height: 20px;
4806 3706 vertical-align: middle;
3707 + margin: 2px;
4807 3708 }
4808 3709
4809 -.frm_toggle_block {
4810 - display: inline-flex;
4811 - gap: var(--gap-sm);
4812 - align-items: center;
3710 +label > span.frm_toggle {
3711 + margin-right: 15px;
4813 3712 }
4814 3713
4815 -.frm_toggle input, /* Reverse compatibility */
4816 -.frm_toggle_block input {
4817 - display:none !important;
3714 +.frm_toggle input {
3715 + display: none !important;
4818 3716 }
4819 3717
4820 3718 .frm_toggle_slider {
4821 3719 position: absolute;
@@ -4823,44 +3721,26 @@
4823 3721 top: 0;
4824 3722 left: 0;
4825 3723 right: 0;
4826 3724 bottom: 0;
4827 - background-color: var(--grey-border);
4828 3725 transition: .4s;
4829 3726 border-radius: 30px;
3727 + background-color: #fff;
3728 + box-shadow: 0 0 0 2px var(--grey);
4830 3729 }
4831 3730
4832 3731 .frm_toggle_slider:before {
4833 3732 border-radius: 50%;
4834 3733 position: absolute;
4835 - 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>");
4836 - height: 22px;
4837 - width: 22px;
4838 - padding: 0 5.5px;
4839 - left: 1px;
4840 - bottom: 1px;
4841 - background-color: white;
4842 - transition: .4s;
4843 - box-sizing: border-box;
4844 - box-shadow: var(--box-shadow-md);
4845 - font-size: 21px;
4846 - line-height: 18px;
3734 + content: "";
3735 + height: 16px;
3736 + width: 16px;
3737 + left: 2px;
3738 + top: 2px;
3739 + transition: .3s;
3740 + background-color: var(--grey);
4847 3741 }
4848 3742
4849 -input:checked + .frm_toggle .frm_toggle_slider {
4850 - background-color: var(--primary-500);
4851 -}
4852 -
4853 -input:focus + .frm_toggle .frm_toggle_slider {
4854 - box-shadow: var(--box-shadow-md);
4855 -}
4856 -
4857 -input:checked + .frm_toggle .frm_toggle_slider:before {
4858 - padding: 0 6px;
4859 - transform: translateX(16px);
4860 - 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>");
4861 -}
4862 -
4863 3743 input[disabled] + .frm_toggle_slider {
4864 3744 pointer-events: none;
4865 3745 cursor: text;
4866 3746 opacity: .5;
@@ -4865,53 +3745,16 @@
4865 3745 cursor: text;
4866 3746 opacity: .5;
4867 3747 }
4868 3748
4869 -.frm_toggle_opt ~ .frm_toggle .frm_toggle_slider:before {
4870 - content: '' !important; /* Don't show x/check if off label included or on builder page */
4871 -}
4872 -
4873 -.rtl .frm_toggle_opt {
4874 - padding: 0 8px;
4875 -}
4876 -
4877 -.rtl .frm_toggle_slider:before {
4878 - left: 17px;
4879 -}
4880 -
4881 -.rtl input:checked + .frm_toggle .frm_toggle_slider:before {
4882 - transform: none!important;
4883 - left: 1px;
4884 -}
4885 -
4886 -/* Deprecated admin toggle */
4887 -.frm_toggle_off,
4888 -.frm_toggle_on {
4889 - display: none;
4890 - color: #fff;
4891 - z-index: 999;
4892 - position: absolute;
4893 - font-size: 10px;
4894 - line-height: 20px;
4895 - left: 6px;
4896 -}
4897 -
4898 -.frm_toggle_off {
4899 - display: inline;
4900 - left: auto;
4901 - right: 5px;
4902 - color: var(--dark-grey);
4903 -}
4904 -
4905 3749 .frm_toggle_long {
4906 - width: 80% !important;
3750 + width: 80%;
4907 3751 height: 28px;
4908 - display: inline-block !important;
4909 3752 }
4910 3753
4911 3754 .frm_toggle_long .frm_toggle_slider {
4912 - background: var(--primary-700);
4913 - box-shadow: 0 0 0 2px var(--primary-700);
3755 + background: var(--primary-hover);
3756 + box-shadow: 0 0 0 2px var(--primary-hover);
4914 3757 }
4915 3758
4916 3759 .frm_toggle_long .frm_toggle_off,
4917 3760 .frm_toggle_long .frm_toggle_on {
@@ -4936,11 +3779,20 @@
4936 3779 border-radius: var(--border-radius) 0 0 var(--border-radius);
4937 3780 height: 100%;
4938 3781 background-color: #fff;
4939 3782 color: var(--primary-color);
4940 - content: '' !important;
4941 3783 }
4942 3784
3785 +input:checked + .frm_toggle_slider {
3786 + background-color: var(--primary-hover);
3787 + box-shadow: 0 0 0 2px var(--primary-hover);
3788 +}
3789 +
3790 +input:checked + .frm_toggle_slider:before {
3791 + transform: translateX(25px);
3792 + background-color: #fff;
3793 +}
3794 +
4943 3795 .frm_toggle_long input:checked + .frm_toggle_slider:before {
4944 3796 transform: translateX(101%);
4945 3797 border-radius: 0 var(--border-radius) var(--border-radius) 0;
4946 3798 }
@@ -4955,9 +3807,9 @@
4955 3807
4956 3808 .frm_toggle_long .frm_toggle_on,
4957 3809 .frm_toggle_long input:checked + .frm_toggle_slider + .frm_toggle_on + .frm_toggle_off {
4958 3810 display: inline;
4959 - color: var(--primary-500);
3811 + color: var(--primary-color);
4960 3812 font-weight: normal;
4961 3813 }
4962 3814
4963 3815 .frm_toggle_long .frm_toggle_off,
@@ -4965,9 +3817,11 @@
4965 3817 color: #fff;
4966 3818 font-weight: bold;
4967 3819 }
4968 3820
4969 -/* End toggle styling */
3821 +input:focus + .frm_toggle_slider {
3822 + box-shadow: 0 0 1px #008ec2;
3823 +}
4970 3824
4971 3825 /* Global Settings */
4972 3826
4973 3827 .tabs-panel {
@@ -4985,59 +3839,21 @@
4985 3839 margin-right: 20px !important;
4986 3840 display: inline-block !important;
4987 3841 }
4988 3842
4989 -#frm_stripe_icon {
4990 - border-radius: 5px;
4991 -}
4992 -
4993 -#captcha_settings .frm_primary_label {
4994 - margin-top: var(--gap-sm);
4995 -}
4996 -
4997 -.frm-long-icon-buttons {
4998 - display: flex;
4999 - gap: var(--gap-md);
5000 -}
5001 -
5002 -.frm-long-icon-buttons > label {
5003 - border: 1px solid var(--grey-300);
5004 - color: var(--grey-700);
5005 - border-radius: var(--small-radius);
5006 - display: flex;
5007 - padding: var(--gap-sm);
5008 - gap: var(--gap-sm);
5009 - justify-content: center;
5010 - align-items: center;
5011 - width: calc( 33% - var(--gap-sm) );
5012 - box-sizing: border-box;
5013 -}
5014 -
5015 -.frm-long-icon-buttons > label:hover {
5016 - color: var(--primary-500);
5017 -}
5018 -
5019 -.frm-long-icon-buttons input[type=radio] {
5020 - display: none;
5021 -}
5022 -
5023 -.frm-long-icon-buttons input[type=radio]:checked + label {
5024 - border-color: var(--primary-500);
5025 - box-shadow: 0 0 0 1px var(--primary-color);
5026 -}
5027 -
5028 -.frm-long-icon-buttons label > svg {
5029 - height: 21px;
5030 -}
5031 -
5032 3843 .frm-example-icon .frmsvg,
5033 3844 .frm-example-icon i {
5034 3845 height: 20px;
5035 3846 width: 20px;
5036 3847 font-size: 20px;
5037 - color: var(--grey-700);
3848 + color: var(--dark-grey);
5038 3849 }
5039 3850
3851 +.edd_frm_license_row {
3852 + clear: both;
3853 + line-height: 2em;
3854 +}
3855 +
5040 3856 .frm_license_msg {
5041 3857 margin-top: 0;
5042 3858 }
5043 3859
@@ -5064,14 +3880,23 @@
5064 3880
5065 3881 .frm_no_items {
5066 3882 margin: 0 auto 50px;
5067 3883 text-align: center;
5068 - color: var(--grey-700);
3884 + color: var(--dark-grey);
5069 3885 max-width: 500px;
5070 3886 }
5071 3887
3888 +.frm_no_items h2 {
3889 + font-size: 25px;
3890 + margin-bottom: 30px !important;
3891 +}
3892 +
3893 +.frm_no_items p {
3894 + font-size: 14px;
3895 +}
3896 +
5072 3897 .frm-subscribe {
5073 - margin: var(--gap-lg) 0;
3898 + margin: 30px 0;
5074 3899 }
5075 3900
5076 3901 /* Inbox */
5077 3902
@@ -5081,16 +3906,16 @@
5081 3906
5082 3907 .frm_inbox_card {
5083 3908 display: grid;
5084 3909 grid-template-columns: 72px 1fr;
5085 - grid-gap: var(--gap-xs);
5086 - border-bottom: 1px solid var(--grey-300);
5087 - padding: var(--gap-md);
3910 + grid-gap: 15px;
3911 + border-bottom: 1px solid var(--grey-border);
3912 + padding: 25px;
5088 3913 }
5089 3914
5090 3915 .frm_inbox_card_icon {
5091 3916 grid-row: span 3 / span 3;
5092 - padding-top: var(--gap-xs);
3917 + padding-top: 20px;
5093 3918 text-align: center
5094 3919 }
5095 3920
5096 3921 .frm_inbox_card_icon svg {
@@ -5109,8 +3934,11 @@
5109 3934 border: none;
5110 3935 text-transform: none;
5111 3936 margin: 0;
5112 3937 padding: 0;
3938 + font-weight: 600;
3939 + color: var(--medium-grey);
3940 + font-size: 16px;
5113 3941 }
5114 3942
5115 3943 .frm_inbox_date {
5116 3944 text-align: right;
@@ -5138,8 +3966,37 @@
5138 3966 margin-left: 2px;
5139 3967 vertical-align: text-bottom;
5140 3968 }
5141 3969
3970 +/* Styles tabs */
3971 +
3972 +#frm_styling_form #frm_delete_style {
3973 + padding-right: 10px;
3974 +}
3975 +
3976 +#frm_styling_form #frm_delete_style .frmsvg {
3977 + vertical-align: -webkit-baseline-middle;
3978 +}
3979 +
3980 +.frm_pro_form .frm_form_field.frm_lite_style,
3981 +.frm_pro_form .frm_lite_style {
3982 + display: none !important;
3983 +}
3984 +
3985 +label.default-style-box input[type="checkbox"] {
3986 + vertical-align: middle;
3987 +}
3988 +
3989 +#frm_styling_form .frm_form_field input[type="checkbox"],
3990 +#frm_styling_form .frm_form_field input[type="radio"] {
3991 + vertical-align: bottom;
3992 +}
3993 +
3994 +#frm_styling_form .howto span {
3995 + float: none;
3996 + margin-top: 0;
3997 +}
3998 +
5142 3999 /* Import/Export */
5143 4000 .csv_opts #frm_csv_col_sep {
5144 4001 width: 45px;
5145 4002 }
@@ -5190,9 +4047,9 @@
5190 4047 padding: 0;
5191 4048 }
5192 4049
5193 4050 .frm-feature-banner {
5194 - background: var(--grey-700);
4051 + background: var(--dark-grey);
5195 4052 color: #fff;
5196 4053 border-radius: var(--small-radius);
5197 4054 padding: 20px;
5198 4055 margin: 10px 0;
@@ -5198,9 +4055,9 @@
5198 4055 margin: 10px 0;
5199 4056 }
5200 4057
5201 4058 .frm-feature-banner p {
5202 - font-size: var(--text-sm);
4059 + font-size: 14px;
5203 4060 }
5204 4061
5205 4062 .frm-feature-banner .dismiss {
5206 4063 margin-top: -10px;
@@ -5235,31 +4092,29 @@
5235 4092 /*Form Settings Tab*/
5236 4093
5237 4094 h2.frm-h2,
5238 4095 .frm_form_settings h2 {
5239 - border-bottom: 1px solid var(--grey-300);
5240 - color: var(--grey-900);
5241 - font-weight: 400 !important;
4096 + border-bottom: 1px solid var(--grey-border);
4097 + color: var(--dark-grey);
4098 + font-size: 20px !important;
4099 + font-weight: 500 !important;
5242 4100 padding: 9px 0 5px;
5243 4101 margin: 0;
5244 4102 }
5245 4103
5246 4104 .frm_settings_form h3,
5247 -.frm_form_settings h3,
5248 -.frm_form_settings span.frm_add_logic_link {
5249 - font-size: var(--text-md);
5250 - border-top: 1px solid var(--grey-300);
5251 - padding-top: var(--gap-sm);
5252 - margin: var(--gap-sm) 0;
4105 +.frm_form_settings h3 {
4106 + font-size: 16px;
4107 + border-top: 1px solid var(--grey-border);
4108 + padding-top: 10px;
5253 4109 font-weight: normal;
5254 4110 text-transform: uppercase;
5255 4111 color: var(--medium-grey);
5256 - display: block;
5257 4112 }
5258 4113
5259 4114 .frm_form_settings .howto {
5260 - color: var(--grey-500);
5261 - font-size: var(--text-sm);
4115 + color: var(--medium-grey);
4116 + font-size: 15px;
5262 4117 margin-top: 8px;
5263 4118 }
5264 4119
5265 4120 .frm_form_settings .advanced_settings .form-table {
@@ -5274,10 +4129,18 @@
5274 4129 width: 95%;
5275 4130 }
5276 4131
5277 4132 .frm_wrap .ui-autocomplete {
4133 + box-shadow: none;
4134 + border: 1px solid var(--grey-border);
4135 + border-radius: var(--small-radius);
4136 + background: var(--lightest-grey);
4137 + position: absolute;
5278 4138 padding: 3px 0;
4139 + font-size: 15px;
5279 4140 max-height: 310px;
4141 + overflow-y: auto;
4142 + overflow-x: hidden;
5280 4143 }
5281 4144
5282 4145 .frm_wrap .ui-widget {
5283 4146 font-family: inherit;
@@ -5283,18 +4146,18 @@
5283 4146 font-family: inherit;
5284 4147 }
5285 4148
5286 4149 .frm_wrap .ui-autocomplete li {
5287 - padding: 2px 4px;
4150 + padding: 2px 10px;
5288 4151 background: none;
5289 - color: var(--grey-700);
4152 + color: var(--dark-grey);
5290 4153 border: none;
5291 4154 font-weight: normal;
5292 4155 }
5293 4156
5294 -.frm_wrap .ui-autocomplete .ui-menu-item-wrapper.ui-state-active {
5295 - border: none;
5296 - font-weight: inherit;
4157 +.frm_wrap .ui-autocomplete li.ui-state-focus {
4158 + background: rgb(65, 153, 253);
4159 + color: #fff;
5297 4160 }
5298 4161
5299 4162 .frm_select_with_label {
5300 4163 margin: 7px 0 0;
@@ -5330,9 +4193,9 @@
5330 4193 #frm-insert-fields-box ul.frm_code_list li.clear.frm_block {
5331 4194 height: 10px;
5332 4195 }
5333 4196
5334 -#frm_adv_info .frm_noallow {
4197 +.frm_page_container #frm_adv_info .frm_noallow {
5335 4198 display: none;
5336 4199 }
5337 4200
5338 4201 #frm_adv_info #frm-conditionals .frm_noallow {
@@ -5367,9 +4230,9 @@
5367 4230 #frm_notification_settings .widget-top .widget-action,
5368 4231 #frm_form_editor_container .widget-top .widget-action {
5369 4232 border: 0;
5370 4233 margin: 0;
5371 - padding: 8px;
4234 + padding: 10px;
5372 4235 background: 0 0;
5373 4236 cursor: pointer;
5374 4237 outline: 0;
5375 4238 }
@@ -5374,12 +4237,12 @@
5374 4237 outline: 0;
5375 4238 }
5376 4239
5377 4240 #frm_email_addon_menu {
5378 - border: 1px solid var(--grey-300);
5379 - padding: var(--gap-sm);
4241 + border: 1px solid var(--grey-border);
4242 + padding: 15px;
5380 4243 border-radius: 4px;
5381 - margin: var(--gap-md) 0 var(--gap-sm);
4244 + margin: 25px 0 15px;
5382 4245 }
5383 4246
5384 4247 #frm_email_addon_menu .frm-search {
5385 4248 float: right;
@@ -5390,12 +4253,8 @@
5390 4253 clear: none;
5391 4254 padding-top: 7px;
5392 4255 }
5393 4256
5394 -.frm_email_settings .widget .widget-top {
5395 - background-color: var(--sidebar-color);
5396 -}
5397 -
5398 4257 .frm_email_settings .widget .widget-top,
5399 4258 .frm_email_settings .widget .widget-top h3 {
5400 4259 cursor: pointer !important;
5401 4260 }
@@ -5400,17 +4259,23 @@
5400 4259 cursor: pointer !important;
5401 4260 }
5402 4261
5403 4262 .frm_email_settings .widget {
5404 - margin-bottom: var(--gap-sm);
4263 + margin-bottom: 15px;
4264 + line-height: 1.4em;
4265 + padding: 0;
5405 4266 }
5406 4267
4268 +.frm_email_settings .widget:last-of-type {
4269 + margin-bottom: 20px;
4270 +}
4271 +
5407 4272 .frm_form_action_settings .widget-top {
5408 4273 box-shadow: none;
5409 - border-color: var(--grey-300);
5410 - border-radius: var(--small-radius);
4274 + border-color: var(--grey-border);
4275 + border-radius: 4px;
5411 4276 background: var(--lightest-grey);
5412 - color: var(--grey-700);
4277 + color: var(--dark-grey);
5413 4278 }
5414 4279
5415 4280 .frm_form_action_settings:hover .widget-top {
5416 4281 border-color: var(--grey);
@@ -5422,9 +4287,9 @@
5422 4287 border-bottom: none;
5423 4288 }
5424 4289
5425 4290 .frm_form_action_settings.open:hover .widget-top {
5426 - border-color: var(--grey-300);
4291 + border-color: var(--grey-border);
5427 4292 }
5428 4293
5429 4294 .frm_form_action_settings > .widget-inside {
5430 4295 display: none;
@@ -5436,9 +4301,9 @@
5436 4301
5437 4302 .frm_form_action_settings .widget-inside {
5438 4303 min-height: 25px;
5439 4304 padding: 15px;
5440 - border-color: var(--grey-300);
4305 + border-color: var(--grey-border);
5441 4306 border-bottom-left-radius: 4px;
5442 4307 border-bottom-right-radius: 4px;
5443 4308 }
5444 4309
@@ -5446,14 +4311,14 @@
5446 4311 .frm_form_action_settings .widget-title h3 {
5447 4312 display: inline-block;
5448 4313 border-bottom: none;
5449 4314 padding: 10px 10px 5px;
5450 - font-size: var(--text-md);
4315 + font-size: 16px;
5451 4316 font-weight: 500;
5452 4317 }
5453 4318
5454 4319 #frm_email_addon_menu h3 {
5455 - margin: 0 0 var(--gap-sm);
4320 + margin: 0 0 15px;
5456 4321 clear: both;
5457 4322 }
5458 4323
5459 4324 .frm_single_api_settings p > label {
@@ -5489,9 +4354,9 @@
5489 4354 }
5490 4355
5491 4356 #frm-hide-groups,
5492 4357 #frm-show-groups {
5493 - font-size: var(--text-md);
4358 + font-size: 16px;
5494 4359 float: right;
5495 4360 }
5496 4361
5497 4362 .frm_actions_list a:active, .frm_actions_list a:focus {
@@ -5498,16 +4363,16 @@
5498 4363 outline: none;
5499 4364 }
5500 4365
5501 4366 .frm_actions_list a {
5502 - font-size: var(--text-sm);
5503 - color: var(--grey-700);
4367 + font-size: 14px;
4368 + color: var(--dark-grey);
5504 4369 word-break: break-word;
5505 4370 }
5506 4371
5507 4372 .frm_actions_list span.frm-outer-circle {
5508 4373 /* 50px total with 30px content */
5509 - background-color: var(--grey-100);
4374 + background-color: var(--sidebar-color);
5510 4375 padding: 10px;
5511 4376 text-align: center;
5512 4377 border-radius: 50%;
5513 4378 display: block;
@@ -5513,13 +4378,12 @@
5513 4378 display: block;
5514 4379 width: 30px;
5515 4380 height: 30px;
5516 4381 margin: 0 auto 15px;
5517 - line-height: 1;
5518 4382 }
5519 4383
5520 4384 .frm_email_settings .widget-title h4 {
5521 - color: var(--grey-700);
4385 + color: var(--dark-grey);
5522 4386 }
5523 4387
5524 4388 .frm_disabled_action .widget-title h4 {
5525 4389 color: var(--grey);
@@ -5535,17 +4399,16 @@
5535 4399 }
5536 4400
5537 4401 span.frm-inner-circle,
5538 4402 .frm_email_settings .widget-title .frm_form_action_icon {
5539 - background-color: var(--grey-400);
4403 + background-color: var(--grey-border);
5540 4404 border-radius: 50%;
5541 4405 display: inline-block;
5542 4406 text-align: center;
5543 - line-height: 1;
5544 4407 }
5545 4408
5546 4409 span.frm-inner-circle {
5547 - background-color: var(--primary-700);
4410 + background-color: var(--primary-hover);
5548 4411 height: 22px;
5549 4412 width: 22px;
5550 4413 padding: 4px;
5551 4414 color: #fff;
@@ -5558,9 +4421,9 @@
5558 4421 .frm_email_settings .widget-title .frm_form_action_icon {
5559 4422 height: 15px;
5560 4423 width: 15px;
5561 4424 padding: 5px;
5562 - color: #fff;
4425 + color: var(--lightest-grey);
5563 4426 vertical-align: middle;
5564 4427 }
5565 4428
5566 4429 .frm_actions_list .frmsvg,
@@ -5581,9 +4444,9 @@
5581 4444 }
5582 4445
5583 4446 span.frm-inner-circle.frm-inverse {
5584 4447 background-color: transparent;
5585 - color: var(--primary-700);
4448 + color: var(--primary-hover);
5586 4449 padding: 0;
5587 4450 height: 30px;
5588 4451 width: 100%;
5589 4452 }
@@ -5589,9 +4452,9 @@
5589 4452 }
5590 4453
5591 4454 .frm_actions_list span.frm-inverse i,
5592 4455 .frm_actions_list span.frm-inverse .frmsvg {
5593 - color: var(--primary-700);
4456 + color: var(--primary-hover);
5594 4457 height: 30px;
5595 4458 width: 30px;
5596 4459 font-size: 30px;
5597 4460 padding: 0;
@@ -5603,9 +4466,9 @@
5603 4466 font-size: 30px;
5604 4467 }
5605 4468
5606 4469 .frm_email_settings .widget-title .frm_form_action_icon.frm-inverse {
5607 - background: #fff;
4470 + background: transparent;
5608 4471 padding: 0;
5609 4472 height: 24px;
5610 4473 width: 24px;
5611 4474 }
@@ -5611,17 +4474,18 @@
5611 4474 }
5612 4475
5613 4476 .frm_email_settings .widget-title .frm_form_action_icon.frm-inverse .frmsvg,
5614 4477 .frm_email_settings .widget-title .frm_form_action_icon.frm-inverse i:before {
5615 - color: var(--grey-400);
4478 + color: var(--grey-border);
5616 4479 height: 24px;
5617 4480 width: 24px;
5618 4481 font-size: 24px;
4482 + line-height: 1em;
5619 4483 }
5620 4484
5621 4485 .frm_email_settings .widget-title:hover .frm_form_action_icon.frm-inverse .frmsvg,
5622 4486 .frm_email_settings .widget-title:hover .frm_form_action_icon.frm-inverse i:before {
5623 - color: var(--grey-500);
4487 + color: var(--grey);
5624 4488 }
5625 4489
5626 4490 .frm_email_icons {
5627 4491 padding: 10px 0 5px 6px;
@@ -5632,8 +4496,9 @@
5632 4496 margin-left: 8px;
5633 4497 color: var(--grey);
5634 4498 opacity: 0;
5635 4499 transition: all .2s ease;
4500 + vertical-align: middle;
5636 4501 }
5637 4502
5638 4503 .frm_email_icons a .frmsvg {
5639 4504 color: var(--grey);
@@ -5652,8 +4517,16 @@
5652 4517 .frm_actions_list .frm_inactive_action i {
5653 4518 opacity: .4;
5654 4519 }
5655 4520
4521 +.frm-no-margin {
4522 + margin: 0;
4523 +}
4524 +
4525 +.frm-no-border {
4526 + border: none !important;
4527 +}
4528 +
5656 4529 table td, .form-table tr td {
5657 4530 vertical-align: top;
5658 4531 }
5659 4532
@@ -5680,12 +4553,8 @@
5680 4553 #frm_notification_settings .frm_form_action_settings td p {
5681 4554 padding: 7px 0;
5682 4555 }
5683 4556
5684 -#permissions_settings_settings .frm_grid_container {
5685 - align-items: center;
5686 -}
5687 -
5688 4557 #frm_notification_settings .form-table > tbody > tr > th {
5689 4558 width: 150px;
5690 4559 font-weight: normal;
5691 4560 padding-right: 10px;
@@ -5707,8 +4576,9 @@
5707 4576 #frm_notification_settings .frm_left_label {
5708 4577 /* For add-ons that haven't been updated for 4.0 */
5709 4578 float: none;
5710 4579 width: auto !important;
4580 + line-height: 1;
5711 4581 }
5712 4582
5713 4583 .frm-fields .frm_autoresponder_rows select {
5714 4584 width: auto;
@@ -5721,17 +4591,16 @@
5721 4591 width: 100%;
5722 4592 }
5723 4593
5724 4594 #frm_notification_settings .frm_email_buttons {
5725 - padding: var(--gap-2xs);
4595 + padding: 7px;
5726 4596 background: var(--light-blue);
5727 - color: var(--primary-700);
5728 - border-radius: var(--small-radius);
4597 + color: var(--primary-hover);
4598 + border-radius: 4px;
5729 4599 border-color: var(--blue-border);
5730 - line-height: 1;
4600 + line-height: 1em;
5731 4601 height: auto;
5732 - min-height: 12px;
5733 - font-size: var(--text-xs);
4602 + font-size: 12px;
5734 4603 box-shadow: none;
5735 4604 }
5736 4605
5737 4606 .frm_reply_to_container,
@@ -5736,31 +4605,34 @@
5736 4605
5737 4606 .frm_reply_to_container,
5738 4607 .frm_bcc_cc_container {
5739 4608 float: right;
5740 - margin: -4px 0 0;
4609 + margin: -8px 0 0;
5741 4610 z-index: 1;
5742 4611 position: relative;
5743 4612 }
5744 4613
5745 4614 .frm_email_row .frm_cancel1_icon:before {
4615 + line-height: 1;
5746 4616 vertical-align: bottom;
5747 4617 }
5748 4618
4619 +.frm_action_id {
4620 + padding-top: 10px;
4621 +}
4622 +
5749 4623 .frm_logic_field_opts {
5750 4624 max-width: 35%;
5751 4625 }
5752 4626
5753 4627 .frm-inline-select,
5754 -p.frm-inline-select,
5755 4628 #frm_submit_logic_row,
5756 4629 .frm_logic_rows .frm-collapse-me {
5757 - line-height: var(--h-md) !important;
4630 + line-height: 30px;
5758 4631 }
5759 4632
5760 -.frm_logic_row {
5761 - padding: var(--gap-xs) 0 0;
5762 - align-items: center;
4633 +.frm_logic_row:first-of-type {
4634 + padding-top: 8px;
5763 4635 }
5764 4636
5765 4637 .frm-single-settings .frm_logic_row > select {
5766 4638 max-width: 32.5% !important;
@@ -5797,8 +4669,13 @@
5797 4669 margin-bottom: 0;
5798 4670 padding: 0;
5799 4671 }
5800 4672
4673 +.frm_form_settings input[type="text"] {
4674 + line-height: normal;
4675 + height: auto;
4676 +}
4677 +
5801 4678 #poststuff .widgets-holder-wrap .frm_form_action_settings .widget-inside {
5802 4679 padding-bottom: 0;
5803 4680 }
5804 4681
@@ -5807,9 +4684,9 @@
5807 4684 padding-right: 15px;
5808 4685 }
5809 4686
5810 4687 #form_global_settings h3 {
5811 - font-size: var(--text-sm);
4688 + font-size: 14px;
5812 4689 margin-top: 25px;
5813 4690 }
5814 4691
5815 4692 #form_global_settings .tabs-panel + h3 {
@@ -5824,9 +4701,9 @@
5824 4701 border-top: 1px solid #eee;
5825 4702 border-bottom: none;
5826 4703 margin: 15px -15px 0;
5827 4704 padding: 8px 15px;
5828 - font-size: var(--text-sm);
4705 + font-size: 14px;
5829 4706 }
5830 4707
5831 4708 #poststuff .frm_form_settings h3.frm_first_h3,
5832 4709 #poststuff h3.frm_first_h3 {
@@ -5837,8 +4714,20 @@
5837 4714 h3.frm_add_logic_link {
5838 4715 margin-bottom: 0 !important;
5839 4716 }
5840 4717
4718 +a.frm_add_logic_link {
4719 + display: block;
4720 + text-align: center;
4721 + margin: 10px auto;
4722 + padding: 10px;
4723 + width: 80%;
4724 + max-width: 290px;
4725 + font-size: 19px;
4726 + border: 1px solid var(--primary-color);
4727 + border-radius: var(--border-radius);
4728 +}
4729 +
5841 4730 a.frm_add_logic_link.frm_hidden {
5842 4731 display: none;
5843 4732 }
5844 4733
@@ -5858,9 +4747,9 @@
5858 4747 bottom: 0;
5859 4748 }
5860 4749
5861 4750 .frm_right_addon input {
5862 - padding-right: var(--gap-lg);
4751 + padding-right: 30px;
5863 4752 }
5864 4753
5865 4754 .frm_icon_font {
5866 4755 color: #A0A0A0;
@@ -5866,12 +4755,8 @@
5866 4755 color: #A0A0A0;
5867 4756 color: var(--grey);
5868 4757 }
5869 4758
5870 -.frm-fields label .frm_icon_font {
5871 - font-size: inherit;
5872 -}
5873 -
5874 4759 .misc-pub-revisions.frm_icon_font,
5875 4760 .misc-pub-revisions.frm_icon_font:hover {
5876 4761 color: inherit;
5877 4762 }
@@ -5939,58 +4824,28 @@
5939 4824 .frm_inactive_icon.frm_action_icon.frm_error_icon:before {
5940 4825 content: '\e606';
5941 4826 }
5942 4827
5943 -.frm-field-action-icons {
5944 - text-align: right;
5945 - position: absolute;
5946 - top: 2px;
5947 - right: 2px;
5948 - max-width: 100%;
5949 -}
5950 -
5951 -.frm-field-action-icons .frm-field-id {
5952 - display: inline-block;
5953 - overflow: hidden;
5954 - text-overflow: ellipsis;
5955 - white-space: nowrap;
5956 - width: 80px;
5957 - max-width: calc( 100% - 50px );
5958 - position: relative;
5959 - top: 2px;
5960 -}
5961 -
5962 -.frm-field-action-icons > a {
5963 - font-size: var(--text-md);
4828 +.frm-field-action-icons a {
4829 + margin-left: 15px;
4830 + float: right;
4831 + font-size: 16px;
5964 4832 width: 17px;
5965 4833 }
5966 4834
5967 -.frm-field-action-icons a:hover {
5968 - text-decoration: none;
5969 -}
5970 -
5971 -.frm-field-action-icons .dropdown {
5972 - display: inline-block;
5973 -}
5974 -
5975 -.frm-field-action-icons > a .frmsvg {
5976 - color: var(--grey-500) !important;
4835 +.frm-field-action-icons a .frmsvg {
4836 + color: var(--primary-hover) !important;
5977 4837 font-size: 17px;
5978 4838 width: 17px;
5979 4839 height: 17px;
5980 4840 }
5981 4841
5982 -.frm-field-action-icons > a .frmsvg,
5983 -.frm-field-action-icons > div > a .frmsvg {
5984 - vertical-align: baseline;
5985 -}
5986 -
5987 4842 .edit_field_type_end_divider .frm-field-action-icons {
5988 4843 display: none !important;
5989 4844 }
5990 4845
5991 4846 .frm-move {
5992 - cursor: grab;
4847 + cursor: move;
5993 4848 }
5994 4849
5995 4850 span.howto {
5996 4851 display: inline;
@@ -6036,15 +4891,11 @@
6036 4891 margin-bottom: 10px;
6037 4892 }
6038 4893
6039 4894 .frm_no_entries_form .frm_no_entries_text {
6040 - line-height: var(--leading);
4895 + line-height: 200%;
6041 4896 }
6042 4897
6043 -#form_entries_page #the-list .no-items {
6044 - height: 240px; /* Equals to the max height of search dropdown */
6045 -}
6046 -
6047 4898 /* Reports Page */
6048 4899 #form_reports_page img.frm_no_reports {
6049 4900 max-width: 100%;
6050 4901 }
@@ -6067,10 +4918,9 @@
6067 4918 }
6068 4919
6069 4920 .frm_wrap .google-visualization-table-tr-head,
6070 4921 .frm_wrap .google-visualization-table-tr-head th {
6071 - white-space: pre-wrap;
6072 - font-size: var(--text-md);
4922 + font-size: 16px;
6073 4923 font-weight: 400 !important;
6074 4924 text-align: left;
6075 4925 }
6076 4926
@@ -6086,8 +4936,12 @@
6086 4936 width: 20%;
6087 4937 min-width: 175px;
6088 4938 }
6089 4939
4940 +#form_reports_page h2 {
4941 + margin-top: 2em !important;
4942 +}
4943 +
6090 4944 /* Views Page */
6091 4945 #form_views_page img.frm_no_views {
6092 4946 max-width: 100%;
6093 4947 }
@@ -6157,12 +5011,8 @@
6157 5011 #frm_form_editor_container .ui-state-default {
6158 5012 color: #333 !important;
6159 5013 }
6160 5014
6161 -.frm_green {
6162 - color: var(--green) !important;
6163 -}
6164 -
6165 5015 #frm_form_editor_container .ui-state-default a.frm_orange, .frm-right-panel a.frm_orange, #postbox-container-1 a.frm_orange {
6166 5016 color: #D54E21;
6167 5017 }
6168 5018
@@ -6197,11 +5047,10 @@
6197 5047 }
6198 5048
6199 5049 #frm-show-fields {
6200 5050 min-height: 350px;
6201 - padding: 0 0 35px;
5051 + padding: 10px 0 35px;
6202 5052 margin: 0;
6203 - position: relative;
6204 5053 }
6205 5054
6206 5055 .frm-has-fields #frm-show-fields {
6207 5056 min-height: 50px;
@@ -6206,69 +5055,8 @@
6206 5055 .frm-has-fields #frm-show-fields {
6207 5056 min-height: 50px;
6208 5057 }
6209 5058
6210 -#frm_builder_page .frm-lite-credit-card-element,
6211 -body.frm-admin-page-styles .frm-lite-credit-card-element {
6212 - position: relative;
6213 -}
6214 -
6215 -#frm_builder_page .frm-lite-credit-card-element > div,
6216 -body.frm-admin-page-styles .frm-lite-credit-card-element > div {
6217 - position: absolute;
6218 - top: calc( 50% - 1px);
6219 - transform: translateY(-50%);
6220 - right: 10px;
6221 - color: #d0d4dd;
6222 -}
6223 -
6224 -#frm_builder_page #frm_field_group_controls {
6225 - position: absolute;
6226 - padding: 5px;
6227 - border-radius: 4px 4px 0 0;
6228 - text-align: right;
6229 - box-sizing: border-box;
6230 - right: 0;
6231 - top: -28px;
6232 - height: 28px;
6233 - z-index: 3; /* section dividers use z-index: 2; position above that to avoid it taking over hover control. */
6234 -}
6235 -
6236 -.frm-field-group-hover-target,
6237 -.frm-has-open-field-group-popup,
6238 -#frm_builder_page #frm_field_group_controls,
6239 -.frm-selected-field-group {
6240 - background: rgba(65, 153, 253, 0.04);
6241 -}
6242 -
6243 -.frm-selected-field-group {
6244 - position: relative;
6245 -}
6246 -
6247 -#frm_builder_page #frm_field_group_controls > span:first-child {
6248 - margin-right: 5px;
6249 -}
6250 -
6251 -#frm_builder_page #frm_field_group_controls svg {
6252 - pointer-events: none;
6253 -}
6254 -
6255 -#frm_field_group_controls {
6256 - visibility: hidden;
6257 -}
6258 -
6259 -.frm-field-group-hover-target #frm_field_group_controls {
6260 - visibility: visible;
6261 -}
6262 -
6263 -#frm_field_group_controls .dropdown-item a span {
6264 - color: var(--grey-700);
6265 -}
6266 -
6267 -#frm_field_group_controls .dropdown-item a:hover {
6268 - text-decoration: none;
6269 -}
6270 -
6271 5059 .frm_sorting .no_repeat_section li.ui-state-default.edit_field_type_end_divider {
6272 5060 display: none !important;
6273 5061 }
6274 5062
@@ -6275,14 +5063,15 @@
6275 5063 .frm-right-panel .ui-state-default,
6276 5064 #postbox-container-1 .ui-state-default,
6277 5065 .frm_sorting > li.ui-state-default,
6278 5066 .frm_sorting .no_repeat_section li.ui-state-default.edit_field_type_end_divider:hover {
6279 - border: 1px solid transparent;
5067 + border: 2px solid transparent;
5068 + border-radius: 4px;
6280 5069 font-weight: normal !important;
6281 5070 background-color: transparent;
6282 5071 background-image: none;
6283 5072 padding: 5px;
6284 - margin: 0;
5073 + margin: 10px 0;
6285 5074 box-shadow: none;
6286 5075 display: block;
6287 5076 text-align: inherit !important;
6288 5077 overflow: visible;
@@ -6301,8 +5090,12 @@
6301 5090 .divider_drop .howto .frm_icon_font {
6302 5091 font-style: normal;
6303 5092 }
6304 5093
5094 +.repeat_section .start_divider li:only-child {
5095 + margin-top: 50px;
5096 +}
5097 +
6305 5098 .show_repeat_sec {
6306 5099 display: none;
6307 5100 }
6308 5101
@@ -6378,16 +5171,15 @@
6378 5171 }
6379 5172
6380 5173 .frm-page-collapsed .frm_clone_icon,
6381 5174 .frm-page-collapsed .frm_delete_field,
6382 -.frm-page-collapsed .frm_clone_field,
6383 -.frm-section-collapsed .frm_clone_icon {
5175 +.frm-section-collapsed .frm_clone_icon,
5176 +.frm-section-collapsed .frm_delete_field {
6384 5177 opacity: .5;
6385 5178 cursor: not-allowed;
6386 5179 }
6387 5180
6388 -/* Hide the Duplicate summary option because we are missing the logic that also adds a new page */
6389 -.edit_field_type_summary .frm_more_options_li:nth-child(2) {
5181 +.edit_field_type_summary .frm_clone_field {
6390 5182 display: none !important;
6391 5183 }
6392 5184
6393 5185 .frm_no_section_fields:not(.frm_block) + ul.start_divider {
@@ -6419,9 +5211,9 @@
6419 5211 content: '';
6420 5212 display: block;
6421 5213 padding: 2px 0;
6422 5214 line-height: 1px;
6423 - border-top: 2px solid var(--grey-300);
5215 + border-top: 2px solid var(--grey-border);
6424 5216 top: -2px;
6425 5217 position: absolute;
6426 5218 width: 100%;
6427 5219 transition: .5s border-color ease-in-out;
@@ -6433,9 +5225,8 @@
6433 5225 }
6434 5226
6435 5227 .frm-section-collapsed .divider_section_only:hover:after,
6436 5228 li.selected.frm-section-collapsed .divider_section_only:before,
6437 -li.selected.frm-section-collapsed .divider_section_only:after,
6438 5229 .divider_section_only:hover:before,
6439 5230 li.selected .divider_section_only:before {
6440 5231 border-color: transparent;
6441 5232 }
@@ -6443,10 +5234,10 @@
6443 5234 .frm_sorting li.ui-state-default.edit_field_type_divider {
6444 5235 overflow: visible;
6445 5236 position: relative;
6446 5237 padding: 0 0 0 20px;
6447 - margin: 25px 0 0 -5px;
6448 - border-left: 1px solid var(--primary-700);
5238 + margin: 25px 0 0 -20px;
5239 + border-left: 1px solid var(--primary-hover);
6449 5240 transition: border 0.7s ease-out;
6450 5241 }
6451 5242
6452 5243 .frm-section-collapsed {
@@ -6454,9 +5245,9 @@
6454 5245 }
6455 5246
6456 5247 .frm_sorting li.edit_field_type_end_divider,
6457 5248 .frm_sorting .no_repeat_section li.ui-state-default.edit_field_type_end_divider:hover {
6458 - margin: 0 0 var(--gap-sm);
5249 + margin: 0 0 15px;
6459 5250 }
6460 5251
6461 5252 .frm-first-page .frm_prev_page {
6462 5253 display: none;
@@ -6461,19 +5252,22 @@
6461 5252 .frm-first-page .frm_prev_page {
6462 5253 display: none;
6463 5254 }
6464 5255
6465 -#frm_builder_page .frm_remove_form_row.frm_button,
6466 -#frm_builder_page .frm_add_form_row.frm_button {
5256 +#frm-form-button button,
5257 +.frm_remove_form_row.frm_button,
5258 +.frm_add_form_row.frm_button,
5259 +.frm-white-body .frm-preview-buttons button {
6467 5260 border-radius: var(--small-radius);
6468 5261 border: 1px solid var(--blue-border);
5262 + color: var(--primary-color);
6469 5263 }
6470 5264
6471 -#frm_builder_page .frm_remove_form_row .frmsvg,
6472 -#frm_builder_page .frm_remove_form_row i:before,
6473 -#frm_builder_page .frm_add_form_row .frmsvg,
6474 -#frm_builder_page .frm_add_form_row i:before {
6475 - color: var(--primary-700);
5265 +.frm_wrap .frm_remove_form_row .frmsvg,
5266 +.frm_remove_form_row i:before,
5267 +.frm_wrap .frm_add_form_row .frmsvg,
5268 +.frm_add_form_row i:before {
5269 + color: var(--primary-hover);
6476 5270 }
6477 5271
6478 5272 .frm-preview-buttons .frm_button_submit {
6479 5273 margin: 0 5px;
@@ -6479,10 +5273,10 @@
6479 5273 margin: 0 5px;
6480 5274 }
6481 5275
6482 5276 .frm-page-break {
6483 - border-top: 1px dashed var(--primary-700);
6484 - margin-top: var(--gap-lg);
5277 + border-top: 1px dashed var(--primary-hover);
5278 + margin-top: 30px;
6485 5279 position: relative;
6486 5280 }
6487 5281
6488 5282 .edit_field_type_divider:before,
@@ -6495,9 +5289,9 @@
6495 5289 width: 4px;
6496 5290 height: 4px;
6497 5291 background-color: #fff;
6498 5292 border-radius: 50%;
6499 - border: 1px solid var(--primary-700);
5293 + border: 1px solid var(--primary-hover);
6500 5294 text-rendering: auto;
6501 5295 -webkit-font-smoothing: antialiased;
6502 5296 }
6503 5297
@@ -6519,12 +5313,13 @@
6519 5313 width: 20px;
6520 5314 height: 20px;
6521 5315 left: -11px;
6522 5316 top: 0;
6523 - background: var(--primary-700);
5317 + background: var(--primary-hover);
6524 5318 text-align: center;
6525 5319 color: #fff;
6526 5320 font-size: 13px;
5321 + line-height: 22px;
6527 5322 }
6528 5323
6529 5324 .edit_field_type_divider:before{
6530 5325 font-family: 's11-fp';
@@ -6545,20 +5340,20 @@
6545 5340
6546 5341
6547 5342 .frm_sorting li.edit_field_type_divider:hover,
6548 5343 .frm_sorting li.edit_field_type_divider.selected {
6549 - border-left-color: var(--primary-500);
5344 + border-left-color: var(--primary-color);
6550 5345 }
6551 5346
6552 5347 .edit_field_type_divider.selected:before,
6553 5348 .edit_field_type_divider:hover:before {
6554 - border-color: var(--primary-500);
6555 - background: var(--primary-500);
5349 + border-color: var(--primary-color);
5350 + background: var(--primary-color);
6556 5351 }
6557 5352
6558 5353 .edit_field_type_divider.selected:after,
6559 5354 .edit_field_type_divider:hover:after {
6560 - border-color: var(--primary-500);
5355 + border-color: var(--primary-color);
6561 5356 }
6562 5357
6563 5358 .frm-section-collapsed:after {
6564 5359 border-color: transparent !important;
@@ -6566,11 +5361,19 @@
6566 5361 }
6567 5362
6568 5363 .frm-page-break .frm-collapse-page.button {
6569 5364 margin-left: 46%;
6570 - margin-top: calc( -28px / 2 );
5365 + margin-top: -15px;
5366 + background-color: #fff;
5367 + border-color: var(--primary-hover) !important;
5368 + color: var(--primary-hover);
6571 5369 }
6572 5370
5371 +#frm-fake-page .frm-collapse-page.button {
5372 + border-color: var(--grey) !important;
5373 + color: var(--grey);
5374 +}
5375 +
6573 5376 #frm-fake-page.frm-page-collapsed {
6574 5377 margin-bottom: 0;
6575 5378 }
6576 5379
@@ -6576,15 +5379,15 @@
6576 5379
6577 5380 .frm-page-collapsed {
6578 5381 position: relative;
6579 5382 overflow: visible !important;
6580 - margin-bottom: var(--gap-lg);
5383 + margin-bottom: 30px;
6581 5384 }
6582 5385
6583 5386 .frm-page-collapsed:after {
6584 5387 content: '';
6585 5388 display: block;
6586 - border: 1px dashed var(--grey-300);
5389 + border: 1px dashed var(--grey-border);
6587 5390 border-left: none;
6588 5391 border-right: none;
6589 5392 height: 6px;
6590 5393 position: absolute;
@@ -6591,40 +5394,31 @@
6591 5394 width: calc( 100% - 10px );
6592 5395 bottom: -15px;
6593 5396 }
6594 5397
6595 -.frm-collapse-page .frmsvg,
6596 5398 .frm-collapse-page .frm_arrowdown6_icon {
6597 - width: var(--text-sm);
6598 - height: var(--text-sm);
6599 - font-size: var(--text-sm);
5399 + width: 16px;
6600 5400 text-align: center;
6601 5401 margin-left: 2px;
6602 - color: currentColor;
5402 + color: var(--primary-hover);
6603 5403 }
6604 5404
6605 5405 #frm-fake-page .frm_arrowdown6_icon {
6606 - color: currentColor;
5406 + color: var(--grey);
6607 5407 }
6608 5408
5409 +#frm-fake-page .frm-collapse-page:hover,
5410 +#frm-fake-page .frm-collapse-page:hover .frm_arrowdown6_icon,
5411 +.frm-collapse-page:hover .frm_arrowdown6_icon {
5412 + color: #fff;
5413 +}
5414 +
6609 5415 .frm-collapsed i:before,
5416 +.frm-section-collapsed .frm_arrowdown6_icon:before,
6610 5417 .frm-page-collapsed .frm_arrowdown6_icon:before {
6611 5418 content: '\e913';
6612 5419 }
6613 5420
6614 -.frm-collapse-section svg {
6615 - fill: var(--primary-color);
6616 - transition: transform 0.2s ease-out, fill 0.2s ease-out;
6617 -}
6618 -
6619 -.frm-collapse-section:hover svg {
6620 - fill: var(--primary-700);
6621 -}
6622 -
6623 -.frm-section-collapsed .frm-collapse-section svg {
6624 - transform: rotate(-90deg);
6625 -}
6626 -
6627 5421 .open .widget-top .frm_arrow_right_icon:before {
6628 5422 content: '\e62a';
6629 5423 }
6630 5424
@@ -6666,14 +5460,14 @@
6666 5460 .frm_no_section_fields {
6667 5461 text-align: center;
6668 5462 position: absolute;
6669 5463 color: var(--medium-grey);
6670 - font-size: var(--text-md);
5464 + font-size: 16px;
6671 5465 box-sizing: border-box;
6672 - border: 1px dashed var(--grey-300);
5466 + border: 2px dashed var(--primary-color);
6673 5467 }
6674 5468
6675 -.ui-droppable-active ~ .frm_no_fields {
5469 +.drop-me + .frm_no_fields {
6676 5470 border-style: solid;
6677 5471 }
6678 5472
6679 5473 .frm_no_section_fields {
@@ -6681,8 +5475,9 @@
6681 5475 margin: 0;
6682 5476 padding: 20px 0 0;
6683 5477 width: calc( 100% - 20px );
6684 5478 height: 121px;
5479 + border-color: var(--grey-border);
6685 5480 transition: all 0.4s linear;
6686 5481 }
6687 5482
6688 5483 .frm_no_fields {
@@ -6705,9 +5500,9 @@
6705 5500 display: block;
6706 5501 }
6707 5502
6708 5503 .frm-large-plus.frmsvg {
6709 - color: var(--primary-700);
5504 + color: var(--primary-hover);
6710 5505 height: 45px;
6711 5506 width: 45px;
6712 5507 }
6713 5508
@@ -6737,9 +5532,9 @@
6737 5532 width: 60%;
6738 5533 float: left;
6739 5534 }
6740 5535
6741 -#new_fields .frm_product_price_wrapper input:nth-child(2) {
5536 +#new_fields .frm_product_price_wrapper input:last-child {
6742 5537 width: 37%;
6743 5538 float: right;
6744 5539 }
6745 5540
@@ -6827,12 +5622,10 @@
6827 5622
6828 5623 .frm-category-tabs > li a,
6829 5624 .frm-category-tabs > li a:active {
6830 5625 outline: none;
5626 + -webkit-box-shadow: none;
6831 5627 box-shadow: none;
6832 - display: flex;
6833 - gap: var(--gap-xs);
6834 - align-items: center;
6835 5628 }
6836 5629
6837 5630 .frm-category-tabs > li.active .frmsvg,
6838 5631 .frm-category-tabs > li.active i,
@@ -6837,15 +5630,15 @@
6837 5630 .frm-category-tabs > li.active .frmsvg,
6838 5631 .frm-category-tabs > li.active i,
6839 5632 .frm-category-tabs > li.active span,
6840 5633 .frm-category-tabs > li.active a {
6841 - color: var(--primary-500);
5634 + color: var(--primary-color);
6842 5635 }
6843 5636
6844 5637 .frm_wrap .manage-menus {
6845 5638 margin-top: 0;
6846 5639 border: none;
6847 - border-bottom: 1px solid var(--grey-300);
5640 + border-bottom: 1px solid var(--grey-border);
6848 5641 background: var(--lightest-grey);
6849 5642 }
6850 5643
6851 5644 .general_settings .postbox .manage-menus {
@@ -6881,9 +5674,9 @@
6881 5674 padding-top: 10px;
6882 5675 }
6883 5676
6884 5677 .frm-right-panel .ui-state-default, #postbox-container-1 .ui-state-default {
6885 - color: var(--grey-900);
5678 + color: var(--darkest-grey);
6886 5679 }
6887 5680
6888 5681 .no_repeat_section .frm_sorting > li.ui-state-default.edit_field_type_end_divider:hover {
6889 5682 box-shadow: none;
@@ -6888,9 +5681,8 @@
6888 5681 .no_repeat_section .frm_sorting > li.ui-state-default.edit_field_type_end_divider:hover {
6889 5682 box-shadow: none;
6890 5683 }
6891 5684
6892 -.frm-selected-field-group li.ui-state-default,
6893 5685 .start_divider.frm_sorting li.ui-state-default.frm_not_divider.selected,
6894 5686 .start_divider.frm_sorting li.ui-state-default.frm_not_divider:hover,
6895 5687 .frm_sorting li.ui-state-default.frm_not_divider:hover,
6896 5688 .frm_sorting li.ui-state-default.ui-sortable-helper,
@@ -6899,14 +5691,14 @@
6899 5691 .frm_sorting li.ui-state-default.selected.edit_field_type_divider .divider_section_only,
6900 5692 .frm_update_msg,
6901 5693 .frm_sorting li.ui-state-default.frm_not_divider.selected,
6902 5694 .frm_sorting li.ui-state-default.selected.edit_field_type_divider .divider_section_only {
6903 - border-color: var(--primary-500);
5695 + border-color: var(--primary-color);
6904 5696 transition: .5s border-color ease-in-out;
6905 5697 }
6906 5698
6907 5699 .frm_sorting li.ui-state-default.frm_not_divider.selected {
6908 - box-shadow: 0 0 1px 0 var(--primary-500);
5700 + box-shadow: 0 0 1px 0 var(--primary-color);
6909 5701 }
6910 5702
6911 5703 .frm_sorting li.ui-state-default {
6912 5704 transition: .7s box-shadow ease-in-out, .7s height linear;
@@ -6929,9 +5721,9 @@
6929 5721 font-weight: bold;
6930 5722 border: 1px solid #DFDFDF;
6931 5723 background-color: #EEEEEE;
6932 5724 padding: 3px 5px 2px;
6933 - font-size: var(--text-md);
5725 + font-size: 16px;
6934 5726 line-height: 20px;
6935 5727 }
6936 5728
6937 5729 .frm_update_msg {
@@ -6969,13 +5761,8 @@
6969 5761 .widefat .column-shortcode {
6970 5762 width: 9em;
6971 5763 }
6972 5764
6973 -.toplevel_page_formidable .column-shortcode div {
6974 - display: flex;
6975 - gap: var(--gap-xs);
6976 -}
6977 -
6978 5765 .widefat .column-entries, .widefat .column-link {
6979 5766 width: 10%;
6980 5767 text-align: center;
6981 5768 }
@@ -6983,22 +5770,23 @@
6983 5770 .widefat .column-form_key, .widefat .column-created_at {
6984 5771 width: 10%;
6985 5772 }
6986 5773
6987 -.frm-white-body .search-box,
5774 +.post-type-frm_display .search-box,
6988 5775 .frm_wrap .frm-search {
6989 5776 float: right;
6990 - margin: 0;
5777 + margin-bottom: 15px;
6991 5778 clear: right;
6992 5779 }
6993 5780
6994 -.frm-white-body .search-box,
5781 +#form_entries_page form .frm-search {
5782 + margin-top: 15px;
5783 +}
5784 +
6995 5785 .frm-search {
6996 - min-width: 32%;
5786 + width: 32%;
5787 + float: right;
6997 5788 position: relative;
6998 - display: flex;
6999 - gap: var(--gap-sm);
7000 - align-items: center;
7001 5789 }
7002 5790
7003 5791 .frm-inline-modal .frm-search,
7004 5792 #frm_adv_info .frm-search {
@@ -7004,9 +5792,9 @@
7004 5792 #frm_adv_info .frm-search {
7005 5793 float: none;
7006 5794 width: 100%;
7007 5795 clear: both;
7008 - margin: var(--gap-xs) 0;
5796 + margin: 5px 0 10px;
7009 5797 }
7010 5798
7011 5799 .frm-button-group a {
7012 5800 margin: 0 7px !important;
@@ -7023,9 +5811,9 @@
7023 5811
7024 5812 i.frm-show-box,
7025 5813 i.frm-show-inline-modal,
7026 5814 .frm-with-left-icon i,
7027 -.frm-with-right-icon i:not([class*=mce-]),
5815 +.frm-with-right-icon i,
7028 5816 .frmsvg.frm-show-box,
7029 5817 .frmsvg.frm-show-inline-modal,
7030 5818 .frm-with-left-icon .frmsvg,
7031 5819 .frm-with-right-icon .frmsvg,
@@ -7031,17 +5819,18 @@
7031 5819 .frm-with-right-icon .frmsvg,
7032 5820 .frm-search > .frmsvg,
7033 5821 .frm-search span:not(.multiselect-selected-text):not(.multiselect-native-select) {
7034 5822 position: absolute;
7035 - padding: 0 14px;
5823 + padding: 7px 10px;
7036 5824 pointer-events: none;
7037 5825 left: 0;
7038 - color: var(--grey-400);
7039 - font-size: var(--text-xs);
5826 + color: var(--grey);
5827 + opacity: .5;
5828 + font-size: 18px;
7040 5829 }
7041 5830
7042 5831 .frm-with-right-icon .frmsvg,
7043 -.frm-with-right-icon i:not([class*=mce-]) {
5832 +.frm-with-right-icon i {
7044 5833 right: 0;
7045 5834 top: -3px;
7046 5835 left: auto;
7047 5836 padding: 0 10px 0 5px;
@@ -7046,35 +5835,20 @@
7046 5835 left: auto;
7047 5836 padding: 0 10px 0 5px;
7048 5837 }
7049 5838
7050 -.frm_form_settings .frm-with-right-icon .frmsvg {
7051 - top: 0;
7052 -}
7053 -
7054 -.frm_form_settings .wp-editor-container .frm-with-right-icon .frmsvg {
7055 - top: auto;
7056 - bottom: 0;
7057 -}
7058 -
7059 -.frm_form_settings .frm_has_textarea .frm-with-right-icon .frmsvg {
7060 - top: auto;
7061 - bottom: 6px;
7062 -}
7063 -
7064 5839 .frmsvg.frm-show-box,
7065 5840 .frmsvg.frm-show-inline-modal,
7066 5841 i.frm-show-box,
7067 5842 i.frm-show-inline-modal {
7068 - color: var(--primary-500);
5843 + color: var(--primary-color);
7069 5844 pointer-events: initial;
7070 5845 cursor: pointer;
7071 5846 z-index: 1;
7072 5847 opacity: 1;
5848 + right: 2px;
7073 5849 top: auto;
7074 - margin: calc( ( 36px - 18px ) / 2 ); /* input height - svg / 2 */
7075 - margin-bottom: 0;
7076 - padding: 0;
5850 + padding: 7px 10px;
7077 5851 }
7078 5852
7079 5853 .frm-open .frmsvg.frm-show-inline-modal,
7080 5854 .frm-open i.frm-show-inline-modal {
@@ -7097,9 +5871,9 @@
7097 5871
7098 5872 .frm_wrap .frm-with-right-icon textarea,
7099 5873 .frm_wrap .frm-with-right-icon input,
7100 5874 .frm_wrap .frm-with-right-icon input[type=text] {
7101 - padding-right: var(--gap-md);
5875 + padding-right: 35px;
7102 5876 }
7103 5877
7104 5878 #frm-show-fields .frm-with-left-icon .frmsvg,
7105 5879 #frm-show-fields .frm-with-left-icon i {
@@ -7105,29 +5879,43 @@
7105 5879 #frm-show-fields .frm-with-left-icon i {
7106 5880 padding-top: 10px;
7107 5881 }
7108 5882
5883 +.frm-search input.frm-search-input,
7109 5884 .frm-search input[name="s"],
5885 +.frm-search #search-submit {
5886 + border-color: var(--grey-border);
5887 + box-shadow: none;
5888 + margin: 0;
5889 + padding: 7px;
5890 + height: auto;
5891 + font-size: 13px;
5892 + line-height: normal;
5893 +}
5894 +
7110 5895 .frm-search .dropdown-toggle,
7111 5896 .frm-search input.frm-search-input {
7112 - border-radius: var(--small-radius);
5897 + border-radius: var(--border-radius);
7113 5898 padding-left: 33px !important;
7114 - border-color: var(--grey-300);
7115 5899 }
7116 5900
7117 -.frm_wrap .frm-search .frm-search-input,
7118 -.frm-modal .frm-search .frm-search-input,
7119 -.frm-white-body .search-box input[name="s"], /* Views search */
7120 -.frm_wrap .frm-search input[name="s"] {
7121 - padding-top: 3px;
7122 - padding-bottom: 3px;
7123 - flex: 1;
7124 - font-size: var(--text-sm);
5901 +.frm-search input[name="s"] {
5902 + width: 70%;
5903 + float: left;
5904 + border-radius: var(--border-radius) 0 0 var(--border-radius) !important;
5905 + border-right-width: 0;
5906 + padding-left: 33px;
7125 5907 }
7126 5908
7127 -.frm-search .dropdown-toggle {
5909 +.frm-search .dropdown-toggle,
5910 +.frm-search input.frm-auto-search {
7128 5911 width: 100%;
5912 + border-right-width: 1px;
5913 + border-radius: var(--border-radius) !important;
7129 5914 float: none;
5915 +}
5916 +
5917 +.frm-search .dropdown-toggle {
7130 5918 max-width: 200px;
7131 5919 background: transparent;
7132 5920 padding: 7px;
7133 5921 min-height: 32px;
@@ -7135,18 +5923,22 @@
7135 5923 overflow: hidden;
7136 5924 text-overflow: ellipsis;
7137 5925 }
7138 5926
7139 -span.multiselect-selected-text {
5927 +.frm-search span.multiselect-selected-text {
7140 5928 white-space: nowrap;
7141 - display: inline-block;
7142 - max-width: 90%;
7143 - text-overflow: ellipsis;
7144 - overflow: hidden;
5929 + display: inline-block;
7145 5930 }
7146 5931
5932 +.frm-search #search-submit {
5933 + width: 30%;
5934 + border-radius: 0 var(--border-radius) var(--border-radius) 0;
5935 + text-align: center;
5936 + background-color: var(--lightest-grey);
5937 +}
5938 +
7147 5939 .frm-search #search-submit a {
7148 - color: var(--grey-800);
5940 + color: var(--primary-color);
7149 5941 }
7150 5942
7151 5943 .frm-search #search-submit .caret {
7152 5944 opacity:.7;
@@ -7152,15 +5944,15 @@
7152 5944 opacity:.7;
7153 5945 }
7154 5946
7155 5947 .frm-not-set input {
7156 - color: var(--primary-500) !important;
5948 + color: var(--primary-color) !important;
7157 5949 font-size: 13px;
7158 5950 }
7159 5951
7160 5952 .frm-not-set .frmsvg,
7161 5953 .frm-not-set i {
7162 - color: var(--primary-700);
5954 + color: var(--primary-hover);
7163 5955 opacity: 1;
7164 5956 }
7165 5957
7166 5958 .post-type-frm_display select[name="m"] + #post-query-submit,
@@ -7186,9 +5978,9 @@
7186 5978 }
7187 5979
7188 5980 .frm-grid {
7189 5981 border-collapse: collapse;
7190 - border: none;
5982 + border: 1px solid black;
7191 5983 margin-right: 10px;
7192 5984 }
7193 5985
7194 5986 .frm-grid td, .frm-grid th {
@@ -7228,9 +6020,9 @@
7228 6020
7229 6021 .post-type-frm_display #advanced-sortables h2.hndle,
7230 6022 .post-type-frm_display #side-sortables h2.hndle,
7231 6023 .post-type-frm_display #normal-sortables h2.hndle {
7232 - border-bottom: 1px solid var(--grey-300);
6024 + border-bottom: 1px solid var(--grey-border);
7233 6025 margin: 10px 0 0 !important;
7234 6026 padding: 0 25px 8px;
7235 6027 }
7236 6028
@@ -7239,9 +6031,9 @@
7239 6031 padding-top: 10px;
7240 6032 }
7241 6033
7242 6034 .post-type-frm_display #post-body-content {
7243 - margin-top: var(--gap-lg);
6035 + margin-top: 30px;
7244 6036 }
7245 6037
7246 6038 .post-type-frm_display.edit-php #wpbody-content > .wrap {
7247 6039 margin: 0;
@@ -7248,15 +6040,15 @@
7248 6040 }
7249 6041
7250 6042 .post-type-frm_display .postbox .hndle,
7251 6043 .post-type-frm_display .postbox {
7252 - border-color: var(--grey-300);
6044 + border-color: var(--grey-border);
7253 6045 }
7254 6046
7255 6047 .post-type-frm_display #postbox-container-1 .postbox,
7256 6048 .post-type-frm_display #postbox-container-2 .postbox {
7257 6049 border-radius: var(--small-radius);
7258 - border-color: var(--grey-300);
6050 + border-color: var(--grey-border);
7259 6051 box-shadow: none;
7260 6052 }
7261 6053
7262 6054 .post-type-frm_display #side-sortables .postbox {
@@ -7335,9 +6127,9 @@
7335 6127 background-color: transparent;
7336 6128 }
7337 6129
7338 6130 .post-type-frm_display #major-publishing-actions {
7339 - border-color: var(--grey-300);
6131 + border-color: var(--grey-border);
7340 6132 background: var(--sidebar-color);
7341 6133 }
7342 6134
7343 6135 .post-type-frm_display #frm_adv_info {
@@ -7391,9 +6183,9 @@
7391 6183 .settings-lite-cta ul,
7392 6184 .settings-lite-cta p,
7393 6185 .settings-lite-cta {
7394 6186 color: #666;
7395 - font-size: var(--text-md);
6187 + font-size: 16px;
7396 6188 box-shadow: none !important;
7397 6189 }
7398 6190
7399 6191 .frm-info-modal h3,
@@ -7407,9 +6199,8 @@
7407 6199
7408 6200 .frm-info-modal .postbox .inside,
7409 6201 .settings-lite-cta .postbox .inside {
7410 6202 padding: 20px 40px;
7411 - margin: 0;
7412 6203 }
7413 6204
7414 6205 .cta-inside a {
7415 6206 color: var(--orange)
@@ -7415,15 +6206,25 @@
7415 6206 color: var(--orange)
7416 6207 }
7417 6208
7418 6209 .info-modal-inside a.frm-standard-link {
7419 - color: var(--primary-500);
6210 + color: var(--primary-color);
7420 6211 }
7421 6212
7422 6213 .info-modal-inside a.frm-standard-link:hover {
7423 - color: var(--primary-700);
6214 + color: var(--primary-hover);
7424 6215 }
7425 6216
6217 +.frm-caution {
6218 + text-transform: uppercase;
6219 + font-weight: bold;
6220 + color: var(--dark-grey);
6221 +}
6222 +
6223 +.field_type_list > li {
6224 + width: 50%;
6225 +}
6226 +
7426 6227 .frm_no_p_margin > p {
7427 6228 margin: 0;
7428 6229 }
7429 6230
@@ -7433,12 +6234,14 @@
7433 6234 font-size: 11px;
7434 6235 overflow: hidden;
7435 6236 }
7436 6237
6238 +.frm_code_list.frm-full-hover {
6239 + margin: 0 -20px;
6240 +}
6241 +
7437 6242 #frm-navbarDrop + .frm_code_list.frm-full-hover {
7438 - margin: var(--gap-xs) 0 0;
7439 - min-width: 300px;
7440 - max-height: calc( ( 40px * 5 ) + 56px );
6243 + margin: 4px 0 0;
7441 6244 }
7442 6245
7443 6246 .frm_code_list.frm-full-hover li {
7444 6247 margin: 0;
@@ -7443,28 +6246,23 @@
7443 6246 .frm_code_list.frm-full-hover li {
7444 6247 margin: 0;
7445 6248 }
7446 6249
7447 -.frm-select-list-item,
7448 -.frm_wrap .ui-autocomplete li > div,
7449 -.multiselect-container button.multiselect-option,
7450 -.frm-dropdown-menu > .dropdown-item > a,
7451 -.frm-dropdown-menu > .dropdown-item > a:visited,
7452 -.frm-dropdown-menu > .dropdown-item > a:link, /* Override jQuery UI */
6250 +.frm-dropdown-menu > li > a,
7453 6251 .frm-dropdown-menu .frm_dropdown_li,
7454 6252 .frm_code_list.frm-full-hover a {
7455 - display: flex;
7456 - color: var(--grey-700);
7457 - padding: 5px 10px;
7458 - font-size: var(--text-md);
7459 - gap: var(--gap-xs);
7460 - align-items: center;
6253 + display: block;
6254 + color: var(--dark-grey);
6255 + padding: 3px 25px;
6256 + font-size: 15px;
7461 6257 }
7462 6258
7463 6259 .frm_code_list.frm-full-hover a span {
6260 + color: var(--grey);
6261 + float: right;
6262 + font-size: 14px;
7464 6263 max-width: 83px;
7465 6264 text-align: right;
7466 - margin-left: auto;
7467 6265 }
7468 6266
7469 6267 .frm_code_list.frm-full-hover a,
7470 6268 .frm_code_list.frm-full-hover a span {
@@ -7472,54 +6270,24 @@
7472 6270 overflow: hidden;
7473 6271 text-overflow: ellipsis;
7474 6272 }
7475 6273
7476 -.frm_code_list.frm-full-hover.frmcenter a {
7477 - display: block;
7478 -}
7479 -
7480 -#frm-layout-classes frm-full-hover a span {
7481 - max-width: 45%;
7482 -}
7483 -
7484 -.frm-select-list-item.active,
7485 -.frm-select-list-item:hover,
7486 -.frm_wrap .ui-autocomplete li div.ui-state-active,
7487 -.frm_wrap .ui-autocomplete li.ui-state-focus,
7488 -.multiselect-container button.multiselect-option.active,
7489 -.multiselect-container button.multiselect-option:hover,
7490 -.frm-dropdown-menu > .dropdown-item > a:hover,
6274 +.frm-dropdown-menu > li > a:hover,
7491 6275 .frm_code_list.frm-full-hover a:hover span,
7492 6276 .frm_code_list.frm-full-hover a:hover {
7493 - background: var(--primary-25);
7494 - color: var(--primary-500);
7495 - border-radius: var(--small-radius);
6277 + background: var(--sidebar-color);
6278 + color: var(--primary-color);
7496 6279 }
7497 6280
7498 -.frm-select-list-item .frmsvg,
7499 -.frm-dropdown-menu > .dropdown-item > a .frmsvg {
7500 - opacity: .8;
7501 -}
7502 -
7503 -.frm-select-list-item:hover .frmsvg,
7504 -.frm-dropdown-menu > .dropdown-item > a:hover .frmsvg {
7505 - opacity: 1;
7506 -}
7507 -
7508 6281 .frm-dropdown-menu.frm_code_list > li > a {
7509 6282 padding: 3px 15px;
7510 6283 width: 300px;
7511 6284 }
7512 6285
7513 -#frm_edit_box_content_modal .frm-with-search, /* Temp. Add .frm-dropdown-menu in Views */
7514 -.frm-dropdown-menu .frm-with-search {
7515 - padding: var(--gap-xs) 10px 0;
6286 +.frm-dropdown-menu.frm_code_list .frm-with-search {
6287 + padding: 3px 10px;
7516 6288 }
7517 6289
7518 -.frm-dropdown-menu .subsubsub {
7519 - padding: 0 10px;
7520 -}
7521 -
7522 6290 .frm_grid_container {
7523 6291 overflow: visible;
7524 6292 }
7525 6293
@@ -7535,16 +6303,16 @@
7535 6303 .frm_code_list.frm_grid_container a {
7536 6304 padding: 5px 0;
7537 6305 text-align: center;
7538 6306 background-color: var(--light-blue);
7539 - border: 1px solid var(--primary-500);
7540 - color: var(--primary-500);
6307 + border: 1px solid var(--primary-color);
6308 + color: var(--primary-color);
7541 6309 display: block;
7542 6310 border-radius: var(--small-radius);
7543 6311 }
7544 6312
7545 6313 .frm_code_list.frm_grid_container a:hover {
7546 - background-color: var(--primary-700);
6314 + background-color: var(--primary-hover);
7547 6315 color: #fff;
7548 6316 }
7549 6317
7550 6318 .frm_field_list #frm-insert-fields .button a {
@@ -7552,22 +6320,18 @@
7552 6320 max-width: 95%;
7553 6321 overflow: hidden;
7554 6322 }
7555 6323
7556 -.field_type_list.frm_grid_container {
7557 - gap: var(--gap-xs) var(--gap-sm);
7558 - margin: var(--gap-xs);
7559 -}
7560 -
7561 6324 .field_type_list li {
7562 - margin: 0;
6325 + margin: 0 0 10px;
7563 6326 padding: 0;
6327 + clear: both;
6328 + float: left;
7564 6329 }
7565 6330
7566 -#frm-insert-fields .frm-search {
7567 - float: none;
7568 - margin: 15px 20px;
7569 - width: auto;
6331 +.field_type_list li:nth-child(2n) {
6332 + float: right;
6333 + clear: none;
7570 6334 }
7571 6335
7572 6336 #frm-insert-fields li,
7573 6337 #frm-insert-fields li a {
@@ -7572,13 +6336,22 @@
7572 6336 #frm-insert-fields li,
7573 6337 #frm-insert-fields li a {
7574 6338 text-decoration: none;
7575 6339 font-weight: normal;
7576 - font-size: var(--text-md) !important;
7577 - color: var(--grey-900);
6340 + font-size: 15px !important;
6341 + color: var(--dark-grey);
7578 6342 }
7579 6343
6344 +#frm-insert-fields li a {
6345 + padding: 5px 20px;
6346 + display: block;
6347 + border-radius: 0 var(--border-radius) var(--border-radius) 0;
6348 +}
6349 +
7580 6350 #frm-insert-fields li.frm_show_upgrade {
6351 + margin: 0 0 10px;
6352 + padding: 5px 20px;
6353 + box-sizing: border-box;
7581 6354 cursor: pointer;
7582 6355 opacity: .5;
7583 6356 }
7584 6357
@@ -7585,11 +6358,14 @@
7585 6358 #frm-insert-fields li a span {
7586 6359 vertical-align: middle;
7587 6360 }
7588 6361
7589 -.frmbutton.ui-draggable-dragging a,
6362 +#frm-insert-fields li:nth-child(2n) a {
6363 + border-radius: var(--border-radius) 0 0 var(--border-radius);
6364 +}
6365 +
7590 6366 #frm-insert-fields li a:not(.disabled):hover {
7591 - background: var(--grey-100);
6367 + background: var(--sidebar-hover);
7592 6368 }
7593 6369
7594 6370 #frm-insert-fields li a.disabled:hover {
7595 6371 cursor: not-allowed;
@@ -7611,9 +6387,9 @@
7611 6387 .frmsvg {
7612 6388 fill: currentColor;
7613 6389 width: 18px;
7614 6390 height: 18px;
7615 - vertical-align: middle;
6391 + vertical-align: text-bottom;
7616 6392 }
7617 6393
7618 6394 input[disabled],
7619 6395 .frmsvg svg {
@@ -7639,25 +6415,31 @@
7639 6415 width: 13px;
7640 6416 height: 13px;
7641 6417 }
7642 6418
6419 +.frm_code_list a .frmsvg,
7643 6420 .frmbutton.ui-sortable-helper .frmsvg,
7644 6421 .field_type_list li.frmbutton .frmsvg,
6422 +.frm_code_list a i,
7645 6423 .frmbutton.ui-sortable-helper i,
7646 -.field_type_list li.frmbutton i,
7647 -.frm_code_list a .frmsvg,
7648 -.frm_code_list a i {
7649 - color: var(--grey-500);
6424 +.field_type_list li.frmbutton i {
6425 + margin: .15em .2em;
6426 + color: var(--grey);
7650 6427 display: inline-block;
7651 6428 vertical-align: middle;
7652 - width: var(--text-md);
7653 - font-size: var(--text-md);
6429 + width: 20px;
6430 + height: 20px;
6431 + padding-right: 15px;
6432 + text-align: left;
6433 + font-size: 18px;
7654 6434 }
7655 6435
7656 -/* Standardize icon size for field buttons in the builder */
7657 -.field_type_list li.frmbutton .frmsvg {
7658 - width: var(--text-xl);
7659 - font-size: var(--text-xl);
6436 +.frm_code_list a .frmsvg,
6437 +.frm_code_list a i {
6438 + margin: 0 5px 0 0;
6439 + padding: 0;
6440 + width: 15px;
6441 + font-size: 15px;
7660 6442 }
7661 6443
7662 6444 .frm_code_list i:before {
7663 6445 font-size: inherit;
@@ -7664,58 +6446,55 @@
7664 6446 }
7665 6447
7666 6448 #frm-insert-fields li a:not(.disabled):hover .frmsvg,
7667 6449 #frm-insert-fields li a:not(.disabled):hover i {
7668 - color: var(--grey-600);
6450 + color: var(--dark-grey);
7669 6451 }
7670 6452
7671 6453 /* Icon while dragging */
7672 -.frmbutton.ui-draggable-dragging {
7673 - pointer-events: none;
6454 +.frmbutton.ui-draggable-dragging,
6455 +.frmbutton.ui-draggable-dragging a {
6456 + cursor: move;
7674 6457 }
7675 6458
7676 -#frm-insert-fields li.frm_show_upgrade,
7677 -#frm-insert-fields li a,
6459 +.frmbutton.ui-sortable-helper a,
6460 +.frmbutton.ui-draggable-dragging a:hover,
7678 6461 .frmbutton.ui-draggable-dragging a {
7679 6462 text-decoration: none;
7680 - display: inline-flex !important;
7681 - gap: var(--gap-xs);
7682 - align-items: center;
6463 + height: 25px !important;
6464 + max-width: 180px;
6465 + text-align: center;
6466 + display: block !important;
6467 + background-color: var(--primary-hover) !important;
7683 6468 border-radius: var(--border-radius) !important;
7684 - padding: var(--gap-xs) var(--gap-sm) !important;
7685 - color: var(--grey-900) !important;
6469 + padding: 5px 20px !important;
7686 6470 }
7687 6471
7688 -/* Adjust field button size to full width in builder */
7689 -#frm-insert-fields li a {
7690 - display: flex !important;
6472 +.frmbutton.ui-draggable-dragging:not(.ui-sortable-helper) a {
6473 + /* When the new field is held outside of a dropzone */
6474 + cursor: not-allowed;
6475 + background: var(--sidebar-color) !important;
6476 + color: var(--dark-grey) !important;
7691 6477 }
7692 6478
7693 -/* Prevents advanced fields from always appearing in search results */
7694 -#frm-insert-fields li.frm_show_upgrade.frm_hidden {
7695 - display: none !important;
7696 -}
7697 -
7698 -.frmbutton.ui-draggable-dragging a {
7699 - border: 1px solid var(--grey-300);
7700 - box-shadow: var(--box-shadow-md);
7701 -}
7702 -
7703 6479 .frmbutton.ui-draggable-dragging span {
7704 6480 font-size: 15px;
7705 6481 }
7706 6482
7707 6483 #frm-show-fields .frmbutton.ui-sortable-helper i,
7708 -.frmbutton.ui-draggable-dragging i,
7709 -.frmbutton.ui-draggable-dragging .frmsvg {
6484 +.frmbutton.ui-sortable-helper span,
6485 +.frmbutton.ui-draggable-dragging i {
7710 6486 color: #fff !important;
7711 6487 }
7712 6488
7713 -.frmbutton.ui-draggable-dragging i,
7714 -.frmbutton.ui-draggable-dragging .frmsvg {
7715 - color: var(--grey-700) !important;
6489 +.frmbutton.ui-draggable-dragging:not(.ui-sortable-helper) i {
6490 + color: var(--dark-grey) !important;
7716 6491 }
7717 6492
6493 +.frmbutton.ui-draggable-dragging .frm-dropdown-menu {
6494 + display: none;
6495 +}
6496 +
7718 6497 .frm_sorting li.ui-state-default.ui-sortable-helper,
7719 6498 .frmbutton.ui-sortable-helper {
7720 6499 transition: opacity .2s;
7721 6500 opacity: 1;
@@ -7720,13 +6499,10 @@
7720 6499 transition: opacity .2s;
7721 6500 opacity: 1;
7722 6501 }
7723 6502
7724 -.frm-field-group-count {
7725 - background-color: var(--sidebar-hover);
7726 - padding: 5px;
7727 - color: #fff !important;
7728 - border-radius: 10px;
6503 +.frmbutton.ui-sortable-helper:not(.ui-draggable-dragging) {
6504 + opacity: 0;
7729 6505 }
7730 6506
7731 6507 /* End dragging */
7732 6508
@@ -7752,66 +6528,14 @@
7752 6528 .frm_noallow a {
7753 6529 color: inherit;
7754 6530 }
7755 6531
7756 -#frm_upgrade_modal_image {
7757 - max-width: 200px;
7758 -}
7759 -
7760 -.frm-tab-message {
7761 - max-width: 600px;
7762 - margin: 20px auto;
7763 - color: rgba(63, 75, 91, 0.8);
7764 -}
7765 -
7766 -.frm-settings-screenshot-toolbar {
7767 - min-height: 39px;
7768 - display: flex;
7769 -}
7770 -
7771 -.frm-settings-screenshot-toolbar .frm-minmax-icon {
7772 - height: 8px;
7773 - width: 8px;
7774 - border-radius: 50%;
7775 - align-self: center;
7776 - margin-left: 10px;
7777 -}
7778 -
7779 -.frm-settings-screenshot-toolbar .frm-minmax-icon:first-of-type {
7780 - margin-left: 20px;
7781 -}
7782 -
7783 -.frm-settings-screenshot-toolbar img {
7784 - object-fit: contain;
7785 - align-self: flex-end;
7786 - margin-left: 25px;
7787 -}
7788 -
7789 -.frm-settings-screenshot-toolbar + div {
7790 - background: #fff;
7791 - padding-top: 25px;
7792 - border-radius: 0 0 16px 16px;
7793 -}
7794 -
7795 -.frm-settings-screenshot-toolbar + div img {
7796 - max-width: calc( 100% - 40px );
7797 -}
7798 -
7799 -.frm-settings-screenshot-wrapper {
7800 - max-width: 700px;
7801 - margin: 50px auto 0;
7802 - box-shadow: 0px 4px 4px rgba(189, 196, 205, 0.25), 0px 12px 56px rgba(42, 57, 75, 0.25);
7803 - border-radius: 16px;
7804 - background: #EBECF1;
7805 -}
7806 -
7807 6532 .frm-dialog {
7808 6533 z-index: 100;
7809 6534 padding: 0 !important;
7810 - border-radius: 16px;
7811 - border: none;
6535 + border-radius: 10px;
6536 + border: 1px solid var(--grey);
7812 6537 background-color: #fff;
7813 - max-width: 100% !important;
7814 6538 }
7815 6539
7816 6540 .frm-dialog .postbox {
7817 6541 background: transparent;
@@ -7816,14 +6540,20 @@
7816 6540 .frm-dialog .postbox {
7817 6541 background: transparent;
7818 6542 box-shadow: none;
7819 6543 border: none;
7820 - line-height: var(--leading);
7821 6544 }
7822 6545
6546 +.frm-dialog .frm-sub-label,
6547 +.frm-dialog label {
6548 + color: var(--dark-grey);
6549 + font-size: 17px;
6550 + font-weight: 300;
6551 +}
6552 +
7823 6553 .frm-dialog input[type=text],
7824 6554 .frm-dialog textarea {
7825 - font-size: var(--text-md);
6555 + font-size: 16px;
7826 6556 }
7827 6557
7828 6558 .frm-dialog textarea {
7829 6559 height: 75px;
@@ -7836,19 +6566,16 @@
7836 6566 .frm-dialog .frm-sub-label,
7837 6567 .frm-sub-label {
7838 6568 color: var(--grey);
7839 6569 text-transform: none;
7840 - padding-left: 8px;
7841 6570 }
7842 6571
7843 6572 h2 .frm-sub-label {
7844 - font-size: var(--text-md);
6573 + font-size: 16px;
7845 6574 }
7846 6575
7847 -.frm-views-editor-body .ui-widget-overlay,
7848 6576 .frm-white-body .ui-widget-overlay,
7849 -.toplevel_page_formidable .ui-widget-overlay,
7850 -body[class*=formidable-payments] .ui-widget-overlay {
6577 +.toplevel_page_formidable .ui-widget-overlay {
7851 6578 position: fixed;
7852 6579 width: 100%;
7853 6580 height: 100%;
7854 6581 top: 0;
@@ -7854,10 +6581,9 @@
7854 6581 top: 0;
7855 6582 left: 0;
7856 6583 right: 0;
7857 6584 bottom: 0;
7858 - background: var(--grey-500);
7859 - opacity: .5;
6585 + background: var(--grey-border);
7860 6586 z-index: 2;
7861 6587 }
7862 6588
7863 6589 #frm_upgrade_modal {
@@ -7872,15 +6598,15 @@
7872 6598 color: #c4c4c4;
7873 6599 padding-bottom: 20px;
7874 6600 }
7875 6601
7876 -.frm-upgrade-message img {
6602 +#frm-upgrade-message img {
7877 6603 max-width: 100%;
7878 6604 }
7879 6605
7880 6606 a.frm-link-secondary {
7881 6607 color: #c4c4c4;
7882 - font-size: var(--text-sm);
6608 + font-size: 14px;
7883 6609 text-decoration: underline;
7884 6610 }
7885 6611
7886 6612 .field_type_list li.button.frm_noallow,
@@ -7896,136 +6622,132 @@
7896 6622 min-height: 150px;
7897 6623 }
7898 6624
7899 6625 /*!
7900 - * Bootstrap v4.6.1
6626 + * Bootstrap v3.0.2
7901 6627 */
7902 6628
7903 6629 .tooltip {
7904 - /* Copied from Bootstrap */
7905 6630 position: absolute;
6631 + z-index: 9999999;
7906 6632 display: block;
7907 - margin: 0;
7908 - font-style: normal;
7909 - font-weight: 400;
7910 - line-height: 1.5;
7911 - text-align: left;
7912 - text-align: start;
7913 - text-decoration: none;
7914 - text-shadow: none;
7915 - text-transform: none;
7916 - letter-spacing: normal;
7917 - word-break: normal;
7918 - word-spacing: normal;
7919 - white-space: normal;
7920 - line-break: auto;
7921 - font-size: 0.875rem;
7922 - word-wrap: break-word;
6633 + visibility: visible;
6634 + font-size: 14px;
6635 + line-height: 1.4;
7923 6636 opacity: 0;
7924 -
7925 - /* Custom rules */
7926 - z-index: 9999999;
7927 - pointer-events: none;
6637 + filter: alpha(opacity=0);
7928 6638 }
7929 6639
7930 -.tooltip.show {
7931 - opacity: 0.9;
6640 +.tooltip.in {
6641 + opacity: 1;
6642 + filter: alpha(opacity=100);
7932 6643 }
7933 6644
7934 -.tooltip .arrow {
7935 - position: absolute;
7936 - display: block;
7937 - width: 0.8rem;
7938 - height: 0.4rem;
7939 - margin-left: 0 !important;
6645 +.tooltip.top {
6646 + margin-top: -3px;
6647 + padding: 5px 0;
7940 6648 }
7941 6649
7942 -.tooltip .arrow::before {
7943 - position: absolute;
7944 - content: "";
7945 - border-color: transparent;
7946 - border-style: solid;
6650 +.tooltip.right {
6651 + margin-left: 3px;
6652 + padding: 0 5px;
7947 6653 }
7948 6654
7949 -.bs-tooltip-top, .bs-tooltip-auto[x-placement^="top"] {
7950 - padding: 0.4rem 0;
6655 +.tooltip.bottom {
6656 + margin-top: 3px;
6657 + padding: 5px 0;
7951 6658 }
7952 6659
7953 -.bs-tooltip-top .arrow, .bs-tooltip-auto[x-placement^="top"] .arrow {
7954 - bottom: 0;
6660 +.tooltip.left {
6661 + margin-left: -3px;
6662 + padding: 0 5px;
7955 6663 }
7956 6664
7957 -.bs-tooltip-top .arrow::before, .bs-tooltip-auto[x-placement^="top"] .arrow::before {
7958 - top: 0;
7959 - border-width: 0.4rem 0.4rem 0;
7960 - border-top-color: #000;
6665 +.tooltip-inner {
6666 + max-width: 200px;
6667 + padding: 10px;
6668 + color: #fff;
6669 + text-align: left;
6670 + text-decoration: none;
6671 + background-color: var(--dark-grey);
6672 + border-radius: 4px;
6673 + z-index: 99999999;
6674 + text-transform: none;
7961 6675 }
7962 6676
7963 -.bs-tooltip-right, .bs-tooltip-auto[x-placement^="right"] {
7964 - padding: 0 0.4rem;
6677 +.tooltip.right .tooltip-inner {
6678 + min-width: 150px;
6679 + max-width: 300px;
7965 6680 }
7966 6681
7967 -.bs-tooltip-right .arrow, .bs-tooltip-auto[x-placement^="right"] .arrow {
7968 - left: 0;
7969 - width: 0.4rem;
7970 - height: 0.8rem;
6682 +.tooltip-arrow {
6683 + position: absolute;
6684 + width: 0;
6685 + height: 0;
6686 + border-color: transparent;
6687 + border-style: solid;
7971 6688 }
7972 6689
7973 -.bs-tooltip-right .arrow::before, .bs-tooltip-auto[x-placement^="right"] .arrow::before {
7974 - right: 0;
7975 - border-width: 0.4rem 0.4rem 0.4rem 0;
7976 - border-right-color: #000;
6690 +.tooltip.top .tooltip-arrow {
6691 + bottom: 0;
6692 + left: 50%;
6693 + margin-left: -5px;
6694 + border-width: 5px 5px 0;
6695 + border-top-color: var(--dark-grey);
7977 6696 }
7978 6697
7979 -.bs-tooltip-bottom, .bs-tooltip-auto[x-placement^="bottom"] {
7980 - padding: 0.4rem 0;
6698 +.tooltip.top-left .tooltip-arrow {
6699 + bottom: 0;
6700 + left: 5px;
6701 + border-width: 5px 5px 0;
6702 + border-top-color: var(--dark-grey);
7981 6703 }
7982 6704
7983 -.bs-tooltip-bottom .arrow, .bs-tooltip-auto[x-placement^="bottom"] .arrow {
7984 - top: 0;
7985 -}
7986 -
7987 -.bs-tooltip-bottom .arrow::before, .bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
6705 +.tooltip.top-right .tooltip-arrow {
7988 6706 bottom: 0;
7989 - border-width: 0 0.4rem 0.4rem;
7990 - border-bottom-color: #000;
6707 + right: 5px;
6708 + border-width: 5px 5px 0;
6709 + border-top-color: var(--dark-grey);
7991 6710 }
7992 6711
7993 -.bs-tooltip-left, .bs-tooltip-auto[x-placement^="left"] {
7994 - padding: 0 0.4rem;
6712 +.tooltip.right .tooltip-arrow {
6713 + top: 50%;
6714 + left: 0;
6715 + margin-top: -5px;
6716 + border-width: 5px 5px 5px 0;
6717 + border-right-color: var(--dark-grey);
7995 6718 }
7996 6719
7997 -.bs-tooltip-left .arrow, .bs-tooltip-auto[x-placement^="left"] .arrow {
6720 +.tooltip.left .tooltip-arrow {
6721 + top: 50%;
7998 6722 right: 0;
7999 - width: 0.4rem;
8000 - height: 0.8rem;
6723 + margin-top: -5px;
6724 + border-width: 5px 0 5px 5px;
6725 + border-left-color: var(--dark-grey);
8001 6726 }
8002 6727
8003 -.bs-tooltip-left .arrow::before, .bs-tooltip-auto[x-placement^="left"] .arrow::before {
8004 - left: 0;
8005 - border-width: 0.4rem 0 0.4rem 0.4rem;
8006 - border-left-color: #000;
6728 +.tooltip.bottom .tooltip-arrow {
6729 + top: 0;
6730 + left: 50%;
6731 + margin-left: -5px;
6732 + border-width: 0 5px 5px;
6733 + border-bottom-color: var(--dark-grey);
8007 6734 }
8008 6735
8009 -.tooltip-inner {
8010 - max-width: 200px;
8011 - padding: 0.25rem 0.5rem;
8012 - color: #fff;
8013 - text-align: center;
8014 - background-color: #000;
8015 - border-radius: 0.25rem;
6736 +.tooltip.bottom-left .tooltip-arrow {
6737 + top: 0;
6738 + left: 5px;
6739 + border-width: 0 5px 5px;
6740 + border-bottom-color: var(--dark-grey);
8016 6741 }
8017 6742
8018 -.frm-dropdown-menu.show {
8019 - display: block;
6743 +.tooltip.bottom-right .tooltip-arrow {
6744 + top: 0;
6745 + right: 5px;
6746 + border-width: 0 5px 5px;
6747 + border-bottom-color: var(--dark-grey);
8020 6748 }
8021 6749
8022 -/* End Bootstrap */
8023 -
8024 -.preview.dropdown .dropdown-menu {
8025 - min-width: 205px;
8026 -}
8027 -
8028 6750 .frm_clear {
8029 6751 clear: both;
8030 6752 }
8031 6753
@@ -8063,8 +6785,10 @@
8063 6785 transition: width 0.6s ease;
8064 6786 background-color: #04A4CC;
8065 6787 }
8066 6788
6789 +/* End Bootstrap */
6790 +
8067 6791 .tooltip.frm_tooltip {
8068 6792 position: fixed;
8069 6793 top: auto !important;
8070 6794 bottom: 0 !important;
@@ -8085,25 +6809,93 @@
8085 6809 box-shadow: 5px 5px 25px rgba(0, 0, 0, 0.5);
8086 6810 padding: 10px 40px;
8087 6811 border-top-color: #ccc;
8088 6812 background: var(--sidebar-color);
8089 - color: var(--grey-700);
6813 + color: var(--dark-grey);
8090 6814 border-radius: 0;
8091 6815 opacity: 1;
8092 - font-size: var(--text-sm);
6816 + font-size: 14px;
8093 6817 }
8094 6818
6819 +#frm_styling_form #post-body {
6820 + padding: 20px;
6821 +}
6822 +
6823 +.ui-datepicker-inline.ui-datepicker {
6824 + max-width: 19em;
6825 +}
6826 +
6827 +.default-style-box.howto {
6828 + margin-left: 20px;
6829 + font-style: normal;
6830 +}
6831 +
8095 6832 #frm_custom_css_box {
8096 6833 width: 100%;
8097 6834 }
8098 6835
6836 +#frm_styling_form .wp-picker-container .wp-color-result.button {
6837 + width: 100%;
6838 + overflow: hidden;
6839 + margin: 0 !important;
6840 + height: 32px !important;
6841 + padding: 0 0 0 30px !important;
6842 + border-radius: var(--small-radius);
6843 + border-color: var(--grey-border);
6844 +}
6845 +
6846 +#frm_styling_form .wp-color-result-text {
6847 + line-height: 30px !important;
6848 + font-size: 15px;
6849 + background: #fff !important;
6850 +}
6851 +
6852 +.wp-picker-open + .wp-picker-input-wrap {
6853 + position: absolute;
6854 + margin-left: -87px;
6855 + margin-top: 1px;
6856 + width: 86px;
6857 +}
6858 +
6859 +.wp-picker-container input[type="text"].wp-color-picker {
6860 + border: none;
6861 + padding: 3px;
6862 + font-family: inherit;
6863 + color: var(--dark-grey);
6864 + font-size: 15px;
6865 + width: 100%;
6866 + line-height: 1;
6867 + text-align: center;
6868 +}
6869 +
6870 +.wp-picker-input-wrap .wp-picker-clear {
6871 + display: none !important;
6872 +}
6873 +
6874 +.wp-picker-holder {
6875 + position: absolute;
6876 + z-index: 999;
6877 +}
6878 +
6879 +.frm_end .wp-picker-holder {
6880 + margin-left: -145px;
6881 +}
6882 +
6883 +.frm_end.frm6 .wp-picker-holder {
6884 + margin-left: -86px;
6885 +}
6886 +
6887 +#frm_styling_form div.tabs-panel {
6888 + padding-left: 5px;
6889 + padding-right: 5px;
6890 +}
6891 +
8099 6892 /*form inputs/selects */
8100 6893 .frm_form_field.frm_scroll_box .frm_opt_container,
8101 -.frm-white-body .wrap input[type="text"], /* Cover Views pages */
8102 -.frm-white-body .wrap input[type="search"],
8103 -.frm-white-body .wrap input[type="number"],
8104 -.frm-white-body .wrap select,
8105 -.frm-white-body .wrap textarea,
6894 +#postbox-container-2 input[type="text"],
6895 +#postbox-container-2 input[type="number"],
6896 +#postbox-container-2 select,
6897 +#postbox-container-2 textarea,
8106 6898 button.frm_choose_image_box,
8107 6899 #titlediv input[type="text"],
8108 6900 .frm-fields button.btn,
8109 6901 .frm_wrap textarea,
@@ -8108,11 +6900,9 @@
8108 6900 .frm-fields button.btn,
8109 6901 .frm_wrap textarea,
8110 6902 .frm_wrap input[type="tel"],
8111 6903 .frm_wrap input[type="text"],
8112 -.frm_wrap input[type=search],
8113 6904 .frm_wrap input[type="number"],
8114 -.frm_wrap input[type="date"],
8115 6905 .frm_wrap select,
8116 6906 .wp-admin .frm_wrap select,
8117 6907 .field-group textarea,
8118 6908 .field-group input[type="text"],
@@ -8119,33 +6909,17 @@
8119 6909 .field-group select {
8120 6910 outline: 0;
8121 6911 box-shadow: none;
8122 6912 border-radius: var(--small-radius);
8123 - padding: 5px 14px;
8124 - border-color: var(--grey-300);
8125 - color: var(--grey-800);
8126 - font-size: var(--text-md);
6913 + padding: 6px 9px;
6914 + border-color: var(--grey-border);
6915 + color: var(--dark-grey);
6916 + font-size: 15px;
8127 6917 margin: 0;
8128 6918 background-color: #fff;
8129 - line-height: var(--leading);
6919 + line-height: 1;
8130 6920 }
8131 6921
8132 -.frm_wrap ::-webkit-datetime-edit {
8133 - line-height: var(--leading);
8134 -}
8135 -
8136 -.frm-white-body textarea:focus,
8137 -.frm-white-body input:focus,
8138 -.frm-white-body select:focus,
8139 -.frm_wrap input:focus,
8140 -.frm_wrap select:focus,
8141 -.wp-core-ui .frm_wrap select:focus,
8142 -.frm-btn-group .multiselect.dropdown-toggle:focus,
8143 -.frm_wrap textarea:focus {
8144 - border-color: var(--primary-500) !important;
8145 - box-shadow: none !important;
8146 -}
8147 -
8148 6922 #postbox-container-2 textarea,
8149 6923 .frm_wrap textarea,
8150 6924 .field-group textarea {
8151 6925 line-height: 2;
@@ -8162,12 +6936,19 @@
8162 6936 .wp-admin .frm_wrap select {
8163 6937 max-width: 100%;
8164 6938 }
8165 6939
8166 -.frm_form_field.frm_scroll_box .frm_opt_container {
6940 +.frm_form_field.frm_scroll_box .frm_opt_container,
6941 +.frm_wrap .frm_form_builder textarea,
6942 +.frm_wrap .frm_form_builder input[type="tel"],
6943 +.frm_wrap .frm_form_builder input[type="text"] {
8167 6944 padding: 10px 12px;
8168 6945 }
8169 6946
6947 +.frm_wrap .frm_form_builder input[type="text"].frm_other_input {
6948 + padding: 6px 9px;
6949 +}
6950 +
8170 6951 .frm_wrap input[disabled],
8171 6952 .frm_wrap select[disabled],
8172 6953 .frm_wrap textarea[disabled],
8173 6954 .frm_wrap input[readonly],
@@ -8173,47 +6954,54 @@
8173 6954 .frm_wrap input[readonly],
8174 6955 .frm_wrap select[readonly],
8175 6956 .frm_wrap textarea[readonly],
8176 6957 .frm_wrap input::placeholder {
8177 - color: var(--grey-500);
6958 + color: var(--grey);
8178 6959 }
8179 6960
6961 +#postcustomstuff table input {
6962 + width: 100% !important;
6963 + margin: 0 !important;
6964 +}
6965 +
6966 +#postcustomstuff table td {
6967 + padding: 7px 0 7px 7px !important;
6968 + line-height: 30px;
6969 +}
6970 +
8180 6971 #postcustomstuff table td > div {
8181 6972 /* To override some inline css in add-on */
8182 6973 padding-top: 0 !important;
8183 6974 }
8184 6975
8185 -.wp-admin .frm_wrap .form-table select {
6976 +.wp-admin .frm_wrap .form-table select,
6977 +#postbox-container-2 select,
6978 +.wp-admin .frm_wrap select {
6979 + line-height: 32px;
6980 + height: 32px;
8186 6981 vertical-align: top;
8187 6982 }
8188 6983
8189 6984 .frm_wrap .frm_form_builder select {
8190 - line-height: var(--leading);
8191 - height: var(--text-md);
6985 + line-height: 40px;
6986 + height: 40px;
8192 6987 width: 100%;
8193 6988 }
8194 6989
8195 -#postbox-container-2 select,
8196 -.wp-admin .frm_wrap select,
8197 -.frm_wrap .frm_form_builder select {
6990 +/** TODO: After 5.5, remove the branch clases **/
6991 +.branch-5-5 #postbox-container-2 select,
6992 +.branch-5-5.wp-admin .frm_wrap select,
6993 +.branch-5-5 .frm_wrap .frm_form_builder select,
6994 +.branch-5-4 #postbox-container-2 select,
6995 +.branch-5-4.wp-admin .frm_wrap select,
6996 +.branch-5-4 .frm_wrap .frm_form_builder select,
6997 +.branch-5-3 #postbox-container-2 select,
6998 +.branch-5-3.wp-admin .frm_wrap select,
6999 +.branch-5-3 .frm_wrap .frm_form_builder select {
8198 7000 height: auto;
8199 - background-position: right 11px top 55%;
7001 + padding: 0 24px 0 12px;
8200 7002 }
8201 7003
8202 -.frm-white-body .tablenav select,
8203 -.frm-white-body .tablenav input[type="text"],
8204 -.wp-admin .frm_wrap .tablenav select,
8205 -.frm_wrap .tablenav input[type="date"],
8206 -.frm_wrap .tablenav input[type="text"] {
8207 - padding-top: 0;
8208 - padding-bottom: 0;
8209 - line-height: 1;
8210 -}
8211 -
8212 -.frm_wrap .tablenav ::-webkit-datetime-edit {
8213 - line-height: 1;
8214 -}
8215 -
8216 7004 .frm-fields button.btn,
8217 7005 .frm-fields textarea,
8218 7006 .frm-fields input[type="text"],
8219 7007 .frm-fields select,
@@ -8225,9 +7013,10 @@
8225 7013 outline: 0;
8226 7014 }
8227 7015
8228 7016 .frm-fields button.btn {
8229 - height: var(--h-md);
7017 + line-height: normal;
7018 + height: auto;
8230 7019 text-align: inherit;
8231 7020 }
8232 7021
8233 7022 .global-font .field-group input[type="text"] {
@@ -8233,53 +7022,8 @@
8233 7022 .global-font .field-group input[type="text"] {
8234 7023 width: auto;
8235 7024 }
8236 7025
8237 -/* Image Options */
8238 -
8239 -.frm_images_dropdown .frm_image_option {
8240 - margin: 0 !important;
8241 -}
8242 -
8243 -.frm_images_dropdown .frm_radio input[type=radio] {
8244 - opacity: 0;
8245 - position: absolute;
8246 - z-index: -1;
8247 -}
8248 -
8249 -.frm_images_dropdown__image .frmsvg {
8250 - width: 100%;
8251 - max-width: 102px;
8252 - fill: none;
8253 - margin: 0;
8254 -}
8255 -
8256 -.frm_images_dropdown .frm_noallow .frm_image_option_container {
8257 - opacity: .5;
8258 -}
8259 -
8260 -.frm_images_dropdown .frm_image_option_container {
8261 - border-radius: var(--small-radius);
8262 - border: 2px solid transparent;
8263 - align-items: center;
8264 -}
8265 -
8266 -.frm_images_dropdown .frm_image_option_container:hover {
8267 - background: #fff !important;
8268 -}
8269 -
8270 -.frm_images_dropdown input[type="radio"]:checked + .frm_image_option_container {
8271 - background: #fff !important;
8272 - border-color: var(--primary-500);
8273 -}
8274 -
8275 -.frm_images_dropdown .frm_text_label_for_image {
8276 - padding: 0;
8277 - text-align: left;
8278 -}
8279 -
8280 -/* End Image Options */
8281 -
8282 7026 /* Welcome page */
8283 7027
8284 7028 .wp-core-ui .frm_grey.frm-button-primary.disabled,
8285 7029 .wp-core-ui .frm_grey.frm-button-primary,
@@ -8298,9 +7042,9 @@
8298 7042 }
8299 7043
8300 7044 .windows::-webkit-scrollbar-thumb,
8301 7045 .windows ::-webkit-scrollbar-thumb {
8302 - background: var(--grey-300);
7046 + background: var(--grey-border);
8303 7047 -webkit-border-radius: var(--border-radius);
8304 7048 -webkit-box-shadow: none;
8305 7049 }
8306 7050
@@ -8322,9 +7066,8 @@
8322 7066 .rtl #frm_top_bar #frm_bs_dropdown {
8323 7067 padding-left: 15px;
8324 7068 }
8325 7069
8326 -.rtl .frm-full-close,
8327 7070 .rtl .frm_wrap .columns-2 .frm-right-panel,
8328 7071 .rtl .frm-right-panel {
8329 7072 border-right-width: 1px;
8330 7073 border-left-width: 0;
@@ -8329,14 +7072,9 @@
8329 7072 border-right-width: 1px;
8330 7073 border-left-width: 0;
8331 7074 }
8332 7075
8333 -.rtl .frm-full-close {
8334 - padding-left: 0;
8335 - padding-right: var(--gap-md);
8336 -}
8337 -
8338 -.rtl .frm-text-right {
7076 +.rtl .frm_right_text {
8339 7077 text-align: left;
8340 7078 }
8341 7079
8342 7080 .rtl .frm_wrap #frm_adv_info ul.category-tabs li:first-child {
@@ -8376,44 +7114,28 @@
8376 7114 margin-left: 0;
8377 7115 margin-right: 46%;
8378 7116 }
8379 7117
8380 -.rtl .frm-field-action-icons {
8381 - right: unset;
8382 - left: 2px;
7118 +.rtl .frm-field-action-icons a {
7119 + float: left;
7120 + margin-right: 15px;
7121 + margin-left: 0;
8383 7122 }
8384 7123
7124 +.rtl #frm_upgrade_modal .dismiss i,
7125 +.rtl .frm-inline-modal i,
7126 +.rtl #frm-bulk-modal i,
8385 7127 .rtl .frm_has_shortcodes > i {
8386 7128 right: auto;
8387 7129 left: 5px;
8388 7130 }
8389 7131
7132 +.rtl .frm_code_list.frm-full-hover a span,
8390 7133 .rtl .frm_reply_to_container,
8391 7134 .rtl .frm_bcc_cc_container {
8392 7135 float: left;
8393 7136 }
8394 7137
8395 -.rtl .frm-default-switcher {
8396 - float: left;
8397 - position: relative;
8398 -}
8399 -
8400 -.rtl .frm-with-right-icon .frmsvg {
8401 - right: auto;
8402 - left: 0;
8403 -}
8404 -
8405 -.rtl .frm-inline-modal > a.dismiss {
8406 - left: 13px;
8407 - right: auto;
8408 -}
8409 -
8410 -.rtl.wp-admin .frm_wrap select {
8411 - padding-left: var(--gap-lg) !important;
8412 - padding-right: 5px !important;
8413 - background-position: left 11px top 55%;
8414 -}
8415 -
8416 7138 /* ---------------------------------------------------------------
8417 7139 Clearfix
8418 7140 --------------------------------------------------------------- */
8419 7141 span.clear {
@@ -8455,12 +7177,15 @@
8455 7177 @media only screen and (max-width: 1200px) {
8456 7178 .frm-addons {
8457 7179 grid-template-columns: 1fr 1fr;
8458 7180 }
7181 +
7182 + ul.frm_form_nav > li {
7183 + margin-right: 2.5%;
7184 + }
8459 7185 }
8460 7186
8461 7187 @media only screen and (max-width: 1050px) {
8462 - .frm-white-body,
8463 7188 .frm_wrap {
8464 7189 --biggest-sidebar: 390px;
8465 7190 }
8466 7191
@@ -8470,18 +7195,15 @@
8470 7195
8471 7196 .frm_actions_list {
8472 7197 margin-left: 0;
8473 7198 }
7199 +
7200 + ul.frm_form_nav > li {
7201 + margin-right: 1.5%;
7202 + }
8474 7203 }
8475 7204
8476 7205 @media only screen and (max-width: 960px) {
8477 - .frm-white-body,
8478 - .frm_wrap {
8479 - --gap-sm: 8px;
8480 - --gap-md: 16px;
8481 - --gap-2xl: 24px;
8482 - }
8483 -
8484 7206 .auto-fold #adminmenuwrap {
8485 7207 width: 36px;
8486 7208 }
8487 7209
@@ -8492,40 +7214,36 @@
8492 7214 p.howto {
8493 7215 display: inline-block;
8494 7216 }
8495 7217
8496 - /* Fix: Issue where the admin page content had extra white space to the left on small screens */
8497 - .auto-fold.frm-admin-page-styles:not(.frm-full-screen) .frm_page_container,
8498 - .auto-fold:not(.frm-full-screen) .frm_wrap .frm_page_container {
8499 - left: 36px;
7218 + ul.frm_form_nav {
7219 + clear: left;
7220 + padding-top: 0;
8500 7221 }
8501 7222
8502 - .frm-admin-footer-links {
8503 - padding-left: 36px;
7223 + ul.frm_form_nav > li {
7224 + margin-right: 3.5%;
8504 7225 }
8505 7226
8506 - body.rtl .frm-admin-footer-links {
8507 - padding-right: 36px;
7227 + .frm-full-screen #frm_top_bar {
7228 + padding: 0 10px !important;
8508 7229 }
7230 +
7231 + .frm-full-close {
7232 + padding: 15px 0 10px 10px;
7233 + }
7234 +
7235 + .frm-full-close .frmsvg {
7236 + padding: 0;
7237 + }
8509 7238 }
8510 7239
8511 7240 @media only screen and (max-width: 850px) {
8512 - #frm_bs_dropdown {
8513 - /* There isn't enough room for the title on a screen this size so just hide it. */
8514 - display: none;
8515 - }
8516 -
8517 - .frm-white-body,
8518 7241 .frm_wrap {
8519 7242 --biggest-sidebar: 350px;
8520 7243 --big-sidebar: 350px;
8521 7244 }
8522 7245
8523 - #frm_bs_dropdown .frm_bstooltip {
8524 - /* There isn't enough room for the title on a screen this size so just hide it. */
8525 - display: none !important;
8526 - }
8527 -
8528 7246 .frm_col_one {
8529 7247 clear: none;
8530 7248 }
8531 7249
@@ -8534,9 +7252,10 @@
8534 7252 display: block;
8535 7253 margin: 5px 0;
8536 7254 }
8537 7255
8538 - #frm_top_bar h1 {
7256 + .post-type-frm_display #frm_top_bar h1,
7257 + .frm_page_container #frm_top_bar h1 {
8539 7258 width: auto;
8540 7259 max-width: 200px;
8541 7260 }
8542 7261
@@ -8606,9 +7325,8 @@
8606 7325 }
8607 7326 }
8608 7327
8609 7328 @media only screen and (max-width: 782px) {
8610 - .frm-white-body,
8611 7329 .frm_wrap {
8612 7330 --small-sidebar: 20%;
8613 7331 --medium-sidebar: 35%
8614 7332 }
@@ -8622,9 +7340,9 @@
8622 7340 .frm_wrap #publishing-action {
8623 7341 line-height: normal;
8624 7342 }
8625 7343
8626 - .frm-white-body #screen-meta-links {
7344 + .frm-full-screen #screen-meta-links {
8627 7345 display: none;
8628 7346 }
8629 7347
8630 7348 .frm_wrap .misc-pub-section {
@@ -8683,13 +7401,8 @@
8683 7401 .with_frm_style .frm_checkbox input[type=checkbox] {
8684 7402 width: 25px !important;
8685 7403 }
8686 7404
8687 - .frm_single_entry_page .with_frm_style .frm_radio input[type=radio],
8688 - .frm_single_entry_page .with_frm_style .frm_checkbox input[type=checkbox] {
8689 - width: 18px !important;
8690 - }
8691 -
8692 7405 .wp-list-table.toplevel_page_formidable .column-entries,
8693 7406 .wp-list-table.toplevel_page_formidable .column-form_key,
8694 7407 .wp-list-table.toplevel_page_formidable .column-shortcode,
8695 7408 .wp-list-table.toplevel_page_formidable .column-created_at {
@@ -8703,13 +7416,27 @@
8703 7416 padding: 3px 8px 3px 35%;
8704 7417 text-align: left;
8705 7418 }
8706 7419
7420 + .wp-list-table.toplevel_page_formidable td.column-title:before,
7421 + .wp-list-table.toplevel_page_formidable td.column-id:before {
7422 + display: none !important;
7423 + }
7424 +
7425 + .wp-list-table.toplevel_page_formidable td.column-title,
7426 + .wp-list-table.toplevel_page_formidable td.column-id {
7427 + display: table-cell !important;
7428 + }
7429 +
8707 7430 #form_entries_page .wp-list-table th.frm_hidden,
8708 7431 #form_entries_page .wp-list-table td.frm_hidden {
8709 7432 display: none !important;
8710 7433 }
8711 7434
7435 + ul.frm_form_nav > li {
7436 + margin-right: 15px;
7437 + }
7438 +
8712 7439 .frm-white-body.auto-fold #wpcontent {
8713 7440 padding-left: 0;
8714 7441 }
8715 7442
@@ -8720,13 +7447,11 @@
8720 7447 .frm-addons {
8721 7448 grid-template-columns: 1fr;
8722 7449 }
8723 7450
8724 - .frm-admin-page-styles .frm_page_container,
8725 - .frm_wrap .frm_page_container {
8726 - left: 0 !important;
8727 - top: 46px !important;
8728 - height: calc( 100vh - 46px ) !important;
7451 + .frm_single_entry_page.frm_wrap .frm_page_container {
7452 + height: auto;
7453 + display: block;
8729 7454 }
8730 7455
8731 7456 .frm_single_entry_page.frm_wrap .columns-2 {
8732 7457 display: block;
@@ -8744,22 +7469,13 @@
8744 7469 border-radius: 6px;
8745 7470 }
8746 7471
8747 7472 #wp-content-media-buttons a.frm_insert_form {
8748 - padding: 0 var(--gap-sm);
7473 + padding: 0 15px;
8749 7474 }
8750 -
8751 - .frm-admin-footer-links {
8752 - padding-left: 0;
8753 - }
8754 -
8755 - body.rtl .frm-admin-footer-links {
8756 - padding-right: 0;
8757 - }
8758 7475 }
8759 7476
8760 7477 @media only screen and (max-width: 700px) {
8761 - .frm-white-body,
8762 7478 .frm_wrap {
8763 7479 --biggest-sidebar: 50%;
8764 7480 --big-sidebar: 50%;
8765 7481 }
@@ -8765,9 +7481,8 @@
8765 7481 }
8766 7482 }
8767 7483
8768 7484 @media only screen and (max-width: 600px) {
8769 - .frm-white-body,
8770 7485 .frm_wrap {
8771 7486 --small-sidebar: 45px;
8772 7487 }
8773 7488
@@ -8773,9 +7488,9 @@
8773 7488
8774 7489 .frm-form-setting-tabs a {
8775 7490 visibility: collapse;
8776 7491 font-size: 0;
8777 - padding: 0 var(--gap-sm);
7492 + padding: 0 15px;
8778 7493 }
8779 7494
8780 7495 .frm-form-setting-tabs a .frmsvg,
8781 7496 .frm-form-setting-tabs a i {
@@ -8847,12 +7562,8 @@
8847 7562 .rtl #frm_builder_page .frm_actions_dropdown > .frm-dropdown-menu {
8848 7563 right: auto;
8849 7564 left: 0;
8850 7565 }
8851 -
8852 - .frm_on_submit_type svg {
8853 - display: none;
8854 - }
8855 7566 }
8856 7567
8857 7568 @media only screen and (max-width: 475px) {
8858 7569 #frm_bs_dropdown {
@@ -8868,18 +7579,8 @@
8868 7579 margin-right: 0;
8869 7580 }
8870 7581 }
8871 7582
8872 -/* Firefox */
8873 -@-moz-document url-prefix() {
8874 - .frm-white-body .tablenav select,
8875 - .frm-white-body .tablenav input[type="text"],
8876 - .wp-admin .frm_wrap .tablenav select,
8877 - .frm_wrap .tablenav input[type="text"] {
8878 - padding-top: 5px;
8879 - }
8880 -}
8881 -
8882 7583 /* PRINT */
8883 7584 @media print {
8884 7585 a, .misc-pub-section a {
8885 7586 color: #000 !important;
@@ -8930,9 +7631,9 @@
8930 7631 display: block;
8931 7632 padding: 20px;
8932 7633 }
8933 7634
8934 - .frm_wrap .columns-2,
7635 + .frm_page_container .columns-2,
8935 7636 .frm_wrap .frm_page_container {
8936 7637 height: auto;
8937 7638 display: block;
8938 7639 }
@@ -8968,335 +7669,4 @@
8968 7669 display: block;
8969 7670 width: 100%;
8970 7671 }
8971 7672 }
8972 -
8973 -.frm-admin-page-styles #frm-publishing #save_menu_header,
8974 -.frm-admin-page-styles2 #frm-publishing #save_menu_header {
8975 - display: inline-block;
8976 -}
8977 -
8978 -/* Change the order of subfields of the Name field in the backend */
8979 -.edit_form_item .frm_combo_inputs_container[data-name-layout="last_first"] .frm_form_subfield-first {
8980 - order: 2;
8981 -}
8982 -
8983 -.frm-video-wrapper iframe {
8984 - width: 100%;
8985 - max-width: 843px;
8986 - border-radius: var(--border-radius);
8987 -}
8988 -
8989 -#frm_field_group_popup {
8990 - position: absolute;
8991 - top: 0;
8992 - right: 0;
8993 - width: 366px;
8994 - max-height: 231px;
8995 - border-radius: 8px;
8996 - background: #fff;
8997 - box-shadow: 0px 20px 48px rgba(40, 47, 54, 0.15);
8998 - z-index: 3;
8999 - box-sizing: border-box;
9000 - padding: 24px 0;
9001 - text-align: left;
9002 -}
9003 -
9004 -.rtl #frm_field_group_popup {
9005 - text-align: right;
9006 -}
9007 -
9008 -.frm-merge-fields-into-row #frm_field_group_popup {
9009 - top: unset;
9010 - bottom: 50px;
9011 - height: 196px;
9012 -}
9013 -
9014 -#frm_field_group_popup > hr {
9015 - margin: 12px 0;
9016 -}
9017 -
9018 -#frm_field_group_popup .frm-cancel-custom-field-group-layout,
9019 -#frm_field_group_popup .frm-save-custom-field-group-layout {
9020 - padding: 4px 18px;
9021 -}
9022 -
9023 -#frm_field_group_popup .frm-cancel-custom-field-group-layout:hover {
9024 - border-color: var(--primary-500) !important;
9025 - color: var(--primary-500);
9026 - background-color: transparent !important;
9027 -}
9028 -
9029 -.frm-merge-fields-into-row #frm_field_group_popup .frm-break-field-group {
9030 - display: none;
9031 -}
9032 -
9033 -.frm-merge-fields-into-row > a {
9034 - color: rgba(40, 47, 54, 0.85);
9035 - position: relative;
9036 - top: 2px;
9037 -}
9038 -
9039 -.frm-row-layout-title {
9040 - font-weight: 600;
9041 - font-size: 11px;
9042 - line-height: 15px;
9043 - text-transform: uppercase;
9044 - color: rgba(40, 47, 54, 0.45);
9045 - margin-bottom: 27px;
9046 -}
9047 -
9048 -.frm-row-layout-option {
9049 - background: #F6F7FB;
9050 - box-sizing: border-box;
9051 - border-radius: 2px;
9052 - padding: 15px 10px;
9053 -}
9054 -
9055 -#frm_field_group_popup .frm-row-layout-option .frm_grid_container {
9056 - grid-gap: 0 5%;
9057 - grid-template-columns: repeat(12, auto);
9058 -}
9059 -
9060 -#frm_field_group_popup .frm-row-layout-option {
9061 - cursor: pointer;
9062 - border: 2px solid transparent;
9063 -}
9064 -
9065 -#frm_field_group_popup .frm-row-layout-option.frm-active-row-layout,
9066 -#frm_field_group_popup .frm-row-layout-option:hover {
9067 - border-color: var(--primary-500);
9068 -}
9069 -
9070 -.frm-custom-field-group-layout,
9071 -.frm-break-field-group {
9072 - padding: 4px 24px;
9073 - cursor: pointer;
9074 - font-size: var(--text-sm);
9075 - line-height: 19px;
9076 - color: rgba(72, 78, 84, 1);
9077 -}
9078 -
9079 -.frm-custom-field-group-layout:hover,
9080 -.frm-break-field-group:hover {
9081 - background-color: #f5f5f5f5;
9082 -}
9083 -
9084 -.frm-custom-field-group-layout svg,
9085 -.frm-break-field-group svg {
9086 - margin-right: 5px;
9087 -}
9088 -
9089 -#frm_field_multiselect_popup {
9090 - background: white;
9091 - height: 48px;
9092 - position: fixed;
9093 - border-radius: 4px;
9094 - box-shadow: 0px 8px 24px rgba(40, 47, 54, 0.15);
9095 - color: rgba(40, 47, 54, 0.85);
9096 - font-size: 13px;
9097 - right: 30px;
9098 - bottom: 10px;
9099 -}
9100 -
9101 -#frm_field_multiselect_popup > div {
9102 - display: inline-block;
9103 - line-height: 48px;
9104 - vertical-align: top;
9105 -}
9106 -
9107 -#frm_field_multiselect_popup.frm-unmergable > .frm-merge-fields-into-row,
9108 -#frm_field_multiselect_popup.frm-unmergable > .frm-multiselect-popup-separator {
9109 - display: none;
9110 -}
9111 -
9112 -#frm_field_multiselect_popup > div:not(.frm-multiselect-popup-separator) {
9113 - padding: 0 20px;
9114 - cursor: pointer;
9115 -}
9116 -
9117 -#frm_field_multiselect_popup > div:not(.frm-multiselect-popup-separator):hover {
9118 - background: #f5f5f5f5;
9119 -}
9120 -
9121 -.frm-builder-popup-heading {
9122 - font-weight: 600;
9123 - font-size: 11px;
9124 - line-height: 15px;
9125 - text-transform: uppercase;
9126 - color: rgba(40, 47, 54, 0.45);
9127 - margin-bottom: 7px;
9128 -}
9129 -
9130 -.frm-builder-popup-subheading {
9131 - font-size: 12px;
9132 - line-height: 16px;
9133 - color: rgba(40, 47, 54, 0.45);
9134 -}
9135 -
9136 -#frm_field_group_popup input[type="text"] {
9137 - height: 30px;
9138 - border-radius: 3px;
9139 - font-size: 14px;
9140 - padding: 8px;
9141 - color: rgba(84, 95, 110, 1);
9142 - border-color: rgba(40, 47, 54, 0.2);
9143 -}
9144 -
9145 -.frm-multiselect-popup-separator {
9146 - height: 36px;
9147 - width: 1px;
9148 - position: relative;
9149 - top: 6px;
9150 - background: #C4C4C4;
9151 -}
9152 -
9153 -.frm-sortable-helper,
9154 -.frm-multiselect-key-is-down li.form-field:not(.edit_field_type_divider) {
9155 - pointer-events: none;
9156 -}
9157 -
9158 -.frm-sortable-helper {
9159 - /* Make sure the item being dragged appears above other form builder fields */
9160 - z-index: 99;
9161 -}
9162 -
9163 -#frm_banner {
9164 - width: 100%;
9165 - color: #fff;
9166 - background: var(--primary-500);
9167 - height: 40px;
9168 - line-height: 40px;
9169 - text-align: center;
9170 - position: relative;
9171 -}
9172 -
9173 -.frm-banner-emoji {
9174 - font-size: 19px;
9175 -}
9176 -
9177 -.frm-banner-emoji,
9178 -.frm-banner-title {
9179 - margin-right: 5px;
9180 - vertical-align: top;
9181 -}
9182 -
9183 -.frm-banner-cta a {
9184 - text-decoration: underline !important;
9185 -}
9186 -
9187 -.frm-banner-dismiss {
9188 - cursor: pointer;
9189 - position: absolute;
9190 - right: 10px;
9191 - top: 50%;
9192 - transform: translateY( -50% );
9193 -}
9194 -
9195 -.frm-banner-dismiss .frmsvg {
9196 - vertical-align: top;
9197 -}
9198 -
9199 -.frm-ready-made-solution:not(.frm-search-result) {
9200 - display: none !important;
9201 -}
9202 -
9203 -#frm_new_form_modal .frm-ready-made-solution {
9204 - padding: var(--gap-xs) !important;
9205 - margin: var(--gap-xs) 0 var(--gap-sm);
9206 - display: flex;
9207 - gap: var(--gap-sm);
9208 - position: relative;
9209 - overflow: visible !important;
9210 -}
9211 -
9212 -#frm_new_form_modal .frm-ready-made-solution:after {
9213 - width: 100%;
9214 - height: 1px;
9215 - background: var(--grey-300);
9216 - content: '';
9217 - position: absolute;
9218 - bottom: -10px;
9219 - left: 0;
9220 -}
9221 -
9222 -#frm_new_form_modal .frm-ready-made-solution.frm-search-result:last-of-type::after {
9223 - content: none;
9224 -}
9225 -
9226 -#frm_new_form_modal .frm-solution-details {
9227 - flex: 1;
9228 - display: flex;
9229 - gap: var(--gap-2xs);
9230 - flex-direction: column;
9231 -}
9232 -
9233 -#frm_new_form_modal .frm-ready-made-solution > div:first-child {
9234 - width: 30%;
9235 - text-align: center;
9236 -}
9237 -
9238 -#frm_leave_email_wrapper {
9239 - position: relative;
9240 - margin: 0 auto;
9241 -}
9242 -
9243 -#frm_new_form_modal #frm_leave_email_wrapper {
9244 - width: 600px;
9245 -}
9246 -
9247 -#frm_leave_email_wrapper .frmsvg {
9248 - top: 0;
9249 -}
9250 -
9251 -#frm_leave_email_error {
9252 - position: absolute;
9253 - right: 71px;
9254 - top: 7px;
9255 - color: #973937;
9256 -}
9257 -
9258 -.frm-ready-made-solution h3 ~ a {
9259 - color: var(--primary-500);
9260 -}
9261 -
9262 -.frm-ready-made-solution img {
9263 - max-width: 100%;
9264 - display: block;
9265 - box-shadow: var(--box-shadow-lg);
9266 -}
9267 -
9268 -/* On Submit action */
9269 -.frm_single_on_submit_settings .frm_form_field {
9270 - margin: 8px 0;
9271 -}
9272 -
9273 -.frm_on_submit_type_setting {
9274 - padding: 8px 0;
9275 -}
9276 -
9277 -.frm_on_submit_type label {
9278 - display: flex;
9279 - border: 1px solid var(--grey-border);
9280 - border-radius: var(--small-radius);
9281 - gap: 16px;
9282 - padding: 16px;
9283 - align-items: center;
9284 - justify-content: center;
9285 -}
9286 -
9287 -.frm_on_submit_type input {
9288 - opacity: 0 !important;
9289 - position: absolute;
9290 - z-index: -1;
9291 -}
9292 -
9293 -.frm_on_submit_type input[type="radio"]:checked + label {
9294 - border-color: var(--primary-color);
9295 - box-shadow: 0 0 0 1px var(--primary-color);
9296 -}
9297 -
9298 -#form_settings_page .frm_on_submit_type label:hover,
9299 -.frm_on_submit_type input[type="radio"]:checked + label svg {
9300 - color: var(--primary-color);
9301 -}
9302 -/* End On Submit action */