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