PluginProbe ʕ •ᴥ•ʔ
JetFormBuilder — Dynamic Blocks Form Builder / 1.2.4
JetFormBuilder — Dynamic Blocks Form Builder v1.2.4
3.6.3.1 3.6.3 3.6.2.2 3.6.2.1 3.6.2 3.6.1.1 3.6.1 3.6.0.1 trunk 1.0.0 1.0.1 1.0.2 1.0.3 1.1.0 1.1.1 1.1.2 1.1.3 1.1.4 1.1.5 1.1.6 1.1.7 1.2.0 1.2.1 1.2.2 1.2.3 1.2.4 1.2.5 1.2.6 1.2.7 1.3.0 1.3.1 1.3.2 1.3.3 1.4.0 1.4.1 1.4.2 1.4.3 1.5.0 1.5.1 1.5.2 1.5.3 1.5.4 1.5.5 2.0.0 2.0.1 2.0.2 2.0.3 2.0.4 2.0.5 2.0.6 2.1.0 2.1.1 2.1.10 2.1.11 2.1.2 2.1.3 2.1.4 2.1.5 2.1.6 2.1.7 2.1.8 2.1.9 3.0.0 3.0.0.1 3.0.0.2 3.0.0.3 3.0.1 3.0.1.1 3.0.2 3.0.3 3.0.4 3.0.5 3.0.6 3.0.7 3.0.8 3.0.9 3.1.0 3.1.0.1 3.1.1 3.1.2 3.1.3 3.1.4 3.1.5 3.1.6 3.1.7 3.1.8 3.1.9 3.2.0 3.2.1 3.2.2 3.2.3 3.3.0 3.3.1 3.3.2 3.3.3 3.3.3.1 3.3.4 3.3.4.1 3.3.4.2 3.4.0 3.4.1 3.4.2 3.4.3 3.4.4 3.4.5 3.4.5.1 3.4.5.2 3.4.6 3.4.7 3.4.7.1 3.5.0 3.5.1 3.5.1.1 3.5.1.2 3.5.2 3.5.2.1 3.5.3 3.5.4 3.5.5 3.5.6 3.5.6.1 3.5.6.2 3.5.6.3 3.6.0
jetformbuilder / assets / css / editor.css
jetformbuilder / assets / css Last commit date
admin 5 years ago editor.css 5 years ago frontend.css 5 years ago icons.css 5 years ago
editor.css
700 lines
1 :root {
2 --jet-fb__range-field-slider--size: 18px;
3 --jet-fb__range-field-range--height: 4px;
4 }
5
6 .jet-form-builder {
7 background: #fff;
8 margin: 20px 0 0 0;
9 padding: 0;
10 border: 1px solid #ccd0d4;
11 }
12
13 .jet-form-builder > .components-drop-zone__provider {
14 display: flex;
15 justify-content: space-between;
16 min-height: 60vh;
17 flex-wrap: wrap;
18 }
19
20 .jet-form-builder__sidebar {
21 flex: 0 0 30%;
22 order: 2;
23 border-left: 1px solid #e2e4e7;
24 }
25
26 .jet-form-builder__content,
27 .editor-styles-wrapper {
28 flex: 0 0 65%;
29 padding: 10px 0 35px;
30 order: 1;
31 }
32
33 .block-editor-block-contextual-toolbar:not([data-align="wide"]):not([data-align="full"]) .block-editor-block-mover:not(.is-horizontal).is-visible {
34 opacity: 1;
35 }
36
37 .editor-styles-wrapper .block-editor-block-list__block {
38 min-height: 45px;
39 }
40
41 .jet-form-builder .editor-post-title__block {
42 padding-left: 40px;
43 }
44
45 .block-editor-block-list__layout.is-root-container {
46 padding-left: 40px;
47 }
48
49 .jet-form-builder__header {
50 width: 100%;
51 flex: 0 0 100%;
52 box-sizing: border-box;
53 display: flex;
54 padding: 0 40px 0 6px;
55 justify-content: space-between;
56 align-items: center;
57 border-bottom: 1px solid #e2e4e7;
58 height: 60px;
59 }
60
61 .jet-form-toggle-box {
62 padding: 0 12px;
63 }
64
65 .jet-form-toggle-box .components-base-control__field {
66 margin: 0;
67 }
68
69 .jet-form-action {
70 margin-bottom: 10px;
71 }
72
73 .jet-form-action:first-child {
74 margin-top: 15px;
75 }
76
77 .jet-form-action .components-base-control__field {
78 margin: 0;
79 }
80
81 .jet-form-edit-modal .components-base-control__field {
82 display: flex;
83 padding: 12px 0 5px;
84 border-top: 1px solid #ddd;
85 }
86
87 .jet-form-edit-modal .components-flex__item {
88 flex: 0 0 150px;
89 max-width: 150px;
90 }
91
92 .jet-form-edit-modal .jet-post-field-control .components-base-control:nth-child(2) .components-select-control .components-flex__item {
93 display: none;
94 }
95
96 .jet-form-edit-modal .fields-map-control .components-base-control__field {
97 border: none;
98 padding: 0 0 5px 0;
99 }
100
101 .jet-form-edit-modal .components-base-control:first-child .components-base-control__field {
102 border-top: none;
103 padding-top: 0;
104 }
105
106 .jet-form-edit-modal .components-base-control__label {
107 flex: 0 0 200px;
108 max-width: 157px;
109 }
110
111 .jet-form-edit-modal .components-base-control .components-base-control__label {
112 padding: 6px 8px 0 0;
113 }
114
115 .jet-form-editor__macros-wrap {
116 position: relative;
117 }
118
119 .jet-form-edit-modal .jet-form-editor__macros-wrap .components-base-control .components-base-control__field {
120 padding-top: 12px;
121 border-top: 1px solid #ddd;
122 }
123
124 .jet-form-edit-modal .jet-user-meta__row {
125 display: flex;
126 }
127
128 .jet-form-edit-modal .jet-user-meta__row .jet-field-map__row-label {
129 flex: 1 1 30%;
130 }
131
132 .jet-form-edit-modal .jet-user-meta__row .components-base-control {
133 flex: 1 1 40%;
134 }
135
136 .jet-form-editor__macros-trigger {
137 height: 36px;
138 min-height: 36px;
139 }
140
141 .jet-form-editor__macros-inserter {
142 position: absolute;
143 right: 1px;
144 top: 14px;
145 z-index: 20;
146 background: whitesmoke;
147 }
148
149 .jet-form-dynamic-preset {
150 display: flex;
151 align-items: flex-start;
152 position: relative;
153 }
154
155 .jet-form-dynamic-preset .components-base-control {
156 width: 100%;
157 }
158
159 .jet-form-dynamic-preset .components-base-control__field textarea {
160 padding-right: 36px;
161 width: calc(100% - 31px);
162 }
163
164 .jet-form-dynamic-preset .components-base-control__field input {
165 padding-right: 28px;
166 }
167
168 .jet-form-dynamic-preset__trigger {
169 width: 31px;
170 height: 31px;
171 box-sizing: border-box;
172 display: flex;
173 align-items: center;
174 justify-content: center;
175 border-radius: 0 2px 2px 0;
176 border: 1px solid #757575;
177 margin: 26px 0 0 0;
178 cursor: pointer;
179 position: absolute;
180 right: 0;
181 top: 0;
182 z-index: 20;
183 }
184
185 .jet-form-dynamic-preset__trigger.trigger__textarea {
186 margin-top: unset;
187 border-radius: 0 0 0 5px;
188 border-width: 0 0 1px 1px;
189 background-color: white;
190 top: 1px;
191 right: 1px;
192 }
193
194 .jet-form-dynamic-preset__trigger:not(.trigger__textarea) {
195 border-left-width: 0;
196 }
197
198 .jet-form-dynamic-preset__trigger:hover svg path {
199 fill: #007cba;
200 fill: var(--wp-admin-theme-color);
201 }
202
203 .jet-form-dynamic-preset__trigger svg {
204 width: 50%;
205 }
206
207 .jet-form-builder__flex-controls {
208 display: flex;
209 }
210
211 .jet-form-builder__flex-controls .repeater-item-column label {
212 flex: 0 0 1em;
213 margin-right: 1em;
214 }
215
216 .jet-form-builder__flex-controls .repeater-item-column input {
217 margin-right: 1em;
218 }
219
220 .field-mime-types.field-mime-types select[multiple] {
221 height: 7rem;
222 }
223
224 .field-mime-types.field-mime-types svg {
225 display: none;
226 }
227
228 .jet-user-meta-rows {
229 flex: 0 0 40%;
230 }
231
232 .jet-user-fields-map__list {
233 flex: 0 0 40%;
234 padding-top: 0.5em;
235 }
236
237 .jet-user-fields-map__list .components-flex__item {
238 flex: 2;
239 }
240
241 .jet-user-fields-map__list .components-input-control__container {
242 flex: 5;
243 }
244
245 .block-editor-block-list__block[data-type="jet-forms/form-break-field"] {
246 max-width: 100%;
247 margin-top: 28px;
248 margin-bottom: 28px;
249 }
250
251 .block-editor-block-list__block[data-type="jet-forms/group-break-field"] {
252 margin-top: 28px;
253 margin-bottom: 28px;
254 }
255
256 .block-editor-block-list__block[data-type="jet-forms/repeater-field"],
257 .block-editor-block-list__block[data-type="jet-forms/conditional-block"],
258 .block-editor-block-list__block[data-type^="jet-forms/"] .inside-block-options {
259 padding: 20px;
260 background: #fff;
261 -webkit-box-shadow: 0 2px 4px rgba(22, 43, 64, .1);
262 box-shadow: 0 2px 4px rgba(22, 43, 64, .1);
263 -webkit-transition: .3s all;
264 -o-transition: .3s all;
265 transition: .3s all;
266 }
267
268 .block-editor-block-list__block[data-type^="jet-forms/"] .inside-block-options {
269 margin-bottom: 20px;
270 }
271
272 .block-editor-block-list__block[data-type="jet-forms/repeater-field"]:hover,
273 .block-editor-block-list__block[data-type="jet-forms/conditional-block"]:hover {
274 -webkit-box-shadow: 0 20px 20px rgba(22, 43, 64, .12);
275 box-shadow: 0 20px 20px rgba(22, 43, 64, .12);
276 -webkit-transition: .3s all;
277 -o-transition: .3s all;
278 transition: .3s all;
279 }
280
281
282 .jet-form-builder__next-page-wrap, .jet-form-builder__group-break {
283 display: block;
284 white-space: nowrap;
285 }
286
287 .jet-form-builder__next-page-wrap:before, .jet-form-builder__group-break:before {
288 content: "";
289 position: absolute;
290 bottom: 0;
291 left: 0;
292 right: 0;
293 border-top: 1px solid #ccc;
294 }
295
296 .jet-form-builder__next-page-wrap > span, .jet-form-builder__group-break > span {
297 font-size: 13px;
298 position: relative;
299 display: inline-block;
300 text-transform: uppercase;
301 font-weight: 600;
302 font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
303 color: #757575;
304 border-radius: 4px;
305 background: #fff;
306 padding: 6px 8px;
307 height: 24px;
308 }
309
310 .jet-form-edit-modal__content .input_with_button {
311 display: flex;
312 align-items: center;
313 justify-content: space-between;
314 }
315
316 .jet-form-edit-modal__content .components-base-control__field > .input_with_button {
317 width: 55%;
318 }
319
320 .jet-form-edit-modal__content .input_with_button .components-base-control {
321 margin-right: 1em;
322 }
323
324 .input_with_button select.components-select-control__input {
325 min-width: 26em;
326 }
327
328 .jet-form-builder__field-wrap.range-wrap fieldset.components-input-control__backdrop {
329 border: none;
330 }
331
332 .jet-form-builder__field-wrap.range-wrap .range-flex-wrap {
333 display: flex;
334 /*display: -webkit-box;*/
335 display: -ms-flexbox;
336 -webkit-box-align: center;
337 -ms-flex-align: center;
338 align-items: center;
339 }
340
341 /* Range */
342 .jet-form-builder__field-wrap.range-wrap .range-flex-wrap .components-input-control {
343 margin-right: auto;
344 }
345
346 /* Range Values */
347 .jet-form-builder__field-wrap.range-wrap .range-flex-wrap .jet-form-builder__field-value {
348 white-space: nowrap;
349 margin-left: 10px;
350 display: flex;
351 }
352
353 .jet-form-builder__field-wrap.range-wrap .range-flex-wrap .components-input-control__container {
354 background-color: rgba(255, 255, 255, 0);
355 }
356
357 .jet-form-builder__field-wrap.range-wrap {
358 width: 100%
359 }
360
361 .jet-form-builder__field-wrap.range-wrap input[type="range"] {
362 margin-right: 10px;
363 -webkit-appearance: none;
364 min-height: 18px;
365 border: 0;
366 }
367
368
369 .jet-form-builder__field-wrap.range-wrap input[type="range"], .jet-form-builder__field-wrap.range-wrap input[type="range"]:focus {
370 padding: 0;
371 background: transparent;
372 border: none;
373 border-radius: 0;
374 -webkit-box-shadow: none;
375 box-shadow: none;
376 outline: none
377 }
378
379 .jet-form-builder__field-wrap.range-wrap input[type="range"]::-webkit-slider-runnable-track {
380 width: 100%;
381 height: var(--jet-fb__range-field-range--height, 4px);
382 cursor: pointer;
383 /**
384 test
385 */
386 background: #e3ddd8;
387 -webkit-box-shadow: none;
388 box-shadow: none;
389 border: none
390 }
391
392 .jet-form-builder__field-wrap.range-wrap input[type="range"]::-moz-range-track {
393 width: 100%;
394 height: var(--jet-fb__range-field-range--height, 4px);
395 cursor: pointer;
396 background: #e3ddd8;
397 box-shadow: none;
398 border: none
399 }
400
401 .jet-form-builder__field-wrap.range-wrap input[type="range"]::-ms-track {
402 width: 100%;
403 height: var(--jet-fb__range-field-range--height, 4px);
404 cursor: pointer;
405 background: #e3ddd8;
406 box-shadow: none;
407 border: none;
408 color: transparent
409 }
410
411 .jet-form-builder__field-wrap.range-wrap input[type="range"]::-ms-fill-lower {
412 background: transparent
413 }
414
415 .jet-form-builder__field-wrap.range-wrap input[type="range"]::-ms-fill-upper {
416 background: transparent
417 }
418
419 .jet-form-builder__field-wrap.range-wrap input[type="range"]::-webkit-slider-thumb {
420 width: var(--jet-fb__range-field-slider--size, 18px);
421 height: var(--jet-fb__range-field-slider--size, 18px);
422 background: #ccc;
423 border-radius: 50%;
424 cursor: pointer;
425 -webkit-box-shadow: none;
426 box-shadow: none;
427 border: none;
428 margin-top: calc((var(--jet-fb__range-field-slider--size, 18px) - var(--jet-fb__range-field-range--height, 4px)) / -2);
429 -webkit-appearance: none
430 }
431
432 .jet-form-builder__field-wrap.range-wrap input[type="range"]::-moz-range-thumb {
433 width: var(--jet-fb__range-field-slider--size, 18px);
434 height: var(--jet-fb__range-field-slider--size, 18px);
435 background: #ccc;
436 border-radius: 50%;
437 cursor: pointer;
438 box-shadow: none;
439 border: none
440 }
441
442 .jet-form-builder__field-wrap.range-wrap input[type="range"]::-ms-thumb {
443 width: var(--jet-fb__range-field-slider--size, 18px);
444 height: var(--jet-fb__range-field-slider--size, 18px);
445 background: #ccc;
446 border-radius: 50%;
447 cursor: pointer;
448 box-shadow: none;
449 border: none
450 }
451
452 .jet-form-builder__submit-wrap {
453 display: -webkit-box;
454 display: -ms-flexbox;
455 display: flex;
456 align-items: flex-start;
457 -webkit-box-orient: vertical;
458 -webkit-box-direction: normal;
459 -ms-flex-direction: column;
460 flex-direction: column;
461 width: 100%
462 }
463
464 .jet-form-builder__field-wrap.range-wrap .components-input-control__backdrop[aria-hidden="true"] {
465 border-width: 0;
466 }
467
468 .jet-form-builder__field-settings .help-input {
469 margin-bottom: 2em;
470 font-size: 12px;
471 color: rgb(117, 117, 117);
472 }
473
474 .jet-form-edit-modal .jet-post-field-control {
475 display: flex;
476 position: relative;
477 }
478
479 .jet-form-edit-modal .jet-post-field-control .components-base-control__field {
480 padding: 0;
481 border: none;
482 }
483
484 .jet-form-edit-modal .jet-post-field-control .components-base-control:nth-child(2) {
485 position: absolute;
486 left: 25em;
487 }
488
489 .jet-field-map__row-label .fields-map__required {
490 color: red;
491 font-weight: 900;
492 }
493
494 .jet-form-load-button.components-button.loading i, .jet-form-validate-button.components-button.loading i {
495 animation: jet-form-editor-spin 2s infinite linear
496 }
497
498
499 .jet-form-validate-button.components-button i.dashicons:before {
500 content: "";
501 }
502
503 .jet-form-validate-button.components-button i.dashicons {
504 margin-right: 4px;
505 }
506
507 .jet-form-validate-button.components-button.is-valid i.dashicons:before {
508 content: "�
509 �";
510 color: #46b450
511 }
512
513 .jet-form-validate-button.components-button.is-invalid i.dashicons:before {
514 content: "";
515 color: #a00
516 }
517
518 @keyframes jet-form-editor-spin {
519 0% {
520 transform: rotate(0deg)
521 }
522 to {
523 transform: rotate(359deg)
524 }
525 }
526
527 .jet-form-edit-modal__content .description-controls {
528 color: #999;
529 display: block;
530 margin-bottom: 1.2em;
531 }
532
533 .jet-form-builder-row {
534 overflow: hidden;
535 display: block;
536 }
537
538 .rtl .jet-form-editor__macros-inserter {
539 left: 15px;
540 right: unset;
541 }
542
543 .rtl .jet-form-builder__field-wrap.range-wrap .range-flex-wrap .jet-form-builder__field-value {
544 margin-left: unset;
545 margin-right: 10px;
546 }
547
548 .jet-form-edit-modal__actions {
549 position: sticky;
550 bottom: 0;
551 margin: 20px -24px -24px;
552 padding: 18px 24px 20px;
553 background-color: #fff;
554 width: calc(100% + 48px);
555 border-top: 1px solid #ddd;
556 z-index: 100;
557 }
558
559 .jet-form-edit-modal.width-60 {
560 width: 60vw;
561 }
562
563 .jet-form-builder__repeater-component-item {
564 margin-bottom: 1.5em;
565 }
566
567 .jet-form-builder__repeater-component-item .repeater-item__content {
568 flex: 1 1 100%;
569 }
570
571 .jet-form-builder__repeater-component-item .repeater-item__remove {
572 flex: 1;
573 }
574
575 .jet-form-builder__repeater-component-item .repeater__item__header .repeater-action-button {
576 margin-right: 1em;
577 }
578
579 .jet-form-builder__repeater-component-item .repeater__item__header span.repeater-item-title {
580 font-size: 1.1em;
581 font-style: italic;
582 color: #8e8e8e;
583 }
584
585 .jet-form-edit-modal .input-with-button .components-input-control__container,
586 .jet-form-edit-modal .input-with-button .components-text-control__input {
587 width: 30em;
588 margin-right: 1em;
589 }
590
591 .jet-form-edit-modal .with-wrap .components-base-control__field {
592 flex-wrap: wrap;
593 }
594
595 .jet-form-edit-modal .margin-bottom--small {
596 margin-bottom: 0.7em;
597 }
598
599 select.components-select-control__input.components-select-control__input.components-select-control__input {
600 max-width: 100vw;
601 width: 100%;
602 line-height: 1.1;
603 padding: 1px 24px 1px 8px;
604 }
605
606 .jet-form-builder__calculated-field {
607 display: flex;
608 width: 100%;
609 }
610
611 .jet-form-action .components-card__body {
612 display: flex;
613 justify-content: space-between;
614 align-items: center;
615 }
616
617 .jet-form-action .components-card__body div:first-child {
618 flex: 0 0 50%;
619 }
620
621 .components-text-control__input {
622 margin: unset;
623 box-sizing: border-box;
624 }
625
626 .flex-column .components-base-control__field {
627 flex-direction: column;
628 }
629
630 .edit-post-sidebar .components-input-control.components-number-control {
631 margin-bottom: 2em;
632 }
633
634 .repeater-item__left-heading {
635 max-width: 85%;
636 word-break: break-all;
637 }
638
639 .jet-form-edit-modal__content {
640 padding-bottom: 0.5em;
641 }
642
643 .jet-label-overflow {
644 overflow: hidden;
645 text-overflow: ellipsis;
646 display: block;
647 white-space: nowrap;
648 }
649
650 .jet-control-clear .components-base-control__field {
651 padding-top: unset;
652 border-top: unset;
653 }
654
655 .jet-control-clear-full .components-base-control__field {
656 display: block;
657 padding: unset;
658 border-top: unset;
659 }
660
661 .jet-forms-checkbox-field p.components-base-control__help {
662 margin-top: -33px;
663 margin-left: 10vw;
664 }
665
666 .editor-styles-wrapper .wp-block.wp-block.wp-block {
667 max-width: 100%;
668 }
669
670 .editor-styles-wrapper p.components-base-control__help {
671 font-size: 12px;
672 line-height: 1.5;
673 margin: 1em 0;
674 }
675
676 .components-button.has-icon:not(.has-text) .dashicon.dashicon {
677 margin: unset;
678 }
679
680 .jet-form-builder-repeater__remove {
681 margin-top: 10px;
682 }
683
684 .interface-complementary-area-header.components-panel__header {
685 z-index: 100;
686 }
687
688 .jet-form-edit-modal .jet-inline-radio .components-radio-control__option:not(:nth-child(1)):not(:nth-child(2)) {
689 margin-left: 1em;
690 }
691 .jet-control-full {
692 padding: 12px 0 5px;
693 border-top: 1px solid #ddd;
694 }
695
696 .jet-border-unset.components-base-control div.components-base-control__field.components-base-control__field {
697 border-top: unset;
698 }
699
700