PluginProbe ʕ •ᴥ•ʔ
Everest Forms – Contact Form, Payment Form, Quiz, Survey & Custom Form Builder with AI / 1.9.9
Everest Forms – Contact Form, Payment Form, Quiz, Survey & Custom Form Builder with AI v1.9.9
3.5.2 3.5.1 3.5.0 3.4.8 3.4.7 3.4.6 1.1.0 1.1.1 1.1.2 1.1.3 1.1.4 1.1.5 1.1.5.1 1.1.6 1.1.7 1.1.8 1.1.9 1.2.0 1.2.1 1.2.2 1.2.3 1.2.4 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.4.0 1.4.1 1.4.2 1.4.3 1.4.4 1.4.5 1.4.6 1.4.7 1.4.8 1.4.9 1.5.0 1.5.1 1.5.10 1.5.2 1.5.3 1.5.4 1.5.5 1.5.6 1.5.7 1.5.8 1.5.9 1.6.0 1.6.1 1.6.2 1.6.3 1.6.4 1.6.5 1.6.6 1.6.6.1 1.6.7 1.7.0 1.7.0.1 1.7.0.2 1.7.0.3 1.7.1 1.7.2 1.7.2.1 1.7.2.2 1.7.3 1.7.4 1.7.5 1.7.5.1 1.7.5.2 1.7.6 1.7.7 1.7.7.1 1.7.7.2 1.7.8 1.7.9 1.8.0 1.8.0.1 1.8.1 1.8.2 1.8.2.1 1.8.2.2 1.8.2.3 1.8.3 1.8.4 1.8.5 1.8.6 1.8.7 1.8.8 1.8.9 1.9.0 1.9.0.1 1.9.1 1.9.2 1.9.3 1.9.4 1.9.4.1 1.9.5 1.9.6 1.9.7 1.9.8 1.9.9 2.0.0 2.0.0.1 2.0.1 2.0.2 2.0.3 2.0.3.1 2.0.4 2.0.4.1 2.0.5 2.0.6 2.0.7 2.0.8 2.0.8.1 2.0.9 3.0.0 3.0.0.1 3.0.1 3.0.2 3.0.3 3.0.3.1 3.0.4 3.0.4.1 3.0.4.2 3.0.5 3.0.5.1 3.0.5.2 3.0.6 3.0.6.1 3.0.7.1 3.0.8 3.0.8.1 3.0.9 3.0.9.1 3.0.9.2 3.0.9.3 3.0.9.4 3.0.9.5 3.1.0 3.1.1 3.1.2 3.2.0 3.2.1 3.2.2 3.2.3 3.2.4 3.2.5 3.2.6 3.3.0 3.4.0 3.4.1 3.4.2 3.4.2.1 3.4.3 3.4.4 3.4.5 trunk 1.0 1.0.1 1.0.2 1.0.3
everest-forms / assets / css / admin.scss
everest-forms / assets / css Last commit date
components 5 years ago jquery-confirm 8 years ago jquery-ui 8 years ago mixins 5 years ago perfect-scrollbar 7 years ago utility 5 years ago variables 5 years ago _animation.scss 6 years ago _backbone.scss 6 years ago _clearings.scss 6 years ago _colors.scss 5 years ago _confirm.scss 4 years ago _containers.scss 5 years ago _fonts.scss 5 years ago _grid.scss 5 years ago activation-rtl.css 3 years ago activation.css 3 years ago activation.css.map 5 years ago activation.scss 3 years ago admin-rtl.css 3 years ago admin.css 3 years ago admin.css.map 4 years ago admin.scss 3 years ago deactivation-feedback-rtl.css 3 years ago deactivation-feedback.css 3 years ago deactivation-feedback.scss 3 years ago everest-forms-rtl.css 3 years ago everest-forms.css 3 years ago everest-forms.css.map 4 years ago everest-forms.scss 3 years ago flatpickr-rtl.css 4 years ago flatpickr.css 4 years ago flatpickr.css.map 5 years ago flatpickr.scss 6 years ago menu-rtl.css 3 years ago menu.css 3 years ago menu.css.map 5 years ago menu.scss 3 years ago select2-rtl.css 4 years ago select2.css 4 years ago select2.css.map 5 years ago select2.scss 5 years ago
admin.scss
6260 lines
1 /**
2 * admin.scss
3 * General EverestForms admin styles.
4 */
5
6 /**
7 * Import
8 */
9 @import 'variables/variables';
10 @import 'mixins/mixins';
11 @import 'fonts';
12 @import 'animation';
13 @import 'clearings';
14 @import 'confirm';
15
16 // Components
17 @import 'components/badge', 'components/forms', 'components/buttons',
18 'components/card', 'components/table';
19
20 @import 'colors';
21 @import 'containers';
22 @import 'grid';
23
24 //Utilities
25 @import 'utility/display', 'utility/spacing', 'utility/border';
26
27 //Everest-forms icon
28 @font-face {
29 font-family: 'EverestForms';
30 src: url('../fonts/EverestForms.eot?5c6kq4');
31 src: url('../fonts/EverestForms.eot?5c6kq4#iefix') format('embedded-opentype'),
32 url('../fonts/EverestForms.ttf?5c6kq4') format('truetype'),
33 url('../fonts/EverestForms.woff?5c6kq4') format('woff'),
34 url('../fonts/EverestForms.svg?5c6kq4#EverestForms') format('svg');
35 font-weight: normal;
36 font-style: normal;
37 font-display: block;
38 }
39
40 /**
41 * Styling begins
42 */
43 .blockUI.blockOverlay {
44 @include loader();
45 }
46
47 // Loader
48 .evf-loading {
49 background: url(../images/icons/loader.svg);
50 background-size: 20px 20px;
51 display: inline-block;
52 visibility: hidden;
53 vertical-align: middle;
54 opacity: 0.7;
55 width: 20px;
56 height: 20px;
57 margin: 2px 0 0 5px;
58 float: right;
59
60 &.evf-loading-active {
61 visibility: visible;
62 -webkit-animation: rotating 1s linear infinite;
63 -moz-animation: rotating 1s linear infinite;
64 -ms-animation: rotating 1s linear infinite;
65 -o-animation: rotating 1s linear infinite;
66 animation: rotating 1s linear infinite;
67 }
68 }
69
70 /**
71 * Grid Styles
72 **/
73
74 .evf-form-row {
75 display: flex;
76 flex-wrap: wrap;
77 margin-left: -15px;
78 margin-right: -15px;
79 }
80
81 // Gutter for all col
82 .evf-form-col-4,
83 .evf-form-col-6 {
84 position: relative;
85 width: 100%;
86 padding-left: 15px;
87 padding-right: 15px;
88 }
89
90 .evf_addons_wrap {
91 p.refresh {
92 margin: 0 0 2em;
93 }
94
95 .wp-filter {
96 display: none;
97 }
98
99 .plugin-card {
100 .name,
101 .desc {
102 margin-right: 0;
103 }
104 .plugin-card-top {
105 padding: 20px;
106 min-height: 130px;
107
108 .plugin-desc {
109 overflow: hidden;
110 display: -webkit-box;
111 -webkit-line-clamp: 4;
112 -webkit-box-orient: vertical;
113 }
114
115 .plugin-icon {
116 border: 1px solid #eee;
117 }
118 }
119
120 .plugin-card-bottom {
121 .status {
122 text-align: left;
123 float: left;
124 clear: left;
125 width: 65%;
126 padding-top: 5px;
127 width: calc(100% - 180px);
128
129 span.status-label {
130 color: #666;
131
132 &.status-active {
133 color: #2a9b39;
134 }
135
136 &.status-inactive {
137 color: #a00;
138 }
139 }
140 }
141
142 .action-buttons {
143 float: right;
144 clear: right;
145 max-width: 180px;
146
147 &.upgrade-plan {
148 margin: 0 auto;
149 }
150 }
151 }
152 }
153
154 .plugin-card-update-failed {
155 .notice-error {
156 margin: 0;
157 padding: 9px 16px 8px;
158
159 .notice-dismiss {
160 padding: 17px;
161 }
162 }
163 }
164
165 @media screen and (max-width: 782px) {
166 .plugin-card {
167 .plugin-card-bottom {
168 .status {
169 padding-top: 9px;
170 }
171
172 .action-buttons {
173 .button.updating-message {
174 &::before,
175 &::after {
176 margin-top: -1px;
177 }
178 }
179 }
180 }
181 }
182
183 .plugin-card-update-failed {
184 .notice-error {
185 padding: 13px 20px;
186
187 .notice-dismiss {
188 padding: 21px;
189 }
190 }
191 }
192 }
193 }
194
195 .clear {
196 clear: both;
197 }
198
199 .wrap.everest-forms div.updated,
200 .wrap.everest-forms div.error {
201 margin-top: 10px;
202 }
203
204 /**
205 * Help Tip
206 */
207 .everest-forms-help-tip {
208 cursor: help;
209 color: #666;
210 display: inline-block;
211 font-size: 1.2em;
212 font-style: normal;
213 height: 16px;
214 line-height: 16px;
215 position: relative;
216 vertical-align: middle;
217 width: 16px;
218
219 &::after {
220 cursor: help;
221 @include icon_dashicons('\f223');
222 }
223 }
224
225 /**
226 * Notice info
227 */
228 .everest-forms-notice {
229 display: inline-block;
230 padding: 5px 15px;
231 margin-bottom: 15px;
232 border-radius: 4px;
233 min-width: 500px;
234
235 &::before {
236 content: '\f348';
237 font-size: 22px;
238 vertical-align: middle;
239 font-family: dashicons;
240 margin-right: 10px;
241 }
242
243 &.everest-forms-notice-info {
244 background: lighten($blue, 45%);
245 border: 1px solid $blue;
246
247 &::before {
248 color: $blue;
249 }
250 }
251
252 &.everest-forms-notice-success {
253 background: lighten($green, 40%);
254 border: 1px solid $green;
255
256 &::before {
257 color: $green;
258 }
259 }
260
261 &.everest-forms-notice-warning {
262 background: lighten($orange, 45%);
263 border: 1px solid $orange;
264
265 &::before {
266 color: $orange;
267 }
268 }
269
270 &.everest-forms-notice-danger {
271 background: lighten($red, 30%);
272 border: 1px solid $red;
273
274 &.everest-forms-notice-danger-text {
275 color: $red;
276 }
277
278 &::before {
279 color: $red;
280 }
281 }
282 }
283
284 .evf-handler-counter {
285 display: flex;
286
287 .evf-handler-counter__button {
288 background: $color_gray-light-skin;
289 width: 30px;
290 height: 30px;
291 display: flex;
292 align-items: center;
293 justify-content: center;
294 border: 1px solid $color_gray-lighten;
295
296 &.evf-handler-counter__button-minus {
297 border-radius: 3px 0 0 3px;
298 }
299
300 &.evf-handler-counter__button-plus {
301 border-radius: 0 3px 3px 0;
302 }
303
304 &.dashicons {
305 font-size: 20px;
306 }
307 }
308
309 .evf-handler-counter__input {
310 width: 80px;
311 border-radius: 0;
312
313 &::-webkit-outer-spin-button,
314 &::-webkit-inner-spin-button {
315 -webkit-appearance: none;
316 margin: 0;
317 }
318
319 &[type='number']='number'] {
320 -moz-appearance: textfield;
321 }
322 }
323 }
324
325 .everest-forms-text-info {
326 color: $blue;
327 }
328
329 .everest-forms-text-success {
330 color: $green;
331 }
332
333 .everest-forms-text-warming {
334 color: $orange;
335 }
336
337 .everest-forms-text-danger {
338 color: $red;
339 }
340
341 /**
342 * Help tip
343 */
344
345 h2 .everest-forms-help-tip {
346 margin-top: -5px;
347 margin-left: 0.25em;
348 }
349
350 img.help_tip {
351 margin: 0 0 0 9px;
352 vertical-align: middle;
353 }
354
355 .postbox img.help_tip {
356 margin-top: 0;
357 }
358
359 .postbox .everest-forms-help-tip {
360 margin: 0 0 0 9px;
361 }
362
363 /**
364 * Toggle class.
365 */
366 .everest-forms-show {
367 display: block;
368 }
369
370 .everest-forms-hidden {
371 display: none;
372 }
373
374 /**
375 * Core Styling
376 */
377 .everest-forms_page_evf-builder {
378 .evf-shortcode-field {
379 display: flex;
380
381 .widefat {
382 width: 100%;
383 }
384
385 .evf-copy-shortcode {
386 margin-left: 4px;
387 padding: 0 4px;
388 line-height: 1;
389 }
390 }
391 }
392
393 body.everest-forms-builder {
394 &.everest-forms_page_evf-builder {
395 #wpcontent {
396 padding-left: 0;
397 }
398 #wpfooter {
399 position: fixed;
400 padding: 11px 20px;
401 background: #f1f1f1;
402 border-top: 1px solid $color_gray-lighten;
403 }
404 }
405
406 @media screen and (max-width: 782px) {
407 &.everest-forms_page_evf-builder {
408 .auto-fold {
409 #wpcontent {
410 padding-left: 0;
411 }
412 }
413 }
414 }
415 }
416
417 .everest-forms-builder,
418 .everest-forms-builder-setup,
419 .everest-forms_page_evf-settings,
420 .everest-forms_page_evf-tools {
421 .everest-forms {
422 margin: 0;
423 }
424
425 #wpcontent {
426 padding-left: 0;
427 }
428 }
429
430 /**
431 * Welcome page.
432 */
433 .dashboard_page_evf-welcome {
434 #message {
435 &.updated {
436 display: none;
437 }
438 }
439 }
440
441 #everest-forms-welcome {
442 max-width: 760px;
443 border-radius: 4px;
444 margin: 3rem auto;
445 background: $color-white;
446 border: 1px solid $color_gray-lighten;
447 box-shadow: 0 2px 10px transparentize($color_gray-base, 0.9);
448
449 a {
450 text-decoration: none;
451
452 &:focus {
453 box-shadow: none;
454 outline: none;
455 }
456 }
457
458 p {
459 font-size: 1.25em;
460 color: $color_gray-base;
461 }
462
463 .eveverest-forms-welcome-header {
464 display: flex;
465 align-items: center;
466 justify-content: space-between;
467 padding: 1em;
468 border-bottom: 1px solid $color_gray-lighten;
469 }
470
471 .eveverest-forms-welcome-header__logo-wrap {
472 display: flex;
473 align-items: center;
474
475 .eveverest-forms-welcome-header__logo-icon {
476 margin-right: 16px;
477 padding-right: 16px;
478 border-right: 1px solid $color_gray-lighten;
479
480 svg {
481 display: block;
482 fill: $everestforms;
483 width: 24px;
484 height: 24px;
485 }
486 }
487
488 span {
489 font-size: 14px;
490 font-weight: 600;
491 }
492 }
493
494 .everest-forms-welcome-container {
495 text-align: center;
496
497 .everest-forms-welcome-container__header {
498 padding: 0 1em;
499
500 h2 {
501 font-size: 1.75em;
502 margin-top: 1.75em;
503 }
504
505 p {
506 margin-bottom: 1.5em;
507 }
508 }
509
510 .everest-forms-welcome-video {
511 cursor: pointer;
512 display: flex;
513 position: relative;
514 align-items: center;
515 justify-content: center;
516
517 .everest-forms-welcome-video__button {
518 border: none;
519 cursor: pointer;
520 font-size: 24px;
521 height: 40px;
522 width: 54px;
523 border-radius: 12px;
524 padding: 8px 15px;
525 position: absolute;
526 color: $color-white;
527 opacity: 0;
528 visibility: hidden;
529 transition: 0.25s ease;
530 background: transparentize($color_gray-base, 0.25);
531
532 svg {
533 height: 24px;
534 width: 224px;
535 }
536
537 &:hover {
538 background: $red;
539 visibility: visible;
540 opacity: 1;
541 }
542 }
543
544 img {
545 display: block;
546 max-width: 100%;
547
548 &:hover {
549 & + .everest-forms-welcome-video__button {
550 visibility: visible;
551 opacity: 1;
552 }
553 }
554 }
555 }
556
557 .everest-forms-welcome-container__action {
558 padding: 0 32px;
559 margin: 3rem 0;
560 display: flex;
561 justify-content: space-between;
562
563 .everest-forms-welcome-container__action-card {
564 padding: 1em;
565 margin: 0 1em;
566 width: 100%;
567 border-radius: 4px;
568 width: calc(50% - 38px);
569 border: 1px solid $color_gray-lighten;
570 transition: 0.3s ease;
571
572 .everest-forms-welcome-container__action-card-img {
573 svg {
574 height: 64px;
575 width: 64px;
576 }
577 }
578
579 .everest-forms-welcome-container__action-card-content {
580 h3 {
581 font-size: 1.23em;
582 margin-bottom: 0.5em;
583 }
584
585 p {
586 margin-top: 0.5em;
587 }
588 }
589
590 &:hover {
591 box-shadow: 0 2px 20px 0
592 transparentize($color_gray-base, 0.85);
593 }
594 }
595 }
596 }
597 }
598
599 /**
600 * Branding
601 */
602 .everest-forms_page_evf-builder,
603 .everest-forms_page_evf-settings,
604 .everest-forms_page_evf-entries,
605 .everest-forms_page_evf-tools {
606 select {
607 max-width: inherit;
608 }
609
610 .clearfix {
611 height: auto;
612 }
613
614 // Toggle switch.
615 .everest-forms-toggle-form {
616 width: 28px;
617 height: 16px;
618 float: left;
619 margin-top: 3px;
620 margin-right: 4px;
621 position: relative;
622
623 input[type='checkbox']='checkbox'] {
624 position: absolute;
625 top: 0;
626 bottom: 0;
627 width: 100%;
628 opacity: 0;
629 z-index: 1;
630
631 &:checked {
632 + .slider {
633 background-color: $green;
634
635 &::before {
636 transform: translateX(100%);
637 }
638 }
639 }
640 }
641
642 .slider {
643 cursor: pointer;
644 position: absolute;
645 top: 0;
646 left: 0;
647 right: 0;
648 bottom: 0;
649 transition: 0.4s;
650 background-color: #cdd0d2;
651
652 &::before {
653 content: '';
654 width: 12px;
655 height: 12px;
656 position: absolute;
657 left: 2px;
658 bottom: 2px;
659 transition: 0.4s;
660 background-color: $color-white;
661 }
662
663 &.round {
664 border-radius: 16px;
665
666 &::before {
667 border-radius: 50%;
668 }
669 }
670 }
671 }
672
673 .evf-toggle-section {
674 display: inline-block;
675
676 .evf-toggle-switch {
677 display: inline-flex;
678 position: relative;
679 line-height: 1;
680 margin-bottom: 0;
681 position: relative;
682
683 input {
684 top: 0;
685 left: 0;
686 margin: 0;
687 z-index: 1;
688 opacity: 0;
689 padding: 0;
690 width: 100%;
691 height: 100%;
692 border: none;
693 position: absolute;
694
695 &:checked {
696 + .evf-toggle-switch-wrap {
697 background-color: #11a0d2;
698 border: 2px solid #11a0d2;
699 border: 9px solid transparent;
700
701 &::before {
702 content: '';
703 height: 6px;
704 width: 2px;
705 background: #fff;
706 position: absolute;
707 left: 0;
708 top: 0;
709 transform: translateY(-50%);
710 }
711
712 &::after {
713 border: 2px solid transparent;
714 }
715 }
716
717 ~ .evf-toggle-switch-control {
718 background-color: #fff;
719 border-width: 0;
720 transform: translateX(18px) translateY(-50%);
721 }
722
723 &::before {
724 display: none;
725 }
726 }
727
728 &:focus {
729 + .evf-toggle-switch-wrap {
730 box-shadow: 0 0 0 2px #fff, 0 0 0 3px #6c7781;
731 }
732 }
733 }
734
735 .evf-toggle-switch-wrap {
736 width: 36px;
737 height: 18px;
738 display: inline-flex;
739 background-color: #fff;
740 border: 2px solid #6c7781;
741 border-radius: 9px;
742 transition: 0.2s background ease;
743 position: relative;
744 align-items: center;
745 justify-content: flex-end;
746
747 &::after {
748 content: '';
749 width: 4px;
750 height: 4px;
751 margin-right: 2px;
752 border-radius: 50%;
753 display: inline-block;
754 border: 2px solid $color_gray-normal;
755 }
756 }
757
758 .evf-toggle-switch-control {
759 display: block;
760 position: absolute;
761 top: 50%;
762 left: 4px;
763 width: 10px;
764 height: 10px;
765 border-radius: 50%;
766 transition: 0.1s transform ease;
767 background-color: #6c7781;
768 border: 5px solid #6c7781;
769 transform: translateY(-50%);
770 }
771 }
772
773 label.evf-toggle-label {
774 display: inline-block;
775 margin-bottom: 0;
776 margin-left: 4px;
777 }
778 }
779
780 .everest-forms-disabled {
781 opacity: 0.5;
782 pointer-events: none;
783 }
784
785 // Radio and checkbox list option
786 .everest-forms-checklist {
787 margin-bottom: 14px;
788
789 ul {
790 margin-bottom: 0;
791
792 label {
793 font-weight: normal;
794 margin-bottom: 0;
795 margin-top: 0;
796 }
797 }
798
799 &.everest-forms-checklist-inline {
800 ul {
801 display: flex;
802 flex-wrap: wrap;
803
804 li {
805 margin-right: 10px;
806 margin-bottom: 0;
807 }
808 }
809 }
810 }
811
812 .everest-forms-label-edit {
813 display: flex;
814 justify-content: space-between;
815
816 .dashicons {
817 color: $color_gray-light;
818 height: 24px;
819 width: 24px;
820 cursor: pointer;
821 flex: 0 0 24px;
822 margin: 4px;
823 border-radius: 3px;
824 display: flex;
825 align-items: center;
826 justify-content: center;
827 opacity: 0;
828 visibility: hidden;
829 }
830
831 &:hover,
832 &:active,
833 &:focus,
834 &:focus-within {
835 .dashicons {
836 visibility: visible;
837 opacity: 1;
838 }
839 }
840
841 input {
842 margin-right: 6px;
843 }
844 }
845
846 .everest-forms {
847 .loading-dot {
848 background: url(../images/icons/three-dots.svg);
849 opacity: 0.7;
850 width: 25px;
851 height: 10px;
852 display: inline-block;
853 vertical-align: middle;
854 background-size: 25px 10px;
855 }
856
857 .everest-forms-overlay {
858 width: 100%;
859 z-index: 99999;
860 overflow: hidden;
861 background: #f1f1f1;
862 position: absolute;
863 top: 0;
864 bottom: 0;
865 height: auto;
866 min-height: 100vh;
867
868 .everest-forms-overlay-content {
869 position: absolute;
870 top: 50%;
871 left: 0;
872 right: 0;
873 width: 128px;
874 height: 128px;
875 margin: 0 auto;
876 transform: translateY(-50%);
877
878 span.loading {
879 display: block;
880 font-size: 20px;
881 text-align: center;
882 letter-spacing: 0.05em;
883 }
884 }
885 }
886
887 nav.evf-nav-tab-wrapper {
888 padding: 0;
889 border: none;
890 display: flex;
891 margin: 0 0 1.5em;
892 position: relative;
893 border-bottom: none;
894 background-color: $everestforms;
895
896 a.nav-tab {
897 color: $color-white;
898 margin-left: 0;
899 display: block;
900 cursor: pointer;
901 font-size: 12px;
902 font-weight: 400;
903 line-height: 24px;
904 padding: 10px 30px;
905 border: none transparent;
906 background-color: transparent;
907 transition: 0.5s background-color ease-in-out;
908
909 span {
910 &.evf-nav-icon {
911 float: none;
912 width: auto;
913 height: auto;
914 display: block;
915 font-size: 32px;
916 text-align: center;
917
918 &::before {
919 @include iconbefore('\e001');
920 margin-right: 0;
921 }
922
923 &.general::before {
924 content: '\e001';
925 }
926
927 &.settings::before {
928 content: '\e002';
929 }
930
931 &.recaptcha::before {
932 content: '\e003';
933 }
934
935 &.email::before {
936 content: '\e006';
937 }
938
939 &.validation::before {
940 content: '\e910';
941 }
942
943 &.pdf-submission::before {
944 content: '\e023';
945 }
946
947 &.fields::before {
948 content: '\e00b';
949 }
950
951 &.payment,
952 &.payments {
953 &::before {
954 content: '\e01f';
955 }
956 }
957
958 &.integration,
959 &.integrations {
960 &::before {
961 content: '\e01e';
962 }
963 }
964
965 &.logs::before {
966 content: '\e02d';
967 }
968
969 &.import::before {
970 content: '\e02e';
971 }
972
973 &.export::before {
974 content: '\e02f';
975 }
976 &.permission::before {
977 content: '\e030';
978 }
979 &.evf-widget::before {
980 content: '\e902';
981 }
982 &.geolocation::before {
983 content: '\e900';
984 }
985 &.delete::before {
986 content: '\e906';
987 }
988 &.misc::before {
989 content: '\e911';
990 }
991 }
992 }
993
994 &.nav-tab-active {
995 margin-bottom: 0;
996 background-color: adjust-color($everestforms, $saturation: +20%, $lightness: +6%);
997
998 &:focus {
999 box-shadow: none;
1000 }
1001 }
1002
1003 &:focus {
1004 box-shadow: none;
1005 }
1006
1007 &:hover:not(.nav-tab-active) {
1008 background-color: adjust-color($everestforms, $saturation: -4%, $lightness: -4%);
1009 }
1010 }
1011 }
1012
1013 .everest-forms-tools,
1014 .everest-forms-settings {
1015 padding-left: 20px;
1016 padding-right: 20px;
1017
1018 h2 {
1019 font-size: 20px;
1020 }
1021
1022 .form-table {
1023 tr {
1024 border-bottom: 1px solid $color_gray-lighten;
1025
1026 &:first-child {
1027 border-top: 1px solid $color_gray-lighten;
1028 }
1029 }
1030
1031 th {
1032 padding-top: 31px;
1033
1034 .everest-forms-help-tip {
1035 margin: 0;
1036 transform: translateY(-50%);
1037 }
1038 }
1039
1040 td:not(.everest-forms-permissions) {
1041 padding: 25px 0;
1042 }
1043
1044 .forminp-radio-image {
1045 ul {
1046 margin: 0;
1047 display: flex;
1048
1049 li {
1050 margin-right: 30px;
1051
1052 label,
1053 img {
1054 display: block;
1055 }
1056
1057 img {
1058 margin-bottom: 15px;
1059 border: 2px solid $color_gray-lighten;
1060 }
1061 }
1062 }
1063 }
1064 }
1065 }
1066 }
1067 }
1068
1069 /**
1070 * Tabs
1071 */
1072 .everest-forms-tab {
1073 ul {
1074 display: flex;
1075 flex-wrap: wrap;
1076 margin: 0;
1077
1078 .everest-forms-tab-nav {
1079 display: inline-flex;
1080 margin: 0 8px 0 0;
1081
1082 .everest-forms-tab-nav-link {
1083 font-weight: 600;
1084 padding: 16px 8px;
1085 color: $color_gray-base;
1086 text-decoration: none;
1087 border-bottom: 2px solid transparent;
1088 }
1089
1090 &.active {
1091 .everest-forms-tab-nav-link {
1092 color: $everestforms;
1093 border-color: $everestforms;
1094 }
1095 }
1096 }
1097 }
1098 }
1099
1100 .everest-forms-setup {
1101 font-size: 14px;
1102 max-width: calc(100% - 32px);
1103 margin: 20px auto;
1104 background: $color-white;
1105
1106 @media (min-width: 960px) {
1107 max-width: 835px;
1108 }
1109
1110 @media (min-width: 1280px) {
1111 max-width: 1100px;
1112 }
1113
1114 a {
1115 &:focus {
1116 box-shadow: none;
1117 }
1118 }
1119
1120 .page-title-action {
1121 top: 0;
1122 margin-left: 16px;
1123 &:active{
1124 top:0;
1125 margin-left:16px;
1126 }
1127 }
1128
1129 .everest-forms-setup-header {
1130 display: flex;
1131 flex-wrap: wrap;
1132 align-items: center;
1133 padding: 0 16px;
1134 background-color: $color-white;
1135 border-bottom: 1px solid $color_gray-lighten;
1136
1137 @media only screen and (max-width: 768px) {
1138 padding-top: 16px;
1139 }
1140
1141 .everest-forms-logo {
1142 display: flex;
1143 flex-wrap: wrap;
1144 padding-right: 1em;
1145 border-right: 1px solid $color_gray-lighten;
1146 margin-right: 1em;
1147 }
1148
1149 h4 {
1150 margin: 0;
1151 }
1152
1153 .everest-forms-tab {
1154 margin-left: auto;
1155
1156 @media only screen and (max-width: 768px) {
1157 width: calc(100% + 32px);
1158 flex: 0 0 calc(100% + 32px);
1159 margin-top: 16px;
1160 margin-right: -16px;
1161 margin-left: -16px;
1162 border-top: 1px solid $color_gray-lighten;
1163 }
1164 }
1165 }
1166 }
1167
1168 /**
1169 * Template Setup
1170 **/
1171 .everest-forms {
1172 border-radius: 4px;
1173
1174 * {
1175 box-sizing: border-box;
1176 }
1177
1178 span {
1179 display: inline-block;
1180 }
1181
1182 .everest-forms-loader-overlay {
1183 background: transparentize($color_gray-dark, 0.25);
1184 position: fixed;
1185 left: 0;
1186 right: 0;
1187 top: 0;
1188 bottom: 0;
1189 z-index: 9;
1190
1191 .evf-loading {
1192 margin: 0 auto;
1193 position: absolute;
1194 left: 0;
1195 right: 0;
1196 top: 50%;
1197 transform: translateY(-50%);
1198 }
1199 }
1200
1201 .everest-forms-setup-form-name {
1202 padding: 15px 20px;
1203 border-bottom: 1px solid $color_gray-lighten;
1204
1205 .everest-forms-setup-name {
1206 margin-left: 40px;
1207 padding: 10px;
1208 height: 35px;
1209 width: 400px;
1210
1211 &.everest-forms-required {
1212 border-color: $red;
1213 box-shadow: 0 0 2px rgba(175, 0, 0, 0.8);
1214 }
1215 }
1216 }
1217
1218 .evf-setup-title {
1219 width: auto;
1220 font-size: 24px;
1221 line-height: 34px;
1222 font-weight: 600;
1223 color: $color_gray-dark;
1224 padding: 15px 20px 10px;
1225
1226 p.desc {
1227 font-weight: normal;
1228 }
1229 }
1230
1231 .evf-setup-templates {
1232 display: flex;
1233 flex-wrap: wrap;
1234 padding: 8px;
1235
1236 .evf-loading {
1237 margin: 80px auto;
1238 }
1239
1240 .evf-template {
1241 .everest-forms-screenshot {
1242 cursor: pointer;
1243 padding: 8px;
1244 margin: 0;
1245 min-height: auto;
1246 position: relative;
1247 border-radius: 4px;
1248 background: $color_gray-more-lighten;
1249
1250 @media only screen and (min-width: 1280px) {
1251 min-height: 280px;
1252 }
1253
1254 .everest-forms-badge {
1255 position: absolute;
1256 bottom: 16px;
1257 right: 16px;
1258 z-index: 1;
1259 }
1260
1261 .form-action {
1262 display: none;
1263 position: absolute;
1264 left: 0;
1265 right: 0;
1266 top: 50%;
1267 transform: translateY(-50%);
1268 z-index: 1;
1269
1270 .everest-forms-btn {
1271 &.everest-forms-btn-secondary {
1272 background: $color-white;
1273 }
1274
1275 &:last-child {
1276 margin-left: 8px;
1277 }
1278 }
1279 }
1280 }
1281
1282 img {
1283 display: block;
1284 width: 100%;
1285 }
1286
1287 .everest-forms-form-id-container {
1288 display: flex;
1289 flex-wrap: wrap;
1290 align-items: center;
1291 justify-content: space-between;
1292 position: relative;
1293
1294 .everest-forms-template-name {
1295 font-size: 16px;
1296 font-weight: 600;
1297 margin: 16px 0;
1298 color: $color_gray-base;
1299 text-decoration: none;
1300
1301 &:hover {
1302 color: $everestforms;
1303 }
1304 }
1305 }
1306
1307 &:hover {
1308 .everest-forms-screenshot::after {
1309 content: '';
1310 display: block;
1311 background: transparentize($color_gray-base, 0.5);
1312 position: absolute;
1313 top: 0;
1314 left: 0;
1315 bottom: 0;
1316 right: 0;
1317 }
1318
1319 .form-action {
1320 display: flex;
1321 align-items: center;
1322 justify-content: center;
1323 }
1324 }
1325
1326 &:nth-child(even) {
1327 float: right;
1328 }
1329
1330 .evf-template-overlay {
1331 position: absolute;
1332 background-color: rgba(0, 0, 0, 0.5);
1333 top: 0;
1334 left: 0;
1335 right: 0;
1336 bottom: 0;
1337 opacity: 0;
1338 visibility: hidden;
1339 transition: 0.5s background-color ease-in-out;
1340 color: $color-white;
1341 text-align: center;
1342 padding: 40% 0;
1343
1344 .evf-template-select {
1345 text-decoration: none;
1346 }
1347
1348 &.loading {
1349 .evf-button,
1350 .evf-button::before,
1351 .evf-button::after {
1352 background: $color-white;
1353 -webkit-animation: load1 1s infinite ease-in-out;
1354 animation: load1 1s infinite ease-in-out;
1355 width: 1em;
1356 height: 4em;
1357 padding: 0;
1358 border-radius: 0;
1359 }
1360 .evf-button {
1361 color: $color-white;
1362 text-indent: -9999em;
1363 margin: 0 auto;
1364 position: relative;
1365 font-size: 11px;
1366 -webkit-transform: translateZ(0);
1367 -ms-transform: translateZ(0);
1368 transform: translateZ(0);
1369 -webkit-animation-delay: -0.16s;
1370 animation-delay: -0.16s;
1371 }
1372 .evf-button::before,
1373 .evf-button::after {
1374 position: absolute;
1375 top: 0;
1376 content: '';
1377 }
1378 .evf-button::before {
1379 left: -1.5em;
1380 -webkit-animation-delay: -0.32s;
1381 animation-delay: -0.32s;
1382 }
1383 .evf-button::after {
1384 left: 1.5em;
1385 }
1386 @-webkit-keyframes load1 {
1387 0%,
1388 80%,
1389 100% {
1390 box-shadow: 0 0;
1391 height: 4em;
1392 }
1393 40% {
1394 box-shadow: 0 -2em;
1395 height: 5em;
1396 }
1397 }
1398 @keyframes load1 {
1399 0%,
1400 80%,
1401 100% {
1402 box-shadow: 0 0;
1403 height: 4em;
1404 }
1405 40% {
1406 box-shadow: 0 -2em;
1407 height: 5em;
1408 }
1409 }
1410 }
1411 }
1412
1413 &:hover .evf-template-overlay,
1414 .evf-template-overlay.loading {
1415 opacity: 1;
1416 visibility: visible;
1417 }
1418
1419 .evf-button {
1420 display: inline-block;
1421 padding: 15px 22px;
1422 background-color: $color-white;
1423 color: #000;
1424 font-size: 12px;
1425 text-transform: uppercase;
1426 border: none;
1427 border-radius: 100px;
1428 }
1429 }
1430 }
1431 }
1432
1433 /**
1434 * Form Setup
1435 */
1436 .everest-forms-builder-setup {
1437 #screen-meta-links {
1438 display: none;
1439 }
1440
1441 .jconfirm-everest-forms {
1442 .jconfirm-box {
1443 border-radius: 4px !important;
1444
1445 div.jconfirm-title-c {
1446 padding-bottom: 10px;
1447
1448 .jconfirm-icon-c {
1449 margin-bottom: 16px !important;
1450
1451 .dashicons {
1452 color: $color-white;
1453 font-size: 28px !important;
1454 height: 54px !important;
1455 width: 54px !important;
1456 border-radius: 50%;
1457 background: $red;
1458 line-height: 54px;
1459 }
1460 }
1461
1462 .jconfirm-title {
1463 font-size: 22px !important;
1464 font-weight: 600;
1465 }
1466 }
1467
1468 div.jconfirm-content {
1469 margin-bottom: 0 !important;
1470 }
1471 }
1472 }
1473
1474 .jconfirm-everest-forms-left {
1475 &.jconfirm-modern {
1476 .jconfirm-box {
1477 width: 500px !important;
1478 padding: 20px 30px 15px;
1479 border-radius: 4px !important;
1480
1481 .jconfirm-title-c {
1482 text-align: left;
1483 font-size: 20px;
1484 font-weight: 400;
1485 padding-bottom: 0;
1486 line-height: 1.8;
1487
1488 .jconfirm-icon-c {
1489 margin: 0;
1490 }
1491 }
1492
1493 .jconfirm-content {
1494 white-space: initial !important; // to avoid spacing issue on notice while installing addons
1495 text-align: left;
1496 margin-bottom: 0;
1497
1498 input[type='text']='text'] {
1499 margin: 5px 2px 2px;
1500 padding: 5px 10px;
1501
1502 &:focus {
1503 border-color: #007cba;
1504 box-shadow: 0 0 0 1px #007cba;
1505 }
1506 }
1507 }
1508
1509 .jconfirm-buttons {
1510 text-align: right;
1511
1512 .everest-forms-btn {
1513 font-weight: 400;
1514 text-transform: none;
1515 }
1516 }
1517 }
1518 }
1519 }
1520
1521 .everest-forms-recommend-addons {
1522 margin-top: 20px;
1523 padding-top: 16px;
1524 border-top: 2px solid $color_gray-more-lighten;
1525
1526 .bulk-action-notice {
1527 margin: 0 0 20px;
1528
1529 p {
1530 padding: 0;
1531 margin: 8px 0 !important;
1532 }
1533
1534 &.notice-error {
1535 .button-link {
1536 text-decoration: none;
1537 display: flex;
1538 align-items: center;
1539 margin-top: 8px;
1540
1541 .toggle-indicator {
1542 display: inline-flex;
1543 }
1544 }
1545
1546 .bulk-action-errors {
1547 margin-top: 0;
1548 }
1549 }
1550 }
1551
1552 .plugins-list-table {
1553 border-radius: 4px;
1554
1555 .plugin-status {
1556 float: right;
1557
1558 span {
1559 width: 20px;
1560 height: 20px;
1561 overflow: hidden;
1562 border-radius: 50%;
1563 position: relative;
1564 vertical-align: top;
1565 white-space: nowrap;
1566 text-indent: -9999px;
1567 display: inline-block;
1568 border: 2px solid $color_gray-lighten;
1569
1570 &.active,
1571 &.activate-now {
1572 &::after {
1573 position: absolute;
1574 left: 50%;
1575 top: 50%;
1576 opacity: 1;
1577 width: 34%;
1578 height: 50%;
1579 content: '';
1580 transform-origin: left top;
1581 border-top: 2px solid $color_gray-lighten;
1582 border-right: 2px solid $color_gray-lighten;
1583 transform: scaleX(-1) rotate(135deg)
1584 translate(-58%, -40%);
1585 }
1586 }
1587
1588 &.activate-now {
1589 border-color: $color_gray-lighten;
1590
1591 &.updating-message {
1592 border-color: $color_gray-lighten;
1593 border-left-color: $green;
1594 }
1595 }
1596
1597 &.active {
1598 border-color: $green;
1599
1600 &::after {
1601 border-top: 2px solid $green;
1602 border-right: 2px solid $green;
1603 }
1604 }
1605
1606 &.updating-message {
1607 border-left-color: $green;
1608 animation: spin 0.75s linear infinite;
1609
1610 &::after {
1611 content: none;
1612 }
1613 }
1614 }
1615 }
1616 }
1617
1618 .everest-forms-template-install-addon {
1619 margin-top: 20px;
1620 }
1621 }
1622
1623 .everest-forms {
1624 .evf-setup-templates {
1625 .evf-template {
1626 width: 100%;
1627 background: $color-white;
1628 border-radius: 4px;
1629 position: relative;
1630 margin: 12px;
1631
1632 @media (min-width: 400px) {
1633 width: calc(50% - 24px);
1634 flex: 0 0 calc(50% - 24px);
1635 }
1636
1637 @media only screen and (min-width: 768px) {
1638 width: calc(33.333% - 24px);
1639 flex: 0 0 calc(33.333% - 24px);
1640 }
1641
1642 @media (min-width: 960px) {
1643 width: calc(25% - 24px);
1644 flex: 0 0 calc(25% - 24px);
1645 }
1646 }
1647 }
1648 }
1649 }
1650 // Entries page
1651 #evf-dashboard-analytisc-body {
1652 &::after,
1653 &::before {
1654 display: none;
1655 }
1656 }
1657 p.search-box {
1658 margin-top: 15px;
1659 }
1660
1661 #evf-dashboard-analytics {
1662 .evf-container {
1663 margin-left: 0;
1664 margin-right: 0;
1665 max-width: 100%;
1666 }
1667 }
1668
1669 /**
1670 * Form Builder
1671 **/
1672 #everest-forms-panel-settings {
1673 .evf-content-section {
1674 display: none;
1675 }
1676
1677 .evf-content-section.active {
1678 display: block;
1679 }
1680 }
1681
1682 #everest-forms-panel-payments,
1683 #everest-forms-panel-integrations {
1684 .evf-panel-content-section {
1685 display: none;
1686 }
1687
1688 .evf-panel-content-section.active {
1689 display: block;
1690 }
1691 }
1692
1693 .everest-forms_page_evf-builder {
1694 .everest-forms-add-fields-group,
1695 .everest-forms-field-option-group {
1696 .handlediv {
1697 float: right;
1698
1699 &::before {
1700 content: '\f142' !important;
1701 cursor: pointer;
1702 display: inline-block;
1703 font: 400 20px/1 Dashicons;
1704 line-height: 0.5 !important;
1705 padding: 4px;
1706 position: relative;
1707 right: 0;
1708 top: 0;
1709 }
1710 }
1711
1712 &.closed {
1713 .handlediv::before {
1714 content: '\f140' !important;
1715 }
1716 }
1717 }
1718
1719 #everest-forms-builder {
1720 width: 100%;
1721 position: absolute;
1722 top: 0;
1723 bottom: 0;
1724 min-height: calc(100vh - 32px);
1725
1726 * {
1727 box-sizing: border-box;
1728 }
1729
1730 .wp-picker-holder * {
1731 box-sizing: content-box;
1732 }
1733
1734 #everest-forms-builder-form {
1735 position: fixed;
1736 }
1737
1738 h2,
1739 h3,
1740 h4,
1741 h5,
1742 h6 {
1743 color: $color_gray-dark;
1744 }
1745
1746 a {
1747 text-decoration: none;
1748
1749 &:focus {
1750 outline: none;
1751 box-shadow: 0 0 0 rgba(0, 0, 0, 0);
1752 }
1753 }
1754
1755 .add,
1756 .remove,
1757 .addPayment,
1758 .removePayment {
1759 color: $color_gray-normal;
1760 background: $color-white;
1761 height: 30px;
1762 width: 30px;
1763 display: flex;
1764 align-items: center;
1765 justify-content: center;
1766 border-radius: 4px;
1767 border: 1px solid $color_gray-lighten;
1768
1769 &:hover {
1770 color: $color-white;
1771 }
1772 }
1773
1774 .add {
1775 &:hover {
1776 background: $blue;
1777 border-color: $blue;
1778 }
1779 }
1780
1781 .remove {
1782 margin-left: 8px;
1783
1784 &:hover {
1785 background: $red;
1786 border-color: $red;
1787 }
1788 }
1789
1790 .after-label-description {
1791 float: right;
1792 }
1793
1794 input,
1795 select,
1796 option,
1797 textarea {
1798 border-color: $color_gray-lighten;
1799
1800 &::placeholder {
1801 color: $color_gray-light;
1802 }
1803
1804 &:focus {
1805 border-color: #5b9dd9;
1806 }
1807 }
1808
1809 .everest-forms-inner-options {
1810 padding-left: 20px;
1811 }
1812
1813 .input-group-col-2 {
1814 display: flex;
1815 flex-wrap: nowrap;
1816
1817 input[type='text']='text'],
1818 input[type='number']='number'],
1819 select {
1820 flex: 0 0 50%;
1821 margin-right: 2%;
1822 margin-bottom: 10px;
1823 max-width: calc(50% - 1%);
1824
1825 &:nth-child(2n) {
1826 margin-right: 0;
1827 }
1828 }
1829 }
1830
1831 .everest-forms-nav-wrapper {
1832 background-color: $everestforms;
1833 display: flex;
1834 flex-wrap: wrap;
1835 align-items: center;
1836 justify-content: space-between;
1837
1838 nav.evf-nav-tab-wrapper {
1839 margin: 0;
1840 padding-right: 24px;
1841 flex: 1;
1842 }
1843
1844 .everest-forms-btn {
1845 &:focus {
1846 box-shadow: 0 0 0 3px
1847 adjust-color($everestforms, $saturation: 39%, $lightness: +18%);
1848 }
1849 }
1850
1851 .evf-forms-nav-right {
1852 padding: 21px 30px 19px;
1853
1854 .evf-shortcode-field {
1855 display: inline-block;
1856 vertical-align: middle;
1857
1858 input {
1859 margin: 0;
1860 width: 225px;
1861 height: 36px;
1862 padding: 4px 10px;
1863 line-height: 1.25;
1864 border-radius: 3px 0 0 3px;
1865 }
1866
1867 button {
1868 padding: 0;
1869 width: 36px;
1870 height: 36px;
1871 margin-left: -4px;
1872 border-radius: 0 3px 3px 0;
1873 background-color: lighten($everestforms, 7%);
1874
1875 &.copy-shortcode {
1876 font-size: 16px;
1877 color: $color-white;
1878
1879 &::before {
1880 @include iconbefore('\e00c');
1881 line-height: 27px;
1882 margin-right: 0;
1883 padding-right: 0;
1884 border-right: none;
1885 }
1886 }
1887
1888 &:focus {
1889 box-shadow: none;
1890 }
1891 }
1892 }
1893
1894 .everest-forms-save-button {
1895 min-width: 75px;
1896 cursor: pointer;
1897 min-height: 36px;
1898 color: $color-white;
1899 background: $green;
1900 margin-left: 10px;
1901 position: relative;
1902 display: inline-block;
1903 vertical-align: middle;
1904 text-transform: uppercase;
1905
1906 &.processing {
1907 width: 75px;
1908 font-size: 0;
1909 min-height: 36px;
1910 transition: all 0.35s ease 0s;
1911
1912 &:focus {
1913 box-shadow: 0 0 0 2px
1914 adjust-color($everestforms, $saturation: 39%, $lightness: +18%);
1915 }
1916 }
1917
1918 .loading-dot {
1919 position: absolute;
1920 top: 50%;
1921 transform: translateY(-50%);
1922 left: 0;
1923 right: 0;
1924 margin: 0 auto;
1925 }
1926
1927 .spinner,
1928 .evf-loading {
1929 width: 14px;
1930 height: 14px;
1931 margin-top: 5px !important;
1932 margin-left: 5px !important;
1933 background-size: 14px 14px;
1934 }
1935
1936 &:hover {
1937 background: darken($green, 10%);
1938 }
1939 }
1940
1941 .everest-forms-preview-button {
1942 background: $color-white;
1943 margin-left: 10px;
1944 display: inline-block;
1945 vertical-align: middle;
1946
1947 &:hover {
1948 background: transparentize($color-white, 0.1);
1949 }
1950 }
1951 }
1952 }
1953
1954 .evf-tab-content {
1955 h5 {
1956 margin: 0 auto 20px auto;
1957 font-size: 24px;
1958 line-height: normal;
1959 }
1960
1961 .evf_smart_tag {
1962 input[type='text']='text'] {
1963 width: calc(100% - 34px);
1964 min-height: 27px;
1965 }
1966 }
1967
1968 .evf-toggle-smart-tag-display {
1969 right: 0;
1970 width: 30px;
1971 min-height: 30px;
1972 color: $color_gray-base;
1973 position: absolute;
1974 background: $color-white;
1975 border: 1px solid $color_gray-lighten;
1976 border-radius: 4px;
1977 box-shadow: inset 0 1px 2px
1978 transparentize($color_gray-dark, 0.9);
1979
1980 .dashicons-editor-code {
1981 &::before {
1982 left: 0;
1983 right: 0;
1984 margin: 0 auto;
1985 line-height: 28px;
1986 position: absolute;
1987 }
1988 }
1989 }
1990
1991 .evf-smart-tag-lists {
1992 right: 0;
1993 z-index: 1;
1994 max-height: 123px;
1995 margin-top: -1px;
1996 width: 230px;
1997 overflow-y: auto;
1998 position: absolute;
1999 background: $color-white;
2000 border-radius: 4px;
2001 border: 1px solid $color_gray-lighten;
2002 box-shadow: 1px 3px 20px 0 transparentize($color_gray-dark, 0.8);
2003
2004 li,
2005 .smart-tag-title {
2006 padding: 7px 10px;
2007 }
2008
2009 .smart-tag-title {
2010 font-weight: 600;
2011 background: $color_gray-light-skin;
2012 border-bottom: 1px solid $color_gray-lighten;
2013 }
2014
2015 ul {
2016 margin: 0;
2017 }
2018
2019 li {
2020 cursor: pointer;
2021 margin-bottom: 0;
2022
2023 &:hover {
2024 background: $color_gray-light-skin;
2025 }
2026 }
2027 }
2028
2029 &.everest-forms-panel-field-textarea {
2030 .evf-smart-tag-lists {
2031 top: 40%;
2032 }
2033 }
2034
2035 .everest-forms-panel {
2036 width: 100%;
2037 display: none;
2038
2039 &.active {
2040 display: block;
2041 }
2042
2043 .everest-forms-sub-label {
2044 font-size: 12px;
2045 font-weight: 400;
2046 margin-bottom: 0;
2047 color: $color_gray-base;
2048 }
2049
2050 .everest-forms-panel-sidebar-content {
2051 display: flex;
2052
2053 .everest-forms-panel-content-wrap {
2054 width: calc(100% - 400px);
2055 }
2056 }
2057
2058 .everest-forms-one-half {
2059 float: left;
2060 width: 49%;
2061 margin-right: 2%;
2062
2063 &:nth-child(2) {
2064 margin-right: 0;
2065 }
2066 }
2067
2068 .everest-forms-field-row {
2069 margin: 0 0 10px 0;
2070 position: relative;
2071 }
2072
2073 .everest-forms-panel-sidebar {
2074 width: 400px;
2075 height: calc(100vh - 150px);
2076 position: relative;
2077 background-color: $color_gray-light-skin;
2078 border-right: 1px solid $color_gray-lighten;
2079
2080 .everest-forms-input-group {
2081 background-color: $color-white;
2082 border: 1px solid $input-border-color;
2083 border-radius: 4px;
2084
2085 .everest-forms-input-control {
2086 background: none;
2087 border-color: transparent !important;
2088 box-shadow: none;
2089
2090 &:focus {
2091 border-color: transparent;
2092 }
2093 }
2094
2095 &__text {
2096 background: none;
2097 border: none;
2098 }
2099
2100 &:focus-within {
2101 border: 1px solid $everestforms;
2102 box-shadow: 0 0 0 1px $everestforms;
2103 }
2104 }
2105
2106 .everest-forms-fields-not-found {
2107 text-align: center;
2108 margin-top: 2.85em;
2109
2110 .everest-forms-fields-not-found__title {
2111 font-size: 1.7em;
2112 }
2113 }
2114
2115 .everest-forms-add-fields-heading {
2116 display: block;
2117 font-size: 14px;
2118 font-weight: 600;
2119 margin-bottom: 15px;
2120 padding-bottom: 15px;
2121 color: $color_gray-dark;
2122 border-bottom: 1px solid $color_gray-lighten;
2123
2124 i {
2125 float: right;
2126 font-size: 14px;
2127 margin-left: 5px;
2128 line-height: 1.5;
2129 }
2130 }
2131
2132 .evf-registered-buttons {
2133 margin-right: -1.5%;
2134 margin-left: -1.5%;
2135 list-style: none;
2136 padding: 0;
2137 display: flex;
2138 flex-wrap: wrap;
2139 }
2140
2141 .evf-registered-item {
2142 margin-left: 1.5%;
2143 margin-right: 1.5%;
2144 padding: 20px 8px;
2145 border: 1px solid $color_gray-lighten;
2146 width: 30.3%;
2147 z-index: 999;
2148 margin-bottom: 10px;
2149 color: $color_gray-light;
2150 cursor: pointer;
2151 border-radius: 4px;
2152 font-size: 12px;
2153 transition: 0.5s color ease-in-out,
2154 0.5s border-color ease-in-out;
2155 text-align: center;
2156 background-color: $color-white;
2157
2158 .dashicons {
2159 display: block;
2160 margin: 0 auto;
2161 }
2162
2163 &.upgrade-modal,
2164 &.enable-stripe-model {
2165 opacity: 0.45;
2166 }
2167
2168 &:hover {
2169 color: $blue;
2170 border-color: $blue;
2171
2172 .evf-icon {
2173 color: inherit;
2174 }
2175
2176 svg {
2177 .cls-1,
2178 .cls-2,
2179 .cls-3 {
2180 fill: $blue;
2181 }
2182 }
2183 }
2184
2185 &:focus {
2186 outline: none;
2187 }
2188
2189 svg {
2190 width: 40px;
2191 height: 40px;
2192 display: block;
2193 margin: 0 auto 10px;
2194
2195 .cls-1,
2196 .cls-2,
2197 .cls-3 {
2198 fill: #414042;
2199 transition: 0.5s fill ease-in-out;
2200 font-size: 7px;
2201 font-weight: 300;
2202 }
2203 }
2204
2205 &.ui-draggable-dragging {
2206 margin: 0;
2207 width: 105px !important;
2208 background-color: $color-white;
2209 position: relative;
2210 z-index: 99999;
2211
2212 svg {
2213 .cls-1,
2214 .cls-2,
2215 .cls-3 {
2216 fill: $blue;
2217 }
2218 }
2219 }
2220 }
2221
2222 .evf-setting--checkbox,
2223 .evf-field-option--checkbox {
2224 input,
2225 label {
2226 width: auto;
2227 padding: 0;
2228 display: inline-block;
2229 vertical-align: top;
2230 height: auto;
2231 }
2232
2233 input {
2234 margin: 3px 5px 0 0;
2235 }
2236 }
2237
2238 .everest-forms-field-options {
2239 display: none;
2240
2241 .everest-forms-border-container {
2242 .everest-forms-field-option-row {
2243 &.everest-forms-field-option-row-date_format {
2244 > .inline {
2245 margin-left: 0;
2246 margin-right: 10px;
2247
2248 &:last-child {
2249 margin-right: 0;
2250 }
2251 }
2252 }
2253
2254 &:last-child {
2255 margin-bottom: 15px;
2256 }
2257 }
2258 }
2259
2260 .everest-forms-field-option-row {
2261 position: relative;
2262 margin-bottom: 15px;
2263
2264 &:last-child {
2265 margin-bottom: 0;
2266 }
2267
2268 .inline {
2269 margin-bottom: 0;
2270 display: inline-block;
2271 vertical-align: top;
2272 margin-left: 5px;
2273 }
2274
2275 .everest-forms-current-date-format,
2276 .everest-forms-past-date-disable-format,
2277 .everest-forms-min-max-date-format {
2278 margin-bottom: 14px;
2279 }
2280
2281 &.everest-forms-field-option-row-limit_controls,
2282 &.everest-forms-field-option-row-min_length_controls {
2283 display: flex;
2284 align-items: center;
2285
2286 input[type='number']='number'] {
2287 width: 30%;
2288 margin-right: 8px;
2289 }
2290
2291 select {
2292 min-height: 30px;
2293 }
2294
2295 &.everest-forms-hidden {
2296 display: none;
2297 }
2298 }
2299 }
2300
2301 .everest-forms-field-option {
2302 display: none;
2303
2304 // Email/Password Confirmation.
2305 &.everest-forms-confirm-disabled,
2306 &.everest-forms-field-option-email:not(.everest-forms-confirm-enabled),
2307 &.everest-forms-field-option-password:not(.everest-forms-confirm-enabled) {
2308 .everest-forms-field-option-row-sublabel_hide,
2309 .everest-forms-field-option-row-confirmation_placeholder {
2310 display: none;
2311 }
2312 }
2313 }
2314
2315 .everest-forms-field-option-phone {
2316 .format-selected-smart {
2317 display: none;
2318 }
2319
2320 .format-selected-default {
2321 .everest-forms-field-option-row {
2322 margin-bottom: 15px;
2323 }
2324 }
2325 }
2326
2327 .everest-forms-field-option-group {
2328 &.everest-forms-field-option-group-basic {
2329 .everest-forms-field-option-group-toggle {
2330 padding-top: 0;
2331 }
2332 }
2333
2334 &:last-child {
2335 .everest-forms-field-option-group-inner {
2336 border-bottom: none;
2337 }
2338 }
2339 }
2340
2341 .everest-forms-field-option-group-toggle {
2342 background-color: $color_gray-light-skin;
2343 border-bottom: 1px solid $color_gray-lighten;
2344 padding: 15px 0;
2345 font-size: 14px;
2346 font-weight: 600;
2347 display: block;
2348 color: $color_gray-dark;
2349 }
2350
2351 .everest-forms-field-option-group-inner {
2352 padding: 15px 0;
2353 border-bottom: 1px solid $color_gray-lighten;
2354 }
2355 }
2356
2357 .evf-panel-tab {
2358 display: flex;
2359 align-items: center;
2360 justify-content: space-between;
2361 padding: 15px 20px;
2362 font-size: 14px;
2363 font-weight: 600;
2364 color: $color_gray-dark;
2365 background-color: adjust-color($color_gray-more-lighten, $saturation: -1, $lightness: +2);
2366 border-bottom: 1px solid $color_gray-lighten;
2367
2368 .everest-forms-toggle-arrow {
2369 font-size: 14px;
2370 margin-left: auto;
2371 line-height: 1.4;
2372 }
2373
2374 &.active {
2375 position: relative;
2376 color: $everestforms;
2377 background-color: $color-white;
2378 }
2379 }
2380
2381 .everest-forms-active-connections,
2382 .everest-forms-active-email,.everest-forms-active-sms-notifications {
2383 display: none;
2384 padding: 0 20px;
2385 margin-top: -2px;
2386 background: $color-white;
2387 position: relative;
2388 border-bottom: 1px solid $color_gray-lighten;
2389
2390 &.active {
2391 display: flex;
2392 align-items: flex-end;
2393 flex-direction: column-reverse;
2394
2395 &.everest-forms-hidden {
2396 display: none;
2397 }
2398 }
2399
2400 .everest-forms-connections-add,
2401 .everest-forms-email-add {
2402 margin-bottom: 20px;
2403 }
2404
2405 .everest-forms-active-connections-list,
2406 .everest-forms-active-email-connections-list,
2407 .everest-forms-active-sms-notifications-connections-list {
2408 width: 100%;
2409 padding: 20px;
2410 display: flex;
2411 flex-wrap: wrap;
2412 margin: 0 0 20px;
2413 border-radius: 4px;
2414 border: 1px solid $color_gray-lighten;
2415
2416 &.empty-list {
2417 display: none;
2418 }
2419
2420 h4 {
2421 margin-top: 0;
2422 }
2423
2424 li {
2425 width: 100%;
2426 display: flex;
2427 padding: 10px;
2428 cursor: pointer;
2429 margin-bottom: -1px;
2430 align-items: center;
2431 justify-content: space-between;
2432 transition: all 0.25s ease 0s;
2433 border: 1px solid $color_gray-lighten;
2434
2435 &.active-user {
2436 background: $color-white;
2437
2438 .user-nickname {
2439 color: $everestforms;
2440 transition: all 0.25s ease 0s;
2441 }
2442 }
2443
2444 &:hover {
2445 .user-nickname {
2446 color: $everestforms;
2447 }
2448 }
2449
2450 .user-nickname {
2451 color: $color_gray-base;
2452 font-weight: 600;
2453 }
2454
2455 .toggle-remove {
2456 color: $color_gray-base;
2457 cursor: pointer;
2458 position: relative;
2459 padding-left: 13px;
2460 transition: all 0.25s ease 0s;
2461
2462 &:hover {
2463 color: $red;
2464
2465 &::before,
2466 &::after {
2467 background: $red;
2468 }
2469 }
2470
2471 &::before,
2472 &::after {
2473 top: 50%;
2474 left: 3px;
2475 width: 2px;
2476 content: '';
2477 height: 10px;
2478 position: absolute;
2479 background: $color_gray-base;
2480 display: inline-block;
2481 transition: all 0.25s ease 0s;
2482 }
2483
2484 &::before {
2485 transform: translateY(-50%)
2486 rotate(45deg);
2487 }
2488
2489 &::after {
2490 transform: translateY(-50%)
2491 rotate(-45deg);
2492 }
2493 }
2494 }
2495 }
2496 }
2497 }
2498
2499 .everest-forms-field-option-date-time {
2500 .format-selected-date .everest-forms-time,
2501 .format-selected-time .everest-forms-date {
2502 display: none;
2503 }
2504 }
2505
2506 .everest-forms-field-captcha {
2507 .format-selected-math {
2508 font-size: 16px;
2509
2510 input {
2511 width: 70px;
2512 display: inline-block;
2513 }
2514 }
2515
2516 .format-selected-math .everest-forms-question,
2517 .format-selected-question .everest-forms-equation {
2518 display: none;
2519 }
2520 }
2521
2522 .everest-forms-field-option-address {
2523 .default,
2524 .placeholder {
2525 width: 44%;
2526 float: left;
2527 margin-right: 2%;
2528
2529 input {
2530 width: 99%;
2531 }
2532
2533 label {
2534 font-weight: 400;
2535 }
2536 }
2537
2538 .hide {
2539 input {
2540 margin: 7px 0 0 0;
2541 }
2542 }
2543 }
2544 }
2545
2546 .everest-forms-panel-content-wrap {
2547 .evf-admin-row {
2548 display: flex;
2549 position: relative;
2550 margin-bottom: 15px;
2551 background-color: transparent;
2552 border: 1px solid transparent;
2553 transition: 0.5s border, 0.5s background-color;
2554
2555 &:last-child {
2556 margin-bottom: 0;
2557 }
2558
2559 .evf-toggle-row {
2560 top: 0;
2561 right: 0;
2562 opacity: 0;
2563 display: flex;
2564 cursor: pointer;
2565 position: absolute;
2566 visibility: hidden;
2567 color: $color-white;
2568 transition: 0.7s all;
2569 z-index: 9999;
2570
2571 .evf-show-grid {
2572 &:hover {
2573 span {
2574 &.dashicons {
2575 background-color: $green;
2576 }
2577 }
2578 }
2579 }
2580
2581 .evf-delete-row {
2582 span {
2583 &.dashicons {
2584 border-right: 1px solid
2585 transparentize($color-white, 0.8);
2586 }
2587 }
2588
2589 &:hover {
2590 span {
2591 &.dashicons {
2592 background-color: $red;
2593 }
2594 }
2595 }
2596 }
2597
2598 .evf-duplicate-row {
2599 span {
2600 &.dashicons {
2601 border-radius: 0 0 0 3px;
2602 border-right: 1px solid
2603 transparentize($color-white, 0.8);
2604 }
2605 }
2606
2607 &:hover {
2608 span {
2609 &.dashicons {
2610 background-color: $blue;
2611 }
2612 }
2613 }
2614 }
2615
2616 span {
2617 &.dashicons {
2618 background: $color_gray-base;
2619 font-size: 14px;
2620 height: auto;
2621 width: auto;
2622 color: $color-white;
2623 padding: 5px;
2624 }
2625 }
2626
2627 .evf-toggle-row-content {
2628 display: none;
2629 position: absolute;
2630 width: 160px;
2631 padding: 20px;
2632 text-align: center;
2633 right: -10px;
2634 border-radius: 5px;
2635 background-color: $color-white;
2636 font-weight: 600;
2637 font-size: 12px;
2638 top: 35px;
2639 transition: 0.9s background-color;
2640 border: 1px solid $color-gray-lighten;
2641 box-shadow: 1px 2px 10px 0
2642 transparentize($color_gray-dark, 0.85);
2643
2644 &::before,
2645 &::after {
2646 content: '';
2647 position: absolute;
2648 }
2649
2650 &::before {
2651 top: -7px;
2652 right: 14px;
2653 border-right: 7px solid transparent;
2654 border-bottom: 7px solid $color-white;
2655 border-left: 7px solid transparent;
2656 }
2657
2658 &::after {
2659 top: -8px;
2660 right: 12px;
2661 border-right: 9px solid transparent;
2662 border-bottom: 9px solid $color-gray-lighten;
2663 border-left: 9px solid transparent;
2664 z-index: -1;
2665 }
2666
2667 > span {
2668 color: $color_gray-base;
2669 display: block;
2670 }
2671
2672 small {
2673 color: $color_gray-light;
2674 margin-bottom: 10px;
2675 display: block;
2676 }
2677
2678 .evf-grid-selector {
2679 margin: 3px;
2680 width: 40px;
2681 height: 30px;
2682 display: inline-block;
2683 border: 1px solid $color_gray-lighten;
2684
2685 span {
2686 height: 100%;
2687 display: inline-block;
2688 background: $color-white;
2689
2690 &:nth-child(n + 1) {
2691 border-left: 1px solid
2692 $color_gray-lighten;
2693 }
2694 &:nth-child(1) {
2695 border-left: 0 none;
2696 }
2697 }
2698
2699 &.active {
2700 border-color: $blue;
2701
2702 span {
2703 border-color: $blue;
2704 }
2705 }
2706 }
2707 }
2708 }
2709
2710 &.evf-hover {
2711 background-color: lighten($blue, 48%);
2712 border: 1px dashed $blue;
2713
2714 .evf-admin-grid {
2715 border: 1px dashed $color-gray-light;
2716 }
2717
2718 .evf-toggle-row {
2719 opacity: 1;
2720 visibility: visible;
2721 }
2722 }
2723
2724 .evf-admin-grid {
2725 margin: 10px;
2726 padding: 10px;
2727 cursor: pointer;
2728 background: $color-white;
2729 position: relative;
2730 border: 1px solid transparent;
2731 transition: 0.5s border, 0.5s background-color;
2732
2733 &.evf-hover {
2734 &.evf-item-hover {
2735 position: relative;
2736
2737 .everest-forms-field,
2738 .evf-registered-item {
2739 &:nth-last-child(2) {
2740 margin-bottom: 0;
2741
2742 &.active {
2743 margin-bottom: 10px;
2744 }
2745 }
2746 }
2747
2748 &::before {
2749 display: none;
2750 }
2751 }
2752 }
2753
2754 &.evf-grid-1 {
2755 width: 100%;
2756 }
2757
2758 &.evf-grid-2 {
2759 width: 50%;
2760 }
2761
2762 &.evf-grid-3 {
2763 width: 33%;
2764 }
2765
2766 &.evf-grid-4 {
2767 width: 25%;
2768 }
2769
2770 .evf-registered-item {
2771 padding: 20px;
2772 font-size: 18px;
2773 min-height: 94px;
2774 margin-bottom: 10px;
2775
2776 &:last-child {
2777 margin-bottom: 0;
2778 }
2779
2780 &.ui-draggable {
2781 width: 100%;
2782
2783 .evf-icon {
2784 display: inline-block;
2785 }
2786 }
2787
2788 .evf-icon {
2789 font-size: 24px;
2790 vertical-align: middle;
2791 }
2792
2793 .spinner {
2794 float: none;
2795 width: 25px;
2796 height: 25px;
2797 margin: 10px 0 5px 10px;
2798 }
2799
2800 .dashicons {
2801 font-size: 22px;
2802 margin-top: 3px;
2803 }
2804 }
2805
2806 .ui-sortable-placeholder {
2807 width: 100%;
2808 visibility: visible !important;
2809 background-color: lighten($green, 42%);
2810 border: 1px dashed lighten($green, 15%);
2811 }
2812
2813 &.evf-empty-grid {
2814 display: flex;
2815 align-items: center;
2816 justify-content: center;
2817 position: relative;
2818 border: 1px dashed $color-gray-light;
2819
2820 &::before {
2821 content: '\f132';
2822 font-size: 40px;
2823 font-family: dashicons;
2824 line-height: 1.2;
2825 cursor: all-scroll;
2826 color: $color_gray-lighten;
2827 }
2828 }
2829 }
2830 }
2831
2832 .everest-forms-field-payment-single {
2833 .widefat,
2834 .item-price-hidden {
2835 display: none;
2836 }
2837 .item-price-hidden {
2838 margin: 0;
2839 color: #999;
2840 font-size: 12px;
2841 }
2842
2843 .format-selected-user {
2844 .widefat {
2845 display: block;
2846 }
2847 .item-price {
2848 display: none;
2849 }
2850 }
2851
2852 .format-selected-hidden {
2853 .item-price-hidden {
2854 display: block;
2855 }
2856 }
2857 }
2858
2859 .everest-forms-field {
2860 cursor: move;
2861 padding: 15px;
2862 position: relative;
2863 margin-bottom: 10px;
2864 border: 1px solid transparent;
2865 border-radius: 3px;
2866 transition: 0.5s box-shadow;
2867
2868 .everest-forms-image-choices {
2869 .everest-forms-image-choices-item {
2870 label {
2871 font-weight: normal;
2872 margin-bottom: 0;
2873 }
2874
2875 .everest-forms-image-choices-image {
2876 display: block;
2877 margin-bottom: 10px;
2878
2879 img {
2880 max-width: 100%;
2881 display: block;
2882 }
2883 }
2884 }
2885 }
2886
2887 // column layout for choice fields
2888 &.everest-forms-list-2-columns,
2889 &.everest-forms-list-3-columns {
2890 ul {
2891 display: flex;
2892 flex-wrap: wrap;
2893 margin-left: -15px;
2894 margin-right: -15px;
2895
2896 li {
2897 padding-left: 15px;
2898 padding-right: 15px;
2899 }
2900 }
2901 }
2902
2903 &.everest-forms-list-2-columns {
2904 li {
2905 flex: 0 0 50%;
2906 max-width: 50%;
2907
2908 &:nth-child(1n + 3) {
2909 margin-top: 10px;
2910 }
2911 }
2912 }
2913
2914 &.everest-forms-list-3-columns {
2915 li {
2916 flex: 0 0 33.333%;
2917 max-width: 33.333%;
2918
2919 &:nth-child(1n + 4) {
2920 margin-top: 10px;
2921 }
2922 }
2923 }
2924
2925 &.everest-forms-list-inline {
2926 ul {
2927 li {
2928 display: inline-block;
2929 margin-right: 15px;
2930 }
2931 }
2932 }
2933
2934 &:last-child {
2935 margin-bottom: 0;
2936 }
2937
2938 &.everest-forms-field--first,
2939 &.everest-forms-field--last {
2940 width: 48.5%;
2941 margin-right: 3%;
2942 float: left;
2943 }
2944
2945 &.everest-forms-field--last {
2946 margin-right: 0;
2947 float: right;
2948 }
2949
2950 &.active {
2951 margin: 0 0 10px;
2952 border: 1px solid $color_gray-lighten;
2953 background: $color_gray-light-skin;
2954
2955 .evf-field-action {
2956 opacity: 1;
2957 visibility: visible;
2958 }
2959
2960 &:last-child {
2961 margin-bottom: 0;
2962 }
2963 }
2964
2965 &.required label {
2966 .required {
2967 font-weight: 300;
2968 margin: 0 0 0 5px;
2969 display: inline-block;
2970 vertical-align: middle;
2971 }
2972 }
2973
2974 &.ui-sortable-placeholder {
2975 border: 1px dashed transparentize($blue, 0.75);
2976 }
2977
2978 &.label_hide {
2979 input[type='text']='text'] {
2980 margin-bottom: 0;
2981 }
2982
2983 .description {
2984 margin-top: 5px;
2985
2986 &:empty {
2987 margin-top: 0;
2988 }
2989 }
2990 }
2991
2992 input {
2993 &[type='text']='text'],
2994 &[type='email']='email'] {
2995 margin-bottom: 5px;
2996 }
2997
2998 &[type='checkbox']='checkbox'],
2999 &[type='radio']='radio'] {
3000 margin-right: 10px;
3001 }
3002 }
3003
3004 select,
3005 textarea {
3006 margin-bottom: 5px;
3007 }
3008
3009 select {
3010 option {
3011 color: inherit;
3012
3013 &.placeholder {
3014 opacity: 0.5;
3015 }
3016 }
3017
3018 &[multiple]] {
3019 padding: 6px 8px;
3020 box-shadow: none;
3021 }
3022 }
3023
3024 canvas {
3025 border: 1px solid rgba(222, 222, 222, 0.75);
3026 }
3027
3028 &.everest-forms-field-select {
3029 select:not([multiple]) {
3030 height: 35px;
3031 }
3032 }
3033
3034 .select2-container {
3035 margin-bottom: 5px;
3036 width: 100% !important;
3037
3038 span.selection {
3039 width: 100% !important;
3040 }
3041
3042 .select2-selection--multiple {
3043 border-color: $color_gray-lighten;
3044 }
3045
3046 .select2-selection__choice {
3047 margin: 4px 4px 0 0;
3048 }
3049
3050 .select2-search__field {
3051 min-height: 24px;
3052 line-height: 1.4;
3053 }
3054 }
3055
3056 .evf-field-action {
3057 position: absolute;
3058 top: 15px;
3059 right: 15px;
3060 visibility: hidden;
3061 opacity: 0;
3062 transition: 0.5s all;
3063
3064 a {
3065 padding: 5px;
3066 color: $color-white;
3067 background: $color_gray-base;
3068 border-right: 1px solid
3069 transparentize($color-white, 0.8);
3070
3071 &:first-child {
3072 border-radius: 3px 0 0 3px;
3073 }
3074
3075 &:last-child {
3076 border-radius: 0 3px 3px 0;
3077 border-right: none;
3078 }
3079
3080 &.everest-forms-field-delete:hover {
3081 background-color: $red;
3082 }
3083
3084 &:hover {
3085 background-color: $blue;
3086 }
3087 }
3088
3089 .dashicons {
3090 font-size: 15px;
3091 height: auto;
3092 width: auto;
3093 }
3094 }
3095
3096 &.label_hide {
3097 .label-title {
3098 display: none;
3099 }
3100 }
3101
3102 &.sublabel_hide {
3103 .everest-forms-sub-label {
3104 display: none;
3105 }
3106 }
3107
3108 .everest-forms-confirm-enabled {
3109 display: flex;
3110
3111 .everest-forms-confirm-primary,
3112 .everest-forms-confirm-confirmation {
3113 width: 50%;
3114 flex-wrap: wrap;
3115 }
3116
3117 .everest-forms-confirm-primary {
3118 padding-right: 15px;
3119 }
3120
3121 .everest-forms-confirm-confirmation {
3122 padding-left: 15px;
3123 }
3124 }
3125
3126 .everest-forms-confirm-disabled {
3127 .everest-forms-confirm-primary {
3128 .everest-forms-sub-label {
3129 display: none;
3130 }
3131 }
3132
3133 .everest-forms-confirm-confirmation {
3134 display: none;
3135 }
3136 }
3137
3138 &:hover {
3139 border: 1px solid $color_gray-lighten;
3140
3141 .evf-field-action {
3142 visibility: visible;
3143 opacity: 1;
3144 }
3145 }
3146
3147 &.ui-sortable-helper {
3148 padding: 20px 30px;
3149 height: auto !important;
3150 left: -20px;
3151 right: -20px;
3152 background-color: $color-white;
3153
3154 &:hover {
3155 .evf-field-action {
3156 display: none;
3157 }
3158 }
3159 }
3160
3161 label {
3162 cursor: all-scroll;
3163 }
3164 }
3165
3166 .file-uploader {
3167 width: 100%;
3168 border: 2px dashed $color_gray-lighten;
3169 background-color: $color_gray-light-skin;
3170 border-radius: 3px;
3171 cursor: pointer;
3172 text-align: center;
3173 padding-top: 30px;
3174 padding-bottom: 30px;
3175 position: relative;
3176
3177 svg {
3178 width: 30px;
3179 height: 30px;
3180 fill: #bbbcbd;
3181 margin-bottom: 20px;
3182 }
3183
3184 input {
3185 &.file-input {
3186 touch-action: manipulation;
3187 max-width: 100%;
3188 min-width: 14px;
3189 margin: 0;
3190 opacity: 0;
3191 height: 18px;
3192 }
3193 }
3194
3195 .drop {
3196 display: block;
3197 font-size: 14px;
3198 font-weight: 600;
3199 color: $color_gray-light;
3200 margin-bottom: 10px;
3201 }
3202
3203 .or {
3204 font-size: 12px;
3205 color: $color-gray-light;
3206 font-weight: 600;
3207 display: block;
3208 margin-bottom: 10px;
3209 }
3210
3211 .file-control {
3212 position: absolute;
3213 bottom: 30px;
3214 color: $blue;
3215 padding-bottom: 2px;
3216 display: block;
3217 left: 0;
3218 right: 0;
3219
3220 &::before {
3221 content: '';
3222 width: 45px;
3223 background-color: $blue;
3224 height: 1px;
3225 display: block;
3226 left: 50%;
3227 bottom: -2px;
3228 position: absolute;
3229 transform: translateX(-50%);
3230 }
3231 }
3232 }
3233
3234 .publishing-action {
3235 width: 100%;
3236 text-align: right;
3237 }
3238
3239 .submit-button {
3240 display: inline-block;
3241 font-size: 12px;
3242 font-weight: 600;
3243 color: $color-white;
3244 padding: 15px 20px;
3245 border: 0 none;
3246 background-color: $green;
3247 border-radius: 3px;
3248 }
3249 }
3250
3251 label {
3252 font-size: 13px;
3253 margin-bottom: 10px;
3254 color: $color_gray-base;
3255 display: block;
3256 font-weight: 600;
3257
3258 i {
3259 color: $color_gray-light;
3260 font-size: 16px;
3261 line-height: 1.2;
3262 }
3263
3264 .required {
3265 color: $red;
3266 display: none;
3267 }
3268
3269 input {
3270 &[type='checkbox']='checkbox'],
3271 &[type='radio']='radio'] {
3272 margin-right: 10px;
3273 }
3274 }
3275
3276 &.evf-toggle-switch {
3277 margin-bottom: 0;
3278 }
3279
3280 &.evf-toggle-label {
3281 display: inline-block;
3282 margin-bottom: 0;
3283 }
3284
3285 &.everest-forms-hidden {
3286 display: none;
3287 }
3288
3289 &.evf-privacy-policy-consent-message {
3290 display: initial;
3291 margin-bottom: 0;
3292 }
3293 }
3294
3295 .everest-forms-label-edit {
3296 margin-bottom: 4px;
3297
3298 label {
3299 margin-bottom: 4px;
3300 padding: 4px 0;
3301 flex: 1;
3302 }
3303
3304 input {
3305 font-size: 13px;
3306 font-weight: 600;
3307 }
3308
3309 .dashicons {
3310 margin-right: 7px;
3311 }
3312 }
3313
3314 input:not(.ed_button),
3315 textarea:not(.wp-editor-area) {
3316 color: $color_gray-base;
3317
3318 &::placeholder {
3319 color: $color_gray-light;
3320 }
3321 }
3322
3323 textarea,
3324 textarea:not(.wp-editor-area) {
3325 height: 120px;
3326
3327 &.short {
3328 height: 60px;
3329 }
3330 }
3331
3332 .description {
3333 color: $color_gray-normal;
3334 }
3335
3336 .everest-forms-checklist {
3337 ul {
3338 label {
3339 margin-top: 0;
3340 margin-bottom: 0;
3341 font-weight: normal;
3342 }
3343 }
3344 }
3345
3346 .everest-forms-question {
3347 margin-top: 0;
3348 line-height: 1.2;
3349 }
3350
3351 .evf-grid-lists {
3352 margin-left: -1.5%;
3353 margin-right: 1.5%;
3354 background-color: $color_gray-light-skin;
3355 display: flex;
3356
3357 .evf-grid-lists-item {
3358 padding-left: 1.5%;
3359 padding-right: 1.5%;
3360 background-color: $color-white;
3361 }
3362 }
3363
3364 .evf-content-section-title {
3365 font-size: 24px;
3366 font-weight: 600;
3367 line-height: 1.5;
3368 margin-bottom: 20px;
3369 padding-bottom: 20px;
3370 display: flex;
3371 align-items: center;
3372 color: $color_gray-dark;
3373 border-bottom: 1px solid $color_gray-lighten;
3374
3375 .evf-title {
3376 margin-right: 20px;
3377 }
3378
3379 .evf-toggle-section {
3380 margin-top: 2px;
3381 }
3382 }
3383
3384 .everest-forms-panel-field {
3385 position: relative;
3386 margin-bottom: 20px;
3387
3388 .wp-editor-container {
3389 margin-bottom: 10px;
3390 }
3391
3392 .desc {
3393 margin: 10px 0;
3394 font-style: italic;
3395 line-height: 1.2;
3396 }
3397
3398 .evf-hidden-content {
3399 margin-top: 10px;
3400 }
3401
3402 .max-entry-section {
3403 .max-entry-section-content {
3404 display: flex;
3405
3406 .everest-forms-panel-field {
3407 margin-bottom: 0;
3408 }
3409
3410 .entry-period {
3411 flex: 1;
3412 margin-left: 10px;
3413 }
3414 }
3415 }
3416
3417 &.everest-forms-panel-field-tinymce {
3418 .evf-toggle-smart-tag-display {
3419 top: 34px;
3420 right: 5px;
3421 border: 1px solid $color_gray-lighten;
3422 }
3423
3424 .evf-smart-tag-lists {
3425 top: 70px;
3426 }
3427 }
3428
3429 &.evf_conditional_logic_container {
3430 label {
3431 margin-bottom: 0;
3432 display: inline-block;
3433 }
3434 }
3435 }
3436
3437 .evf-choices-list {
3438 background: $color_gray-more-lighten;
3439 border-radius: 4px;
3440 padding: 1px 8px;
3441
3442 .sort {
3443 cursor: grab;
3444 display: flex;
3445 margin-top: 6px;
3446 padding-right: 6px;
3447 color: $color_gray-light;
3448
3449 svg {
3450 fill: currentColor;
3451 transform: rotate(90deg);
3452 }
3453
3454 &:active {
3455 cursor: grabbing;
3456 }
3457 }
3458
3459 li {
3460 background: $color-white;
3461 border: 1px solid $color_gray-lighten;
3462 display: flex;
3463 flex-wrap: wrap;
3464 padding: 8px;
3465 margin: 8px 0;
3466 z-index: 99999 !important;
3467
3468 .evf-choice-list-input {
3469 flex: 1;
3470 margin-right: 6px;
3471 }
3472
3473 input {
3474 &[type='text']='text'] {
3475 width: 100%;
3476 }
3477
3478 &[type='radio']='radio'],
3479 &[type='checkbox']='checkbox'] {
3480 margin: 7px 6px 0 0;
3481 }
3482
3483 &.value {
3484 display: none;
3485 margin-top: 8px;
3486
3487 &.evf-money-input {
3488 width: 22%;
3489 display: inline-block;
3490 margin: 0 0 0 auto;
3491 flex: 0 0 22%;
3492 }
3493 }
3494 }
3495
3496 .everest-forms-attachment-media-view {
3497 flex: 100%;
3498 display: none;
3499 margin-top: 8px;
3500
3501 .button-add-media {
3502 width: 100%;
3503 padding: 8px;
3504 outline: none;
3505 cursor: pointer;
3506 border-radius: 3px;
3507 color: $color_gray-base;
3508 border: 1px dashed $color-gray-lighten;
3509 }
3510
3511 .thumbnail-image {
3512 display: block;
3513 max-height: 200px;
3514 margin-bottom: 3px;
3515 border-radius: 4px;
3516 position: relative;
3517 overflow: hidden;
3518
3519 img {
3520 display: block;
3521 max-width: 100%;
3522 user-select: none;
3523 border-radius: 4px;
3524 }
3525 }
3526
3527 .actions {
3528 margin-top: 8px;
3529 }
3530 }
3531
3532 &.ui-sortable-placeholder {
3533 visibility: visible !important; // Overwrite CSS over JS.
3534 background: $color_gray-more-lighten;
3535 border: 1px dashed $color_gray-lighten;
3536 }
3537
3538 &.ui-sortable-helper {
3539 z-index: 99999 !important; // Overwrite CSS over JS.
3540 }
3541 }
3542
3543 .add,
3544 .remove {
3545 display: inline-flex;
3546 align-items: center;
3547 justify-content: center;
3548 width: 20px;
3549 height: 20px;
3550 margin-top: 5px;
3551 border: none;
3552
3553 .dashicons {
3554 width: 16px;
3555 height: 16px;
3556 font-size: 16px;
3557 }
3558 }
3559
3560 .add {
3561 &:hover {
3562 color: $blue;
3563 background: none;
3564 }
3565 }
3566
3567 .remove {
3568 margin-left: 0;
3569
3570 &:hover {
3571 color: $red;
3572 background: none;
3573 }
3574 }
3575
3576 &.show-images {
3577 li {
3578 .everest-forms-attachment-media-view {
3579 display: block;
3580 }
3581 }
3582 }
3583
3584 &.show-values {
3585 li {
3586 input[type='text']='text'].value {
3587 display: block;
3588 }
3589 }
3590 }
3591 }
3592
3593 .everest-forms-field-option-row-choices_images {
3594 .notice {
3595 display: inline-block;
3596 margin: 0 0 15px 0 !important;
3597
3598 &.hidden {
3599 display: none;
3600 }
3601 }
3602 }
3603
3604 .everest-forms-field-option-row-rows,
3605 .everest-forms-field-option-row-columns,
3606 .everest-forms-field-option-row-drop_down_choices,
3607 .everest-forms-field-option-row-choices,
3608 .everest-forms-field-option-row-questions {
3609 ul {
3610 li {
3611 clear: both;
3612 padding: 5px 10px;
3613 border-radius: 4px;
3614 border: 1px solid transparent;
3615 }
3616 }
3617
3618 .evf-questions-list {
3619 li {
3620 padding: 10px;
3621 background: $color-white;
3622 margin-bottom: 10px;
3623 border: 1px solid $color_gray-lighten;
3624
3625 input[type='text']='text'] {
3626 width: calc(100% - 39px);
3627 }
3628
3629 .answer-wrap {
3630 margin-top: 6px;
3631 }
3632 }
3633 }
3634
3635 .question-wrap,
3636 .answer-wrap {
3637 input {
3638 margin-right: 8px;
3639 vertical-align: middle;
3640 }
3641
3642 .add,
3643 .remove {
3644 width: 30px;
3645 height: 30px;
3646 display: inline-flex;
3647 vertical-align: middle;
3648 border-radius: 3px;
3649 border: 1px solid $color_gray-lighten;
3650 }
3651
3652 .add {
3653 &:hover {
3654 background: $blue;
3655 border-color: $blue;
3656 }
3657 }
3658
3659 .remove {
3660 &:hover {
3661 background: $red;
3662 border-color: $red;
3663 }
3664 }
3665 }
3666 }
3667
3668 .everest-forms-field-option-payment-multiple,
3669 .everest-forms-field-option-payment-checkbox {
3670 .everest-forms-field-option-row {
3671 li {
3672 input[type='text']='text'] {
3673 width: 73%;
3674 margin-right: 8px;
3675
3676 &.evf-money-input {
3677 width: 23%;
3678 display: inline-block;
3679 margin: 0 0 0 auto;
3680 flex: 0 0 23%;
3681 }
3682 }
3683 }
3684 }
3685 }
3686
3687 .evf-content-email-settings-inner{
3688 display: none;
3689 -webkit-animation: fadeIn 0.5s;
3690 animation: fadeIn 0.5s;
3691 margin: 20px 0;
3692 border-radius: 4px;
3693
3694 &.active-connection {
3695 display: block;
3696
3697 &.everest-forms-hidden {
3698 display: none;
3699 }
3700 }
3701 }
3702
3703 .evf-content-sms-notifications-settings-inner{
3704 display: none;
3705 -webkit-animation: fadeIn 0.5s;
3706 animation: fadeIn 0.5s;
3707 margin: 20px 0;
3708 border-radius: 4px;
3709
3710 &.active-connection {
3711 display: block;
3712
3713 &.everest-forms-hidden {
3714 display: none;
3715 }
3716 }
3717 }
3718
3719 }
3720
3721 .evf-registered-item {
3722 z-index: 999;
3723 cursor: pointer;
3724 border-radius: 2px;
3725 font-size: 12px;
3726 text-align: center;
3727 margin: 0;
3728 background-color: $color-white;
3729 border: 1px solid $color_gray-lighten;
3730 color: $color_gray-normal;
3731
3732 .evf-icon {
3733 color: inherit;
3734 display: block;
3735 font-size: 32px;
3736 text-align: center;
3737 margin-bottom: 5px;
3738 }
3739
3740 &.ui-draggable-dragging {
3741 width: calc(100% - 20px) !important;
3742 text-align: center !important;
3743 font-size: 12px !important;
3744 }
3745
3746 &.ui-sortable-placeholder {
3747 width: 100% !important;
3748 }
3749 }
3750
3751 .everest-forms-field.ui-draggable-dragging {
3752 margin: 0;
3753 width: 105px !important;
3754 background-color: $color-white;
3755 text-align: center;
3756 font-size: 12px !important;
3757
3758 .evf-icon {
3759 color: inherit;
3760 display: block !important;
3761 font-size: 32px !important;
3762 }
3763 }
3764
3765 .everest-forms-border-container {
3766 margin-top: 5px;
3767 margin-bottom: 20px;
3768 padding: 0 20px;
3769 border-radius: 4px;
3770 border: 1px solid $color_gray-lighten;
3771
3772 .everest-forms-border-container-title {
3773 padding: 0 10px;
3774 margin: 0 0 0 -10px;
3775 background: $color_gray-light-skin;
3776 display: inline-block;
3777 transform: translateY(-50%);
3778 }
3779
3780 label {
3781 margin-bottom: 10px;
3782 margin-top: 2px;
3783
3784 .everest-forms-help-tooltip {
3785 height: 16px;
3786 width: 16px;
3787 line-height: 1;
3788 vertical-align: middle;
3789 }
3790 }
3791
3792 select {
3793 // margin-bottom: 14px;
3794 }
3795
3796 .inline {
3797 margin-top: 0;
3798 }
3799
3800 .input-group-col-2 {
3801 margin-bottom: 15px;
3802
3803 input[type='text']='text'],
3804 input[type='number']='number'],
3805 select {
3806 margin-bottom: 0;
3807 margin-left: 0;
3808 }
3809 }
3810 }
3811
3812 .everest-forms-tab-content {
3813 position: relative;
3814 height: calc(100vh - 200px);
3815
3816 .everest-forms-add-fields-group {
3817 margin-bottom: 5px;
3818 }
3819
3820 .everest-forms-notice {
3821 display: inline-block;
3822 }
3823 }
3824
3825 .everest-forms-panel {
3826 .panel-wrap {
3827 overflow: hidden;
3828 }
3829
3830 .wp-picker-input-wrap {
3831 label {
3832 font-weight: 400;
3833 display: inline-block;
3834 }
3835 }
3836 }
3837
3838 .everest-forms-panel-content-wrap {
3839 .everest-forms-panel-content {
3840 position: relative;
3841 padding: 15px 20px;
3842 background-color: $color-white;
3843 height: calc(100vh - 150px);
3844 overflow-x: hidden !important;
3845
3846 .everest-forms-border-container {
3847 .everest-forms-border-container-title {
3848 background: $color-white;
3849 }
3850 }
3851
3852 .evf-content-sms-notifications-settings {
3853 .evf-content-sms-notifications-settings-inner {
3854 padding: 20px 20px 0;
3855 border: 1px solid $color_gray-lighten;
3856
3857 .everest-forms-sms-notfications-name {
3858 background: $color_gray-light-skin;
3859 margin-left: -20px;
3860 margin-top: -20px;
3861 margin-right: -20px;
3862 padding: 20px;
3863 border-radius: 4px 4px 0 0;
3864 border-bottom: 1px solid $color_gray-lighten;
3865
3866 input[type='text']='text'] {
3867 font-weight: 600;
3868 }
3869
3870 .everest-forms-text-danger {
3871 margin: 10px 0 0;
3872 }
3873 }
3874 }
3875 }
3876
3877
3878 .evf-content-email-settings {
3879 .evf-content-email-settings-inner {
3880 padding: 20px 20px 0;
3881 border: 1px solid $color_gray-lighten;
3882
3883 .everest-forms-email-name {
3884 background: $color_gray-light-skin;
3885 margin-left: -20px;
3886 margin-top: -20px;
3887 margin-right: -20px;
3888 padding: 20px;
3889 border-radius: 4px 4px 0 0;
3890 border-bottom: 1px solid $color_gray-lighten;
3891
3892 input[type='text']='text'] {
3893 font-weight: 600;
3894 }
3895
3896 .everest-forms-text-danger {
3897 margin: 10px 0 0;
3898 }
3899 }
3900 }
3901 }
3902
3903 .evf-content-post-submissions-settings,
3904 .evf-content-user-registration-settings {
3905 .everest-forms-panel-field {
3906 max-width: 500px;
3907 }
3908 }
3909
3910 .everest-forms-title-desc {
3911 display: inline-flex;
3912 align-items: center;
3913 flex-direction: row-reverse;
3914 position: relative;
3915 margin-bottom: 10px;
3916
3917 .evf-icon {
3918 display: flex;
3919 align-items: center;
3920 justify-content: center;
3921 width: 32px;
3922 height: 32px;
3923 cursor: pointer;
3924 border-radius: 3px;
3925 color: $color_gray-normal;
3926 background: $color_gray-more-lighten;
3927
3928 &::after {
3929 content: '';
3930 border-radius: 3px;
3931 position: absolute;
3932 left: 32px;
3933 right: calc(100% - 36px);
3934 height: 30px;
3935 border-radius: 0 3px 3px 0;
3936 transition: all 0.3s ease 0s;
3937 }
3938 }
3939
3940 .everest-forms-name-input {
3941 font-size: 1.3em;
3942 font-weight: 600;
3943 height: 32px;
3944 border: none;
3945 margin: 0;
3946 box-shadow: none;
3947 pointer-events: none;
3948 background: none;
3949 z-index: 1;
3950
3951 &.everst-forms-name-editing {
3952 pointer-events: all;
3953
3954 & + .evf-icon {
3955 background: $everestforms;
3956 color: $color-white;
3957 border-radius: 4px 0 0 4px;
3958
3959 &::after {
3960 top: 0;
3961 right: 0;
3962 border: 1px solid $everestforms;
3963 }
3964 }
3965 }
3966
3967 &:focus {
3968 box-shadow: none;
3969 }
3970 }
3971 }
3972
3973 .evf-admin-field-wrapper {
3974 cursor: move;
3975 position: relative;
3976
3977 .evf-sortable-placeholder {
3978 background-color: transparentize($green, 0.95);
3979 border: 1px dashed transparentize($green, 0.75);
3980 }
3981 }
3982
3983 .evf-add-row {
3984 margin: 20px auto;
3985 text-align: center;
3986
3987 span {
3988 width: auto;
3989 height: auto;
3990 font-size: 13px;
3991 background: #51cf66;
3992 font-family: inherit;
3993
3994 &.dashicons {
3995 &::before {
3996 width: 20px;
3997 height: 20px;
3998 line-height: 1;
3999 font-size: 16px;
4000 margin-right: 10px;
4001 font-family: dashicons;
4002 vertical-align: middle;
4003 padding: 2px 12px 2px 0;
4004 border-right: 1px solid
4005 transparentize($color-white, 0.7);
4006 }
4007 }
4008
4009 &:hover {
4010 background: #33ba4a;
4011 }
4012 }
4013 }
4014 .evf-add-row-repeater {
4015 margin: 20px auto;
4016 text-align: left;
4017 pointer-events: none;
4018
4019 span {
4020 width: auto;
4021 height: auto;
4022 padding: 10px;
4023 font-size: 13px;
4024 background: #51cf66;
4025 color: $color-white;
4026 font-family: inherit;
4027
4028 &.dashicons {
4029 &::before {
4030 width: 20px;
4031 height: 20px;
4032 line-height: 1;
4033 font-size: 16px;
4034 margin: 0 10px 0 10px;
4035 font-family: dashicons;
4036 text-align: center;
4037 vertical-align: middle;
4038 padding: 10px;
4039 cursor: text;
4040 border-right: none;
4041 }
4042 }
4043
4044 &:hover {
4045 background: #33ba4a;
4046 }
4047 }
4048 }
4049 }
4050 }
4051
4052 .everest-forms-fields-tab {
4053 display: flex;
4054 flex-wrap: wrap;
4055
4056 a {
4057 width: 50%;
4058 display: block;
4059 padding: 15px 0;
4060 font-weight: 600;
4061 text-align: center;
4062 color: $color_gray-dark;
4063 background: $color_gray-more-lighten;
4064 border-bottom: 1px solid $color_gray-lighten;
4065
4066 &.active {
4067 background: $color_gray-light-skin;
4068 border-bottom: 1px solid transparent;
4069 }
4070
4071 &:first-child {
4072 border-right: 1px solid $color_gray-lighten;
4073 }
4074 }
4075 }
4076
4077 .everest-forms-panel-sidebar {
4078 .everest-forms-add-fields,
4079 .everest-forms-field-options {
4080 padding: 15px 20px;
4081 }
4082 }
4083 }
4084 }
4085
4086 /**
4087 * Settings styling.
4088 **/
4089 .everest-forms {
4090 h2.evf-nav-tab-wrapper {
4091 margin-bottom: 1em;
4092 }
4093
4094 nav.evf-nav-tab-wrapper {
4095 margin: 1.5em 0 1em;
4096 }
4097
4098 .subsubsub {
4099 margin: -8px 0 0;
4100 }
4101
4102 .evf-admin-breadcrumb {
4103 margin-left: 0.5em;
4104 a {
4105 color: #a46497;
4106 }
4107 }
4108
4109 #template div {
4110 margin: 0;
4111
4112 p .button {
4113 float: right;
4114 margin-left: 10px;
4115 margin-top: -4px;
4116 }
4117
4118 .editor textarea {
4119 margin-bottom: 8px;
4120 }
4121 }
4122
4123 textarea[disabled='disabled']='disabled'] {
4124 background: #dfdfdf !important;
4125 }
4126
4127 table.form-table {
4128 margin: 0;
4129 position: relative;
4130 table-layout: fixed;
4131
4132 .forminp-radio {
4133 ul {
4134 margin: 0;
4135
4136 li {
4137 line-height: 1.4em;
4138 }
4139
4140 &.everest-forms-recaptcha-type {
4141 display: flex;
4142
4143 li {
4144 margin-right: 15px;
4145 margin-bottom: 0;
4146
4147 label {
4148 margin-bottom: 0 !important;
4149 margin-top: 5px !important;
4150 }
4151 }
4152 }
4153 }
4154 }
4155
4156 input[type='text']='text'],
4157 input[type='number']='number'],
4158 input[type='email']='email'] {
4159 height: auto;
4160 }
4161
4162 textarea.input-text {
4163 height: 100%;
4164 min-width: 150px;
4165 display: block;
4166 }
4167
4168 // Give regular settings inputs a standard width and padding.
4169 textarea,
4170 input[type='text']='text'],
4171 input[type='email']='email'],
4172 input[type='number']='number'],
4173 input[type='password']='password'],
4174 input[type='datetime']='datetime'],
4175 input[type='datetime-local']='datetime-local'],
4176 input[type='date']='date'],
4177 input[type='time']='time'],
4178 input[type='week']='week'],
4179 input[type='url']='url'],
4180 input[type='tel']='tel'],
4181 input.regular-input {
4182 margin: 0;
4183 padding: 0 8px;
4184 width: 350px;
4185 box-sizing: border-box;
4186 vertical-align: top;
4187
4188 @media only screen and (max-width: 782px) {
4189 width: 100%;
4190 }
4191 }
4192
4193 input[type='datetime-local']='datetime-local'],
4194 input[type='date']='date'],
4195 input[type='time']='time'],
4196 input[type='week']='week'],
4197 input[type='tel']='tel'] {
4198 width: 200px;
4199 }
4200
4201 select {
4202 width: 350px;
4203 margin: 0;
4204 box-sizing: border-box;
4205 height: 32px;
4206 vertical-align: top;
4207
4208 @media only screen and (max-width: 782px) {
4209 width: 100%;
4210 }
4211 }
4212
4213 input[size]] {
4214 width: auto !important;
4215 }
4216
4217 // Ignore nested inputs.
4218 table {
4219 select,
4220 textarea,
4221 input[type='text']='text'],
4222 input[type='email']='email'],
4223 input[type='number']='number'],
4224 input.regular-input {
4225 width: auto;
4226 }
4227 }
4228
4229 textarea.wide-input {
4230 width: 100%;
4231 }
4232
4233 img.help_tip,
4234 .everest-forms-help-tip {
4235 padding: 0;
4236 margin: -4px 0 0 5px;
4237 vertical-align: middle;
4238 cursor: help;
4239 line-height: 1;
4240 }
4241
4242 span.help_tip {
4243 cursor: help;
4244 color: $blue;
4245 }
4246
4247 th {
4248 width: 270px;
4249 position: relative;
4250 padding-right: 24px;
4251 }
4252
4253 th label {
4254 position: relative;
4255 display: block;
4256
4257 img.help_tip,
4258 .everest-forms-help-tip {
4259 margin: -7px -24px 0 0;
4260 position: absolute;
4261 right: 0;
4262 top: 50%;
4263
4264 @media only screen and (max-width: 782px) {
4265 right: auto;
4266 margin-left: 5px;
4267 }
4268 }
4269 }
4270
4271 th label,
4272 th.titledesc {
4273 color: $color_gray-base;
4274 }
4275
4276 th label + .everest-forms-help-tip {
4277 position: absolute;
4278 margin: 0;
4279 right: 0;
4280 top: 20px;
4281 }
4282
4283 td.everest-forms-permissions {
4284 display: flex;
4285 flex-wrap: wrap;
4286 align-items: flex-end;
4287
4288 fieldset {
4289 padding: 0 20px;
4290
4291 label {
4292 position: relative;
4293 display: block;
4294 font-weight: 600;
4295 }
4296 }
4297 }
4298
4299 .select2-container {
4300 vertical-align: top;
4301 margin-bottom: 3px;
4302 }
4303
4304 table.widefat th {
4305 padding-right: inherit;
4306 }
4307
4308 .wp-list-table .everest-forms-help-tip {
4309 float: none;
4310 }
4311
4312 fieldset {
4313 margin-top: 4px;
4314
4315 img.help_tip,
4316 .everest-forms-help-tip {
4317 margin: -3px 0 0 5px;
4318 }
4319
4320 p.description {
4321 margin-bottom: 8px;
4322 }
4323
4324 &:first-child {
4325 margin-top: 0;
4326 }
4327 }
4328
4329 .iris-picker {
4330 z-index: 100;
4331 display: none;
4332 position: absolute;
4333 border: 1px solid #ccc;
4334 border-radius: 3px;
4335 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
4336
4337 .ui-slider {
4338 border: 0 !important;
4339 margin: 0 !important;
4340 width: auto !important;
4341 height: auto !important;
4342 background: none transparent !important;
4343
4344 .ui-slider-handle {
4345 margin-bottom: 0 !important;
4346 }
4347 }
4348 }
4349
4350 .forminp-color {
4351 font-size: 0;
4352 }
4353
4354 .iris-error {
4355 background-color: #ffafaf;
4356 }
4357
4358 .colorpickpreview {
4359 padding: 0;
4360 width: 30px;
4361 height: 30px;
4362 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
4363 font-size: 16px;
4364 border-radius: 4px;
4365 margin-right: 3px;
4366
4367 @media only screen and (max-width: 782px) {
4368 float: left;
4369 width: 40px;
4370 height: 40px;
4371 }
4372 }
4373 }
4374
4375 .everest-forms-save-button {
4376 box-shadow: none;
4377 text-shadow: none;
4378 transition: 0.25s all ease-in-out;
4379 }
4380
4381 .everest-forms-integrations-connection {
4382 a {
4383 text-decoration: none;
4384 }
4385
4386 .everest-forms-integrations {
4387 border-radius: 3px;
4388 background: $color-white;
4389 border: 1px solid #ced4da;
4390 padding: 10px 20px;
4391 display: flex;
4392 flex-wrap: wrap;
4393 align-items: center;
4394 justify-content: space-between;
4395 margin-bottom: 10px;
4396
4397 .integration-header-info {
4398 display: flex;
4399 flex: 1;
4400 align-items: center;
4401
4402 .integration-status {
4403 position: relative;
4404
4405 .toggle-switch-outer {
4406 width: 20px;
4407 height: 20px;
4408 display: block;
4409 margin-right: 20px;
4410 position: relative;
4411 border-radius: 3px;
4412 border: 1px solid #ced4da;
4413
4414 &.connected {
4415 border-color: $green;
4416
4417 &::before {
4418 background-color: $green;
4419 }
4420 }
4421
4422 &::before {
4423 left: 0;
4424 top: 50%;
4425 right: 0;
4426 content: '';
4427 width: 10px;
4428 height: 10px;
4429 display: block;
4430 margin: 0 auto;
4431 border-radius: 2px;
4432 position: absolute;
4433 background-color: #ced4da;
4434 transform: translateY(-50%);
4435 }
4436 }
4437 }
4438
4439 .integration-detail {
4440 display: flex;
4441 align-items: center;
4442
4443 .logo {
4444 width: 50px;
4445 height: 50px;
4446 flex: 0 0 50px;
4447 display: flex;
4448 overflow: hidden;
4449 margin: 0 20px 0 0;
4450 border-radius: 4px;
4451 align-items: center;
4452 border: 1px solid #ced4da;
4453
4454 img {
4455 width: 100%;
4456 display: block;
4457 }
4458 }
4459
4460 .integration-info {
4461 margin-right: 20px;
4462
4463 a {
4464 display: inline-block;
4465
4466 &:hover h3 {
4467 color: $everestforms;
4468 }
4469
4470 &:focus {
4471 box-shadow: none;
4472 }
4473 }
4474
4475 h3,
4476 p {
4477 margin-top: 0;
4478 margin-bottom: 7px;
4479 }
4480 }
4481 }
4482 }
4483
4484 .integartion-action {
4485 flex-wrap: wrap;
4486 display: flex;
4487 align-items: center;
4488
4489 .toggle-button {
4490 margin-right: 20px;
4491
4492 .slide {
4493 display: block;
4494 height: 22px;
4495 cursor: pointer;
4496 width: 44px;
4497 position: relative;
4498
4499 &.inactive,
4500 &.active {
4501 border-radius: 34px;
4502
4503 &::before {
4504 border-radius: 50%;
4505 position: absolute;
4506 content: '';
4507 height: 18px;
4508 width: 18px;
4509 bottom: 2px;
4510 background-color: $color-white;
4511 -webkit-transition: 0.4s;
4512 transition: 0.4s;
4513 }
4514 }
4515
4516 &.inactive {
4517 background-color: #ced4da;
4518
4519 &::before {
4520 left: 2px;
4521 }
4522 }
4523
4524 &.active {
4525 background-color: $everestforms;
4526
4527 &::before {
4528 right: 2px;
4529 }
4530 }
4531 }
4532 }
4533
4534 .integration-setup {
4535 width: 35px;
4536 height: 35px;
4537 display: block;
4538 font-size: 16px;
4539 color: #78818a;
4540 position: relative;
4541 border-radius: 3px;
4542 border: 1px solid #ced4da;
4543 transition: all 0.25s;
4544
4545 .evf-icon-setting-cog {
4546 position: absolute;
4547 top: 50%;
4548 transform: translateY(-50%);
4549 width: 100%;
4550 text-align: center;
4551
4552 &::before {
4553 content: '\e021';
4554 }
4555 }
4556
4557 &:hover {
4558 color: $everestforms;
4559 border-color: $everestforms;
4560 }
4561 }
4562 }
4563 }
4564 }
4565
4566 .evf-connection-form {
4567 input {
4568 width: 100%;
4569 margin-right: 15px;
4570 margin-bottom: 15px;
4571
4572 @media screen and (min-width: 1200px) {
4573 width: calc(33% - 20px);
4574 }
4575 }
4576 }
4577
4578 .everest-forms-integration-content {
4579 display: flex;
4580 background-color: $color-white;
4581 border: 1px solid #ced4da;
4582
4583 .integration-addon-detail {
4584 width: 400px;
4585 padding: 20px;
4586 border-right: 1px solid #ced4da;
4587
4588 .evf-integration-info-header {
4589 display: flex;
4590 align-items: center;
4591 }
4592
4593 .evf-integration-logo {
4594 width: 60px;
4595 height: 60px;
4596 padding: 10px;
4597 display: flex;
4598 align-items: center;
4599 flex: 0 0 60px;
4600 margin: 0 20px 0 0;
4601 border-radius: 3px;
4602 border: 1px solid #ced4da;
4603
4604 img {
4605 width: 100%;
4606 }
4607 }
4608
4609 .integration-info {
4610 h3 {
4611 margin-top: 0;
4612 margin-bottom: 5px;
4613 }
4614
4615 .toggle-switch {
4616 &.connected {
4617 display: block;
4618 padding-left: 15px;
4619 position: relative;
4620
4621 &::before {
4622 left: 0;
4623 top: 50%;
4624 content: '';
4625 width: 10px;
4626 height: 10px;
4627 display: block;
4628 position: absolute;
4629 background: $green;
4630 border-radius: 50%;
4631 transform: translateY(-50%);
4632 }
4633 }
4634 }
4635 }
4636 }
4637
4638 .integration-connection-detail {
4639 padding: 20px;
4640 width: calc(100% - 400px);
4641
4642 .evf-account-connect {
4643 margin-bottom: 20px;
4644
4645 h3 {
4646 margin-top: 0;
4647 }
4648
4649 .everest-forms-btn {
4650 .evf-loading {
4651 width: 14px;
4652 height: 14px;
4653 background-size: 14px 14px;
4654 margin: 2px 0 0 5px;
4655 }
4656 }
4657 }
4658
4659 .evf-connection-list {
4660 table.evf-connection-list-table {
4661 width: 100%;
4662 border-spacing: 0;
4663 border-collapse: collapse;
4664 border: 1px solid #ced4da;
4665
4666 tr {
4667 td {
4668 padding: 10px 20px;
4669 border-bottom: 1px solid #ced4da;
4670
4671 &:last-child {
4672 text-align: right;
4673 }
4674
4675 .disconnect {
4676 color: $red;
4677 position: relative;
4678 display: inline-block;
4679 padding-left: 15px;
4680
4681 &::before {
4682 display: block;
4683 content: '';
4684 position: absolute;
4685 height: 10px;
4686 width: 10px;
4687 background: $red;
4688 top: 50%;
4689 transform: translateY(-50%);
4690 left: 0;
4691 border-radius: 50%;
4692 }
4693 }
4694 }
4695
4696 &:last-child {
4697 td {
4698 border-bottom: none;
4699 }
4700 }
4701 }
4702 }
4703 }
4704 }
4705 }
4706 }
4707
4708 /**
4709 * Import and Export
4710 */
4711 .evf-tools-export-entries,
4712 .everest-forms-import-form,
4713 .everest-forms-export-form {
4714 background: $color-white;
4715 max-width: 700px;
4716 padding: 20px;
4717 margin-top: 20px;
4718 box-shadow: 1px 3px 10px transparentize($color_gray-base, 0.95);
4719 border-radius: 4px;
4720
4721 h3 {
4722 margin: 0;
4723 font-size: 20px;
4724 padding-bottom: 16px;
4725 border-bottom: 2px solid $color_gray-more-lighten;
4726 }
4727
4728 p {
4729 font-size: 14px;
4730 }
4731
4732 select {
4733 margin: 1em 0;
4734 }
4735
4736 .description {
4737 margin-bottom: 16px;
4738
4739 .dashicons {
4740 width: 16px;
4741 height: 16px;
4742 font-size: 16px;
4743 vertical-align: middle;
4744 margin-right: 2px;
4745 margin-bottom: 3px;
4746 }
4747 }
4748
4749 .everest-forms-file-upload {
4750 margin: 1em 0;
4751 position: relative;
4752 z-index: 1;
4753
4754 input {
4755 opacity: 0;
4756 z-index: 2;
4757 width: 400px;
4758 height: 46px;
4759 }
4760
4761 label {
4762 display: inline-block;
4763 padding: 4px;
4764 min-width: 400px;
4765 position: absolute;
4766 left: 0;
4767 border-radius: 4px;
4768 border: 1px solid $color_gray-lighten;
4769 z-index: -1;
4770 }
4771
4772 .everest-forms-btn {
4773 width: auto;
4774 height: auto;
4775 font-size: 13px;
4776 margin-right: 10px;
4777 vertical-align: middle;
4778 }
4779 }
4780
4781 .publishing-action {
4782 padding-top: 20px;
4783 text-align: right;
4784 border-top: 2px solid $color_gray-more-lighten;
4785 }
4786 }
4787
4788 /**
4789 * List Table.
4790 */
4791 table.wp-list-table {
4792 span.na {
4793 color: #999;
4794 }
4795
4796 .row-actions {
4797 color: #999;
4798 }
4799
4800 .column-date {
4801 width: 12%;
4802 }
4803
4804 .column-entries {
4805 width: 74px;
4806 text-align: center;
4807 }
4808
4809 .column-actions {
4810 width: 175px;
4811 }
4812
4813 .column-enabled {
4814 width: 25px;
4815 }
4816
4817 .column-status img {
4818 height: 12px;
4819 margin-left: 5px;
4820 margin-bottom: -2px;
4821 }
4822
4823 img.attachment-thumbnail {
4824 height: 40px;
4825 }
4826
4827 .submitdelete {
4828 &:hover {
4829 color: #a00;
4830 }
4831 }
4832
4833 .new-entries-notification td {
4834 padding: 0;
4835 text-align: center;
4836
4837 a {
4838 padding: 10px;
4839 box-shadow: none;
4840 background: lighten(#0095ff, 45%);
4841 }
4842 }
4843 }
4844
4845 /**
4846 * Entry viewer.
4847 **/
4848 .everest-forms-entry {
4849 .postbox {
4850 .inside {
4851 padding: 6px 0 0;
4852
4853 p {
4854 margin: 0;
4855 padding: 6px 10px 8px;
4856 }
4857 }
4858
4859 .submitdelete {
4860 color: #a00;
4861 padding: 1px 2px;
4862 text-decoration: none;
4863 }
4864 }
4865
4866 #poststuff {
4867 #everest-forms-entry-fields,
4868 #everest-forms-entry-details,
4869 #everest-forms-entry-actions,
4870 #everest-forms-entry-payment {
4871 h2.hndle {
4872 cursor: inherit;
4873
4874 .dashicons {
4875 width: 16px;
4876 height: 16px;
4877 font-size: 16px;
4878 margin: 1px 2px 0 4px;
4879 }
4880 }
4881
4882 .inside {
4883 margin: 0;
4884 padding: 0;
4885
4886 .everest-forms-edit-entry-field {
4887 .evf-field {
4888 input[type='text']='text'],
4889 input[type='date']='date'],
4890 input[type='date']='date'],
4891 input[type='datetime-local']='datetime-local'],
4892 input[type='email']='email'],
4893 input[type='file']='file'],
4894 input[type='image']='image'],
4895 input[type='month']='month'],
4896 input[type='number']='number'],
4897 input[type='password']='password'],
4898 input[type='range']='range'],
4899 input[type='search']='search'],
4900 input[type='tel']='tel'],
4901 input[type='time']='time'],
4902 input[type='url']='url'],
4903 input[type='week']='week'],
4904 select,
4905 .StripeElement,
4906 canvas.evf-signature-canvas {
4907 padding: 0 8px;
4908 margin-bottom: 0;
4909 }
4910
4911 textarea {
4912 width: 100%;
4913 max-width: 100%;
4914 min-width: 100%;
4915 height: 120px;
4916 }
4917
4918 ul {
4919 li {
4920 margin: 0;
4921 display: block;
4922
4923 label,
4924 input {
4925 margin: 0;
4926 }
4927
4928 input[type='radio']='radio'],
4929 input[type='checkbox']='checkbox'] {
4930 margin-top: 4px;
4931 margin-right: 8px;
4932 }
4933 }
4934 }
4935 }
4936
4937 .evf-field-radio ul,
4938 .evf-field-checkbox ul,
4939 .evf-field-payment-radio ul,
4940 .evf-field-payment-checkbox ul {
4941 margin: 0;
4942
4943 li {
4944 display: flex;
4945 margin-bottom: 5px;
4946 }
4947 }
4948
4949 label.evf-error {
4950 cursor: default;
4951 color: #900;
4952 margin: 5px 0 0 0;
4953 }
4954
4955 abbr.required {
4956 color: #fa5252;
4957 font-weight: 700;
4958 border: 0 !important;
4959 text-decoration: none;
4960 vertical-align: middle;
4961 }
4962 }
4963
4964 .everest-forms-entry-details-meta,
4965 .everest-forms-entry-actions-meta,
4966 .everest-forms-entry-payment-meta {
4967 padding: 6px 0 0;
4968
4969 p {
4970 margin: 0;
4971 padding: 6px 10px 8px;
4972 }
4973
4974 .dashicons {
4975 top: 0;
4976 left: -2px;
4977 position: relative;
4978 padding: 0 2px 0 0;
4979 color: $color_gray-light;
4980 text-decoration: none;
4981 }
4982 }
4983
4984 .everest-forms-entry-actions-meta a {
4985 box-shadow: none;
4986 text-decoration: none;
4987 }
4988
4989 #major-publishing-actions {
4990 outline: inherit;
4991
4992 a.button-secondary {
4993 margin-left: 5px;
4994 }
4995 }
4996 }
4997 }
4998
4999 #everest-forms-entry-fields {
5000 .inside {
5001 table {
5002 border: none;
5003
5004 td a:focus {
5005 box-shadow: none;
5006 }
5007 }
5008
5009 span.list {
5010 display: block;
5011 }
5012
5013 img.attachment-thumbnail {
5014 height: 150px;
5015 }
5016 }
5017
5018 .everest-forms-empty-field-toggle {
5019 float: right;
5020 padding: 3px 0 0;
5021 text-decoration: none;
5022 }
5023 }
5024 }
5025 }
5026
5027 /**
5028 * DB log viewer.
5029 **/
5030 .wp-list-table.logs {
5031 .log-level {
5032 display: inline;
5033 padding: 0.2em 0.6em 0.3em;
5034 font-size: 80%;
5035 font-weight: bold;
5036 line-height: 1;
5037 color: $color-white;
5038 text-align: center;
5039 white-space: nowrap;
5040 vertical-align: baseline;
5041 border-radius: 0.2em;
5042
5043 &:empty {
5044 display: none;
5045 }
5046 }
5047
5048 /**
5049 * Add color to levels
5050 *
5051 * Descending severity:
5052 * emergency, alert -> red
5053 * critical, error -> orange
5054 * warning, notice -> yellow
5055 * info -> blue
5056 * debug -> green
5057 */
5058 .log-level--emergency,
5059 .log-level--alert {
5060 background-color: #ff4136;
5061 }
5062 .log-level--critical,
5063 .log-level--error {
5064 background-color: #ff851b;
5065 }
5066 .log-level--warning,
5067 .log-level--notice {
5068 color: #222;
5069 background-color: #ffdc00;
5070 }
5071 .log-level--info {
5072 background-color: #0074d9;
5073 }
5074 .log-level--debug {
5075 background-color: #3d9970;
5076 }
5077
5078 // Adjust log table columns only when table is not collapsed.
5079 @media screen and (min-width: 783px) {
5080 .column-timestamp {
5081 width: 18%;
5082 }
5083 .column-level {
5084 width: 14%;
5085 }
5086 .column-source {
5087 width: 15%;
5088 }
5089 }
5090 }
5091
5092 #log-viewer-select {
5093 padding: 10px 0 8px;
5094 line-height: 28px;
5095 h2 a {
5096 vertical-align: middle;
5097 }
5098 }
5099
5100 #log-viewer {
5101 background: $color-white;
5102 border: 1px solid #e5e5e5;
5103 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
5104 padding: 5px 20px;
5105
5106 pre {
5107 font-family: monospace;
5108 white-space: pre-wrap;
5109 word-wrap: break-word;
5110 }
5111 }
5112
5113 /**
5114 * Tooltips.
5115 **/
5116 .tips {
5117 cursor: help;
5118 text-decoration: none;
5119 }
5120
5121 img.tips {
5122 padding: 5px 0 0;
5123 }
5124
5125 .tooltipster-base {
5126 display: flex;
5127 position: absolute;
5128 pointer-events: none;
5129
5130 &.tooltipster-ruler {
5131 position: fixed;
5132 top: 0;
5133 right: 0;
5134 bottom: 0;
5135 left: 0;
5136 overflow: hidden;
5137 visibility: hidden;
5138 }
5139
5140 .tooltipster-box {
5141 border: none;
5142 flex: 1 1 auto;
5143 border-radius: 3px;
5144 background: #333;
5145 margin: 0 !important;
5146
5147 .tooltipster-content {
5148 color: $color-white;
5149 overflow: auto;
5150 font-size: 0.8em;
5151 max-width: 150px;
5152 max-height: 100%;
5153 text-align: center;
5154 padding: 0.618em 1em;
5155 box-sizing: border-box;
5156 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
5157
5158 a {
5159 color: #ff7d20;
5160 }
5161
5162 code {
5163 padding: 1px;
5164 background: #888;
5165 }
5166 }
5167 }
5168
5169 .tooltipster-arrow {
5170 overflow: hidden;
5171 position: absolute;
5172
5173 .tooltipster-arrow-uncropped {
5174 position: relative;
5175
5176 .tooltipster-arrow-border {
5177 top: 0;
5178 left: 0;
5179 width: 0;
5180 height: 0;
5181 position: absolute;
5182 border: 5px solid transparent;
5183 }
5184
5185 .tooltipster-arrow-background {
5186 display: none;
5187 }
5188 }
5189 }
5190
5191 &.tooltipster-top,
5192 &.tooltipster-bottom {
5193 .tooltipster-arrow {
5194 width: 10px;
5195 height: 5px;
5196 margin-left: -5px;
5197 }
5198 }
5199
5200 &.tooltipster-left,
5201 &.tooltipster-right {
5202 .tooltipster-arrow {
5203 top: 0;
5204 width: 5px;
5205 height: 10px;
5206 margin-left: 0;
5207 margin-top: -5px;
5208 }
5209 }
5210
5211 &.tooltipster-bottom {
5212 .tooltipster-arrow {
5213 top: -5px;
5214
5215 .tooltipster-arrow-uncropped {
5216 top: -5px;
5217
5218 .tooltipster-arrow-border {
5219 border-bottom-color: #333;
5220 }
5221 }
5222 }
5223 }
5224
5225 &.tooltipster-left {
5226 .tooltipster-arrow {
5227 right: -5px;
5228
5229 .tooltipster-arrow-border {
5230 border-left-color: #333;
5231 }
5232 }
5233 }
5234
5235 &.tooltipster-right {
5236 .tooltipster-arrow {
5237 left: -5px;
5238
5239 .tooltipster-arrow-uncropped {
5240 left: -5px;
5241
5242 .tooltipster-arrow-border {
5243 border-right-color: #333;
5244 }
5245 }
5246 }
5247 }
5248
5249 &.tooltipster-top {
5250 .tooltipster-arrow {
5251 bottom: -5px;
5252
5253 .tooltipster-arrow-border {
5254 border-top-color: #333;
5255 }
5256 }
5257 }
5258
5259 &.tooltipster-fade {
5260 opacity: 0;
5261 transition-property: opacity;
5262
5263 &.tooltipster-show {
5264 opacity: 1;
5265 }
5266 }
5267
5268 &.tooltipster-update-rotate {
5269 animation: rotating 600ms;
5270 }
5271 }
5272
5273 .evf_error_tip {
5274 color: $color-white;
5275 max-width: 20em;
5276 font-size: 0.8em;
5277 line-height: 1.8em;
5278 text-align: center;
5279 border-radius: 3px;
5280 position: absolute;
5281 white-space: normal;
5282 background: #d82223;
5283 margin: 1.5em 1px 0 -1em;
5284 padding: 0.618em 1em;
5285 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
5286 z-index: 9999999;
5287
5288 code {
5289 padding: 1px;
5290 background: #888;
5291 }
5292
5293 &::after {
5294 content: '';
5295 display: block;
5296 border: 8px solid #d82223;
5297 border-right-color: transparent;
5298 border-left-color: transparent;
5299 border-top-color: transparent;
5300 position: absolute;
5301 top: -3px;
5302 left: 50%;
5303 margin: -1em 0 0 -3px;
5304 }
5305 }
5306
5307 /**
5308 *Date picker.
5309 **/
5310 img.ui-datepicker-trigger {
5311 vertical-align: middle;
5312 margin-top: -1px;
5313 cursor: pointer;
5314 }
5315
5316 #ui-datepicker-div {
5317 display: none;
5318 }
5319
5320 /**
5321 * Blank State.
5322 **/
5323 .everest-forms-BlankState {
5324 text-align: center;
5325 padding: 5em 0 0;
5326
5327 .everest-forms-BlankState-icon {
5328 fill: #ddd;
5329 width: 128px;
5330 height: 128px;
5331 margin: 0 0 0.875em;
5332 }
5333
5334 .everest-forms-BlankState-message {
5335 color: #aaa;
5336 margin: 0 auto 1.5em;
5337 line-height: 1.5em;
5338 font-size: 1.2em;
5339 max-width: 500px;
5340 }
5341
5342 .everest-forms-BlankState-cta {
5343 font-size: 1.2em;
5344 padding: 0.75em 1.5em;
5345 margin: 0 0.25em;
5346 height: auto;
5347 display: inline-block !important;
5348 }
5349 }
5350
5351 .evf-pointer {
5352 .evf-pointer-buttons {
5353 .close {
5354 float: left;
5355 margin: 6px 0 0 15px;
5356 }
5357 }
5358 }
5359
5360 /**
5361 * Select2 elements.
5362 */
5363 .select2-container {
5364 .select2-selection--multiple {
5365 .select2-selection__rendered {
5366 display: block;
5367 }
5368
5369 input {
5370 &.select2-search__field {
5371 min-width: 10px;
5372 margin-top: 0 !important;
5373 margin-bottom: 4px !important;
5374 }
5375 }
5376 }
5377
5378 &.select2-container--focus {
5379 .select2-selection--multiple {
5380 border-color: #5b9dd9;
5381 box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);
5382 outline: 2px solid transparent;
5383 }
5384 }
5385 }
5386
5387 .select2-drop,
5388 .select2-dropdown {
5389 z-index: 999999 !important;
5390
5391 .everest-forms-btn {
5392 margin: 8px 4px;
5393 }
5394 }
5395
5396 .select2-results {
5397 line-height: 1.5em;
5398
5399 .select2-results__option,
5400 .select2-results__group {
5401 margin: 0;
5402 padding: 8px;
5403
5404 &:focus {
5405 outline: none;
5406 }
5407 }
5408
5409 .description {
5410 display: block;
5411 color: #999;
5412 padding-top: 4px;
5413 }
5414 }
5415
5416 .select2-dropdown {
5417 border-color: #007cba;
5418
5419 &::after {
5420 position: absolute;
5421 left: 0;
5422 right: 0;
5423 height: 1px;
5424 background: #fff;
5425 content: '';
5426 }
5427 }
5428
5429 .select2-dropdown--below {
5430 box-shadow: 0 0 0 1px #007cba, 0 2px 1px rgba(0, 0, 0, 0.1);
5431
5432 &::after {
5433 top: -1px;
5434 }
5435 }
5436
5437 .select2-dropdown--above {
5438 box-shadow: 0 0 0 1px #007cba, 0 -2px 1px rgba(0, 0, 0, 0.1);
5439
5440 &::after {
5441 bottom: -1px;
5442 }
5443 }
5444 .select2-container--open {
5445 .select2-dropdown--below {
5446 margin-top: -15px;
5447 }
5448 }
5449 .select2-container {
5450 @media only screen and (max-width: 782px) {
5451 font-size: 16px;
5452 }
5453
5454 &:focus {
5455 outline: none;
5456 }
5457 span.selection {
5458 display: block;
5459 }
5460 .select2-selection__rendered.ui-sortable li {
5461 cursor: move;
5462 }
5463
5464 .select2-selection {
5465 border-color: #7e8993;
5466 }
5467
5468 .select2-search__field {
5469 min-width: 150px;
5470 }
5471
5472 .select2-selection--single {
5473 height: 30px;
5474 border-color: #7e8993;
5475
5476 @media only screen and (max-width: 782px) {
5477 height: 40px;
5478 }
5479
5480 &:focus {
5481 outline: none;
5482 }
5483
5484 .select2-selection__rendered {
5485 line-height: 28px;
5486 padding-right: 24px;
5487
5488 @media only screen and (max-width: 782px) {
5489 line-height: 38px;
5490 }
5491
5492 &:hover {
5493 color: #007cba;
5494 }
5495 }
5496
5497 .select2-selection__arrow {
5498 right: 1px;
5499 height: 28px;
5500 width: 23px;
5501 background: 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)
5502 no-repeat right 5px top 55%;
5503 background-size: 16px 16px;
5504
5505 @media only screen and (max-width: 782px) {
5506 height: 38px;
5507 }
5508
5509 b {
5510 display: none;
5511 }
5512 }
5513 }
5514
5515 &.select2-container--focus .select2-selection--single,
5516 &.select2-container--open .select2-selection--single,
5517 &.select2-container--open .select2-selection--multiple {
5518 border-color: #007cba;
5519 box-shadow: 0 0 0 1px #007cba;
5520 }
5521
5522 .select2-selection--multiple {
5523 min-height: 30px;
5524 line-height: 1.5;
5525 border-radius: 4px;
5526 border-color: #7e8993;
5527
5528 li {
5529 margin: 0;
5530 }
5531
5532 .select2-selection__choice {
5533 padding: 2px 6px;
5534
5535 .description {
5536 display: none;
5537 }
5538 }
5539 }
5540
5541 .select2-selection__clear {
5542 color: #999;
5543 margin-top: -1px;
5544 z-index: 1;
5545 }
5546
5547 .select2-search--inline .select2-search__field {
5548 min-height: 28px;
5549 font-family: inherit;
5550 font-size: inherit;
5551 font-weight: inherit;
5552 padding: 0 0 0 3px;
5553 }
5554
5555 .everest-forms table.form-table .select2-container {
5556 @media only screen and (max-width: 782px) {
5557 min-width: 100% !important;
5558 }
5559 }
5560 }
5561
5562 /**
5563 * Select2 colors for built-in admin color themes.
5564 */
5565 .admin-color {
5566 $wp_admin_colors: (
5567 blue: #096484,
5568 coffee: #c7a589,
5569 ectoplasm: #a3b745,
5570 midnight: #e14d43,
5571 ocean: #9ebaa0,
5572 sunrise: #dd823b,
5573 light: #04a4cc,
5574 );
5575
5576 @each $name, $color in $wp_admin_colors {
5577 &-#{$name} {
5578 .select2-dropdown {
5579 border-color: $color;
5580 }
5581
5582 .select2-dropdown--below {
5583 box-shadow: 0 0 0 1px $color, 0 2px 1px rgba(0, 0, 0, 0.1);
5584 }
5585
5586 .select2-dropdown--above {
5587 box-shadow: 0 0 0 1px $color, 0 -2px 1px rgba(0, 0, 0, 0.1);
5588 }
5589
5590 .select2-selection--single .select2-selection__rendered:hover {
5591 color: $color;
5592 }
5593
5594 .select2-container.select2-container--focus
5595 .select2-selection--single,
5596 .select2-container.select2-container--open
5597 .select2-selection--single,
5598 .select2-container.select2-container--open
5599 .select2-selection--multiple {
5600 border-color: $color;
5601 box-shadow: 0 0 0 1px $color;
5602 }
5603
5604 .select2-container--default
5605 .select2-results__option--highlighted[aria-selected]],
5606 .select2-container--default
5607 .select2-results__option--highlighted[data-selected]] {
5608 background-color: $color;
5609 }
5610 }
5611 }
5612 }
5613
5614 .everest-forms {
5615 table {
5616 &.form-table {
5617 .select2-container--default {
5618 &.select2-container--focus {
5619 .select2-selection--multiple {
5620 border-color: #5b9dd9;
5621 box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);
5622 outline: 2px solid transparent;
5623 }
5624 }
5625 }
5626
5627 .select2-container {
5628 min-width: 350px !important;
5629 }
5630 }
5631 }
5632 }
5633
5634 /**
5635 * Small screen optimisation.
5636 **/
5637 @media only screen and (max-width: 1280px) {
5638 .everest-forms_page_evf-builder {
5639 #everest-forms-builder {
5640 .evf-tab-content {
5641 .everest-forms-panel {
5642 .everest-forms-panel-content-wrap {
5643 .everest-forms-panel-content {
5644 padding: 15px 20px;
5645 background-color: $color-white;
5646 }
5647 }
5648 }
5649 }
5650 }
5651 }
5652 }
5653
5654 /**
5655 * Optimisation for screens 960px and smaller.
5656 **/
5657 @media only screen and (max-width: 960px) {
5658 .everest-forms_page_evf-builder {
5659 #everest-forms-builder {
5660 .evf-tab-content {
5661 .everest-forms-panel {
5662 .everest-forms-panel-sidebar {
5663 width: 280px;
5664 height: calc(100vh - 122px);
5665
5666 .evf-registered-buttons {
5667 .evf-registered-item {
5668 width: 47%;
5669 }
5670 }
5671 }
5672
5673 .everest-forms-panel-sidebar-content {
5674 .everest-forms-panel-content-wrap {
5675 width: calc(100% - 280px);
5676 }
5677 }
5678 }
5679 }
5680 }
5681 }
5682
5683 .everest-forms {
5684 .everest-forms-integration-content {
5685 .integration-addon-detail {
5686 width: 280px;
5687 }
5688 }
5689 }
5690 }
5691
5692 /**
5693 * Optimisation for screens 782px and smaller.
5694 **/
5695 @media screen and (max-width: 782px) {
5696 .everest-forms_page_evf-builder {
5697 .auto-fold {
5698 #wpcontent {
5699 padding-left: 0;
5700 }
5701 }
5702
5703 .everest-forms {
5704 .everest-forms-overlay {
5705 z-index: 99999;
5706 }
5707 }
5708
5709 #everest-forms-builder {
5710 width: 100%;
5711
5712 #everest-forms-builder-form {
5713 width: 100% !important; // Adjust Form builder width
5714
5715 .evf-tab-content {
5716 .everest-forms-panel-content-wrap {
5717 .everest-forms-panel-content {
5718 height: calc(100vh - 122px);
5719
5720 &.ps {
5721 height: calc(100vh - 176px);
5722 }
5723 }
5724
5725 .evf-admin-row {
5726 .evf-admin-grid {
5727 padding: 0;
5728 margin: 0;
5729 }
5730 }
5731 }
5732
5733 .everest-forms-field-option-row-choices {
5734 ul {
5735 li {
5736 input[type='text']='text'] {
5737 width: calc(100% - 118px);
5738 }
5739
5740 a {
5741 &.add,
5742 &.remove {
5743 width: 40px;
5744 height: 40px;
5745 }
5746 }
5747 }
5748 }
5749 }
5750 }
5751 }
5752
5753 .everest-forms-nav-wrapper {
5754 nav.evf-nav-tab-wrapper {
5755 width: calc(100% - 269px);
5756 }
5757
5758 .evf-forms-nav-right {
5759 width: 269px;
5760
5761 .evf-shortcode-field {
5762 input {
5763 display: none;
5764 }
5765
5766 button {
5767 border-radius: 3px;
5768 }
5769 }
5770 }
5771 }
5772
5773 .everest-forms-tab-content {
5774 height: calc(100vh - 172px);
5775 }
5776 }
5777 }
5778
5779 .evf-nav-tab-wrapper {
5780 overflow-x: auto;
5781 }
5782
5783 .everest-forms_page_evf-settings {
5784 .everest-forms {
5785 .everest-forms-settings {
5786 table {
5787 &.form-table {
5788 th {
5789 padding: 15px 0 15px;
5790 }
5791 }
5792 }
5793 }
5794 }
5795 }
5796
5797 .everest-forms-builder-setup {
5798 .everest-forms {
5799 #everest-forms-setup-name {
5800 width: auto;
5801 }
5802
5803 .evf-setup-desc {
5804 a {
5805 width: 200px;
5806 }
5807 }
5808 }
5809 }
5810 }
5811
5812 /**
5813 * Optimisation for screens 768px.
5814 */
5815 @media screen and (min-width: 768px) {
5816 .evf-form-col-6 {
5817 flex: 0 0 50%;
5818 max-width: 50%;
5819 }
5820
5821 .evf-form-col-4 {
5822 flex: 0 0 33.333%;
5823 max-width: 33.333%;
5824 }
5825 }
5826
5827 /**
5828 * Optimisation for screens 600px and smaller.
5829 */
5830 @media screen and (max-width: 600px) {
5831 .everest-forms_page_evf-builder,
5832 .everest-forms_page_evf-settings {
5833 .everest-forms {
5834 .evf-nav-tab-wrapper {
5835 a {
5836 &.nav-tab {
5837 margin: 0;
5838 }
5839 }
5840 }
5841 }
5842 }
5843
5844 .everest-forms-builder-setup {
5845 .everest-forms {
5846 width: 100%;
5847 margin: 20px 0;
5848
5849 .evf-setup-desc a {
5850 display: block;
5851 margin-bottom: 30px;
5852 text-align: center;
5853 width: 100%;
5854 margin-left: 0;
5855 }
5856 }
5857 }
5858
5859 .everest-forms_page_evf-builder {
5860 #wpbody-content {
5861 padding-bottom: 0;
5862 }
5863
5864 #everest-forms-builder {
5865 position: initial;
5866
5867 #everest-forms-builder-form {
5868 position: relative;
5869 }
5870
5871 .evf-tab-content {
5872 .everest-forms-panel-content-wrap {
5873 padding: 20px 20px 0;
5874
5875 .evf-admin-row {
5876 flex-direction: column;
5877 margin: 0 0 20px;
5878 position: relative;
5879
5880 .evf-admin-grid {
5881 &.evf-grid-1,
5882 &.evf-grid-2,
5883 &.evf-grid-3,
5884 &.evf-grid-4 {
5885 width: auto;
5886 }
5887 }
5888 }
5889 }
5890 }
5891
5892 .everest-forms-nav-wrapper {
5893 nav.evf-nav-tab-wrapper {
5894 width: calc(100% - 207px);
5895 }
5896
5897 .evf-forms-nav-right {
5898 width: 207px;
5899 margin-top: 10px;
5900 padding: 9px 17px;
5901
5902 .evf-shortcode-field {
5903 display: none;
5904 }
5905 }
5906 }
5907
5908 .evf-tab-content {
5909 .everest-forms-panel {
5910 .everest-forms-panel-sidebar-content {
5911 flex-direction: column;
5912
5913 .everest-forms-panel-sidebar,
5914 .everest-forms-panel-content-wrap {
5915 width: 100%;
5916 }
5917
5918 .everest-forms-panel-content-wrap {
5919 padding: 0;
5920 }
5921 }
5922 }
5923
5924 .evf-choices-list {
5925 li {
5926 input[type='text']='text'] {
5927 width: 84%;
5928 }
5929 }
5930 }
5931 }
5932 }
5933 }
5934
5935 .everest-forms {
5936 .everest-forms-integration-content {
5937 flex-wrap: wrap;
5938
5939 .integration-addon-detail {
5940 width: 100%;
5941 margin: 0 20px;
5942 border-bottom: 1px solid #ced4da;
5943 border-right: none;
5944 padding-left: inherit;
5945 }
5946
5947 .integration-connection-detail {
5948 width: 100%;
5949 }
5950 }
5951
5952 .everest-forms-integrations-connection {
5953 .everest-forms-integrations {
5954 .integration-header-info {
5955 .integration-detail {
5956 flex-direction: column;
5957 align-items: flex-start;
5958 }
5959 }
5960
5961 .integration-header-info {
5962 align-items: flex-start;
5963
5964 .integration-status {
5965 margin-top: 15px;
5966 }
5967
5968 .integration-detail {
5969 .logo {
5970 margin-bottom: 15px;
5971 }
5972 }
5973 }
5974 }
5975 }
5976 }
5977 }
5978
5979 /**
5980 * Optimisation for screens 400px and smaller.
5981 */
5982 @media screen and (max-width: 400px) {
5983 #everest-forms-builder {
5984 .evf-tab-lists li {
5985 a {
5986 padding: 15px;
5987 }
5988
5989 .dashicons {
5990 font-size: 24px;
5991 }
5992 }
5993
5994 .evf-tab-content {
5995 .everest-forms-panel {
5996 .everest-forms-panel-sidebar {
5997 .evf-registered-buttons {
5998 .evf-registered-item {
5999 width: 47%;
6000 }
6001 }
6002 }
6003 }
6004 }
6005 }
6006
6007 .jconfirm.jconfirm-white .jconfirm-box,
6008 .jconfirm.jconfirm-light .jconfirm-box {
6009 width: 90% !important;
6010 }
6011 }
6012 .evf-repeater-fields {
6013 padding: 0 20px 20px;
6014 .everest-forms-field-repeater-fields {
6015 width: calc(100% + 60px) !important;
6016 margin-left: -30px !important;
6017 margin-top: -1px !important;
6018 min-height: 48px;
6019 }
6020 div.evf-admin-grid.evf-repeatable-grid {
6021 padding: 0 10px 10px !important;
6022 }
6023 }
6024
6025 #elementor-editor-wrapper .everest-icon:before,
6026 .elementor-edit-area .everest-icon:before {
6027 content: '\e902';
6028 font-family: "EverestForms";
6029 font-weight: normal;
6030 font-style: normal;
6031 font-display: block;
6032 }
6033
6034 .everest-forms-field.ui-sortable-helper .evf-field-action {
6035 display: none;
6036 }
6037
6038 .everest-forms-builder .everest-forms-field.ui-sortable-helper {
6039 padding: 15px 15px 0 15px;
6040 border: 1px solid #cdd0d8;
6041 border-radius: 3px;
6042
6043 label {
6044 display: block;
6045 font-size: 13px;
6046 font-weight: 600;
6047 margin-bottom: 10px;
6048
6049 .required {
6050 vertical-align: middle;
6051 padding-left: 6px;
6052 }
6053 }
6054 }
6055
6056 .everest-forms-builder {
6057 .evf-registered-item.ui-draggable.ui-draggable-handle.ui-draggable-dragging {
6058 font-size: 12px !important;
6059 background-color: #fff;
6060 border: 1px solid #cdd0d8;
6061 color: #6c7680;
6062
6063 .evf-icon {
6064 padding: 0 8px;
6065 border-radius: 4px;
6066 font-size: 24px;
6067 vertical-align: middle;
6068 }
6069 }
6070 }
6071
6072 .jconfirm-content-pane {
6073 height: auto !important;
6074
6075 .evf-shortcut-keyword {
6076 margin-bottom: 18px;
6077
6078 .evf-shortcut-title {
6079 flex: 3;
6080 }
6081
6082 li {
6083 display: flex;
6084 align-items: center;
6085
6086 .evf-key {
6087 display: flex;
6088 flex: 2;
6089 column-gap: 8px;
6090 color: #3498DB;
6091
6092 span {
6093 border: 1px solid #3498DB;
6094 background-color: #3498db13;
6095 padding: 4px 0;
6096 width: 40px;
6097 border-radius: 2px;
6098 }
6099 }
6100 }
6101 }
6102 }
6103
6104 .evf-btn-container {
6105 a {
6106 display: inline-block;
6107 padding: 4px 8px;
6108 border: 1px solid #3498DB;
6109 margin-bottom: 8px;
6110 border-radius: 2px;
6111 background-color: #f5fbff;
6112 line-height: 1.8em;
6113
6114 &:hover {
6115 background-color: #3498DB;
6116 color: #fff;
6117 cursor: pointer;
6118 }
6119 }
6120
6121 .evf-btn-unselect-all {
6122 margin-left: 8px;
6123 }
6124 }
6125
6126 // Customize Select2 style
6127 .select2-results__option .wrap:before {
6128 content: "\2610";
6129 width: 25px;
6130 height: 25px;
6131 padding-right: 10px;
6132 }
6133
6134 .select2-results__option[data-selected="true"]="true""] .wrap:before {
6135 content: "\2714";
6136 }
6137
6138 .select2-drop,
6139 .select2-dropdown {
6140 z-index: 999999 !important;
6141 }
6142
6143 .select2-results {
6144 line-height: 1.5em;
6145
6146 .select2-results__option,
6147 .select2-results__group {
6148 margin: 0;
6149 padding: 8px;
6150 }
6151 }
6152
6153 .select2-dropdown {
6154 border-color: gray;
6155 }
6156
6157 .select2-dropdown--below {
6158 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
6159 }
6160
6161 .select2-dropdown--above {
6162 box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1);
6163 }
6164
6165 .select2-container {
6166 .select2-selection__rendered.ui-sortable li {
6167 cursor: move;
6168 }
6169
6170 .select2-selection {
6171 border-color: gray;
6172 }
6173
6174 .select2-search__field {
6175 min-width: 20px;
6176 }
6177
6178 .select2-selection--single {
6179 height: 32px;
6180
6181 .select2-selection__rendered {
6182 display: block;
6183 line-height: 32px;
6184 padding-right: 24px;
6185 }
6186
6187 .select2-selection__arrow {
6188 right: 3px;
6189 height: 30px;
6190 }
6191 }
6192
6193 .select2-selection--multiple {
6194 min-height: 28px;
6195 border-radius: 4px;
6196 line-height: 1.5;
6197 border: 1px solid #ddd !important;
6198 padding-left: 4px;
6199
6200 li {
6201 margin: 0;
6202 }
6203
6204 .select2-selection__choice {
6205 padding: 2px 6px;
6206 }
6207
6208 .select2-selection__rendered {
6209 // display: block;
6210 display: flex;
6211 margin: 0px;
6212
6213 .select2-selection__choice {
6214 margin: 4px;
6215 line-height: 1.4;
6216 display: flex;
6217 align-items: center;
6218 justify-content: center;
6219
6220 .select2-selection__choice__remove {
6221 bottom: 0px;
6222 }
6223 }
6224 }
6225 }
6226
6227 .select2-selection__clear {
6228 color: #999;
6229 margin-top: -1px;
6230 }
6231
6232 .select2-search--inline {
6233 .select2-search__field {
6234 font-family: inherit;
6235 font-size: inherit;
6236 font-weight: inherit;
6237 padding: 3px 0;
6238 margin: 0;
6239 line-height: 1;
6240 min-height: 26px;
6241 height: 32px;
6242 }
6243 }
6244 }
6245
6246 .everest-forms-form-template-wrapper {
6247 .everest-forms-form-template {
6248 &[data-filter-template="free"]="free""] {
6249 .everest-forms-template-wrap[data-plan="premium"]="premium""] {
6250 display: none;
6251 }
6252 }
6253 &[data-filter-template="premium"]="premium""] {
6254 .everest-forms-template-wrap[data-plan="free"]="free""] {
6255 display: none;
6256 }
6257 }
6258 }
6259 }
6260