diff --git a/assets/css/admin.scss b/assets/css/admin.scss index 249593b93..a11684681 100644 --- a/assets/css/admin.scss +++ b/assets/css/admin.scss @@ -6,10170 +6,10168 @@ /** * Import */ - @import "variables/variables"; - @import "mixins/mixins"; - @import "fonts"; - @import "animation"; - @import "clearings"; - @import "confirm"; - - // Components - @import "components/badge", "components/forms", "components/buttons", - "components/card", "components/table"; - - @import "colors"; - @import "containers"; - @import "grid"; - - //Utilities - @import "utility/display", "utility/spacing", "utility/border"; - - //Everest-forms icon - @font-face { - font-family: "EverestForms"; - src: url("../fonts/EverestForms.eot?5c6kq4"); - src: - url("../fonts/EverestForms.eot?5c6kq4#iefix") - format("embedded-opentype"), - url("../fonts/EverestForms.ttf?5c6kq4") format("truetype"), - url("../fonts/EverestForms.woff?5c6kq4") format("woff"), - url("../fonts/EverestForms.svg?5c6kq4#EverestForms") format("svg"); - font-weight: normal; - font-style: normal; - font-display: block; - } - - /** +@import "variables/variables"; +@import "mixins/mixins"; +@import "fonts"; +@import "animation"; +@import "clearings"; +@import "confirm"; + +// Components +@import "components/badge", "components/forms", "components/buttons", + "components/card", "components/table"; + +@import "colors"; +@import "containers"; +@import "grid"; + +//Utilities +@import "utility/display", "utility/spacing", "utility/border"; + +//Everest-forms icon +@font-face { + font-family: "EverestForms"; + src: url("../fonts/EverestForms.eot?5c6kq4"); + src: + url("../fonts/EverestForms.eot?5c6kq4#iefix") + format("embedded-opentype"), + url("../fonts/EverestForms.ttf?5c6kq4") format("truetype"), + url("../fonts/EverestForms.woff?5c6kq4") format("woff"), + url("../fonts/EverestForms.svg?5c6kq4#EverestForms") format("svg"); + font-weight: normal; + font-style: normal; + font-display: block; +} + +/** * Styling begins */ - .blockUI.blockOverlay { - @include loader(); - } - - // Loader - .evf-loading { - background: url(../images/icons/loader.svg); - background-size: 20px 20px; - display: inline-block; - visibility: hidden; - vertical-align: middle; - opacity: 0.7; - width: 20px; - height: 20px; - margin: 2px 0 0 5px; - float: right; - - &.evf-loading-active { - visibility: visible; - -webkit-animation: rotating 1s linear infinite; - -moz-animation: rotating 1s linear infinite; - -ms-animation: rotating 1s linear infinite; - -o-animation: rotating 1s linear infinite; - animation: rotating 1s linear infinite; - } - } - - //tinymce full-width - .everest_forms_tinymce_class { - width: 100% !important; - } - - /** +.blockUI.blockOverlay { + @include loader(); +} + +// Loader +.evf-loading { + background: url(../images/icons/loader.svg); + background-size: 20px 20px; + display: inline-block; + visibility: hidden; + vertical-align: middle; + opacity: 0.7; + width: 20px; + height: 20px; + margin: 2px 0 0 5px; + float: right; + + &.evf-loading-active { + visibility: visible; + -webkit-animation: rotating 1s linear infinite; + -moz-animation: rotating 1s linear infinite; + -ms-animation: rotating 1s linear infinite; + -o-animation: rotating 1s linear infinite; + animation: rotating 1s linear infinite; + } +} + +//tinymce full-width +.everest_forms_tinymce_class { + width: 100% !important; +} + +/** * Grid Styles **/ - .evf-form-row { - display: flex; - flex-wrap: wrap; - margin-left: -15px; - margin-right: -15px; - } - - // Gutter for all col - .evf-form-col-4, - .evf-form-col-6 { - position: relative; - width: 100%; - padding-left: 15px; - padding-right: 15px; - } - - .evf_addons_wrap { - p.refresh { - margin: 0 0 2em; - } - - .wp-filter { - display: none; - } - - .plugin-card { - .name, - .desc { - margin-right: 0; - } - .plugin-card-top { - padding: 20px; - min-height: 130px; - - .plugin-desc { - overflow: hidden; - display: -webkit-box; - -webkit-line-clamp: 4; - -webkit-box-orient: vertical; - } - - .plugin-icon { - border: 1px solid #eee; - } - } - - .plugin-card-bottom { - .status { - text-align: left; - float: left; - clear: left; - width: 65%; - padding-top: 5px; - width: calc(100% - 180px); - - span.status-label { - color: #666; - - &.status-active { - color: #2a9b39; - } - - &.status-inactive { - color: #a00; - } - } - } - - .action-buttons { - float: right; - clear: right; - max-width: 180px; - - &.upgrade-plan { - margin: 0 auto; - } - } - } - } - - .plugin-card-update-failed { - .notice-error { - margin: 0; - padding: 9px 16px 8px; - - .notice-dismiss { - padding: 17px; - } - } - } - - @media screen and (max-width: 782px) { - .plugin-card { - .plugin-card-bottom { - .status { - padding-top: 9px; - } - - .action-buttons { - .button.updating-message { - &::before, - &::after { - margin-top: -1px; - } - } - } - } - } - - .plugin-card-update-failed { - .notice-error { - padding: 13px 20px; - - .notice-dismiss { - padding: 21px; - } - } - } - } - } - - .clear { - clear: both; - } - - .wrap.everest-forms div.updated, - .wrap.everest-forms div.error { - margin-top: 10px; - } - - /** +.evf-form-row { + display: flex; + flex-wrap: wrap; + margin-left: -15px; + margin-right: -15px; +} + +// Gutter for all col +.evf-form-col-4, +.evf-form-col-6 { + position: relative; + width: 100%; + padding-left: 15px; + padding-right: 15px; +} + +.evf_addons_wrap { + p.refresh { + margin: 0 0 2em; + } + + .wp-filter { + display: none; + } + + .plugin-card { + .name, + .desc { + margin-right: 0; + } + .plugin-card-top { + padding: 20px; + min-height: 130px; + + .plugin-desc { + overflow: hidden; + display: -webkit-box; + -webkit-line-clamp: 4; + -webkit-box-orient: vertical; + } + + .plugin-icon { + border: 1px solid #eee; + } + } + + .plugin-card-bottom { + .status { + text-align: left; + float: left; + clear: left; + width: 65%; + padding-top: 5px; + width: calc(100% - 180px); + + span.status-label { + color: #666; + + &.status-active { + color: #2a9b39; + } + + &.status-inactive { + color: #a00; + } + } + } + + .action-buttons { + float: right; + clear: right; + max-width: 180px; + + &.upgrade-plan { + margin: 0 auto; + } + } + } + } + + .plugin-card-update-failed { + .notice-error { + margin: 0; + padding: 9px 16px 8px; + + .notice-dismiss { + padding: 17px; + } + } + } + + @media screen and (max-width: 782px) { + .plugin-card { + .plugin-card-bottom { + .status { + padding-top: 9px; + } + + .action-buttons { + .button.updating-message { + &::before, + &::after { + margin-top: -1px; + } + } + } + } + } + + .plugin-card-update-failed { + .notice-error { + padding: 13px 20px; + + .notice-dismiss { + padding: 21px; + } + } + } + } +} + +.clear { + clear: both; +} + +.wrap.everest-forms div.updated, +.wrap.everest-forms div.error { + margin-top: 10px; +} + +/** * Help Tip */ - .everest-forms-help-tip { - cursor: help; - color: #666; - display: inline-block; - font-size: 1.2em; - font-style: normal; - height: 16px; - line-height: 16px; - position: relative; - vertical-align: middle; - width: 16px; - - &::after { - cursor: help; - @include icon_dashicons("\f223"); - } - } - - /** +.everest-forms-help-tip { + cursor: help; + color: #666; + display: inline-block; + font-size: 1.2em; + font-style: normal; + height: 16px; + line-height: 16px; + position: relative; + vertical-align: middle; + width: 16px; + + &::after { + cursor: help; + @include icon_dashicons("\f223"); + } +} + +/** * Notice info */ - .everest-forms-notice { - display: inline-block; - padding: 5px 15px; - margin-bottom: 15px; - border-radius: 4px; - min-width: 500px; - - &::before { - content: "\f348"; - font-size: 22px; - vertical-align: middle; - font-family: dashicons; - margin-right: 10px; - } - - &.everest-forms-notice-info { - max-width: 650px; - padding: 10px 14px; - border: 0; - border-left: 3px solid #17a2b8; - background: #edf8fa; - border-radius: 0; - color: #383838; - display: flex; - align-items: center; - margin-top: 24px; - gap: 12px; - - &::before { - // color: $blue; - color: #17a2b8; - margin-right: 0; - } - } - - &.everest-forms-notice-success { - background: lighten($green, 40%); - border: 1px solid $green; - - &::before { - color: $green; - } - } - - &.everest-forms-notice-warning { - background: lighten($orange, 45%); - border: 1px solid $orange; - - &::before { - color: $orange; - } - } - - &.everest-forms-notice-danger { - background: lighten($red, 30%); - border: 1px solid $red; - - &.everest-forms-notice-danger-text { - color: $red; - } - - &::before { - color: $red; - } - } - } - - .evf-handler-counter { - display: flex; - - .evf-handler-counter__button { - background: $color_gray-light-skin; - width: 36px; - height: 36px; - display: flex; - align-items: center; - justify-content: center; - border: 1px solid $color_gray-lighten; - cursor: pointer; - - &.evf-handler-counter__button-minus { - border-radius: 3px 0 0 3px; - } - - &.evf-handler-counter__button-plus { - border-radius: 0 3px 3px 0; - } - - &.dashicons { - font-size: 20px; - } - } - - .evf-handler-counter__input { - width: 80px; - border-radius: 0; - - &::-webkit-outer-spin-button, - &::-webkit-inner-spin-button { - -webkit-appearance: none; - margin: 0; - } - - &[type="number"] { - -moz-appearance: textfield; - } - } - } - - .everest-forms-text-info { - color: $blue; - } - - .everest-forms-text-success { - color: $green; - } - - .everest-forms-text-warming { - color: $orange; - } - - .everest-forms-text-danger { - color: $red; - } - - /** +.everest-forms-notice { + display: inline-block; + padding: 5px 15px; + margin-bottom: 15px; + border-radius: 4px; + min-width: 500px; + + &::before { + content: "\f348"; + font-size: 22px; + vertical-align: middle; + font-family: dashicons; + margin-right: 10px; + } + + &.everest-forms-notice-info { + max-width: 650px; + padding: 10px 14px; + border: 0; + border-left: 3px solid #17a2b8; + background: #edf8fa; + border-radius: 0; + color: #383838; + display: flex; + align-items: center; + margin-top: 24px; + gap: 12px; + + &::before { + // color: $blue; + color: #17a2b8; + margin-right: 0; + } + } + + &.everest-forms-notice-success { + background: lighten($green, 40%); + border: 1px solid $green; + + &::before { + color: $green; + } + } + + &.everest-forms-notice-warning { + background: lighten($orange, 45%); + border: 1px solid $orange; + + &::before { + color: $orange; + } + } + + &.everest-forms-notice-danger { + background: lighten($red, 30%); + border: 1px solid $red; + + &.everest-forms-notice-danger-text { + color: $red; + } + + &::before { + color: $red; + } + } +} + +.evf-handler-counter { + display: flex; + + .evf-handler-counter__button { + background: $color_gray-light-skin; + width: 36px; + height: 36px; + display: flex; + align-items: center; + justify-content: center; + border: 1px solid $color_gray-lighten; + cursor: pointer; + + &.evf-handler-counter__button-minus { + border-radius: 3px 0 0 3px; + } + + &.evf-handler-counter__button-plus { + border-radius: 0 3px 3px 0; + } + + &.dashicons { + font-size: 20px; + } + } + + .evf-handler-counter__input { + width: 80px; + border-radius: 0; + + &::-webkit-outer-spin-button, + &::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; + } + + &[type="number"] { + -moz-appearance: textfield; + } + } +} + +.everest-forms-text-info { + color: $blue; +} + +.everest-forms-text-success { + color: $green; +} + +.everest-forms-text-warming { + color: $orange; +} + +.everest-forms-text-danger { + color: $red; +} + +/** * Help tip */ - h2 .everest-forms-help-tip { - margin-top: -5px; - margin-left: 0.25em; - } +h2 .everest-forms-help-tip { + margin-top: -5px; + margin-left: 0.25em; +} - img.help_tip { - margin: 0 0 0 9px; - vertical-align: middle; - } +img.help_tip { + margin: 0 0 0 9px; + vertical-align: middle; +} - .postbox img.help_tip { - margin-top: 0; - } +.postbox img.help_tip { + margin-top: 0; +} - .postbox .everest-forms-help-tip { - margin: 0 0 0 9px; - } +.postbox .everest-forms-help-tip { + margin: 0 0 0 9px; +} - /** +/** * Toggle class. */ - .everest-forms-show { - display: block; - } +.everest-forms-show { + display: block; +} - .everest-forms-hidden { - display: none; - } +.everest-forms-hidden { + display: none; +} - /** +/** * Core Styling */ - .everest-forms_page_evf-builder { - .evf-shortcode-field { - display: flex; - - .widefat { - width: 100%; - } - - .evf-copy-shortcode { - margin-left: 4px; - padding: 0 4px; - line-height: 1; - } - } - } - - body.everest-forms-builder { - &.everest-forms_page_evf-builder { - #wpcontent { - padding-left: 0; - } - #wpfooter { - position: fixed; - padding: 11px 20px; - background: #f1f1f1; - border-top: 1px solid $color_gray-lighten; - display: none; - } - } - - @media screen and (max-width: 782px) { - &.everest-forms_page_evf-builder { - .auto-fold { - #wpcontent { - padding-left: 0; - } - } - } - } - } - - .everest-forms-builder, - .everest-forms-builder-setup, - .everest-forms_page_evf-settings, - .everest-forms_page_evf-tools { - .everest-forms { - margin: 0; - } - - #wpcontent { - padding-left: 0; - } - } - - /** +.everest-forms_page_evf-builder { + .evf-shortcode-field { + display: flex; + + .widefat { + width: 100%; + } + + .evf-copy-shortcode { + margin-left: 4px; + padding: 0 4px; + line-height: 1; + } + } +} + +body.everest-forms-builder { + &.everest-forms_page_evf-builder { + #wpcontent { + padding-left: 0; + } + #wpfooter { + position: fixed; + padding: 11px 20px; + background: #f1f1f1; + border-top: 1px solid $color_gray-lighten; + display: none; + } + } + + @media screen and (max-width: 782px) { + &.everest-forms_page_evf-builder { + .auto-fold { + #wpcontent { + padding-left: 0; + } + } + } + } +} + +.everest-forms-builder, +.everest-forms-builder-setup, +.everest-forms_page_evf-settings, +.everest-forms_page_evf-tools { + .everest-forms { + margin: 0; + } + + #wpcontent { + padding-left: 0; + } +} + +/** * Welcome page. */ - .dashboard_page_evf-welcome { - #message { - &.updated { - display: none; - } - } - } - - #everest-forms-welcome { - max-width: 760px; - border-radius: 4px; - margin: 3rem auto; - background: $color-white; - border: 1px solid $color_gray-lighten; - box-shadow: 0 2px 10px transparentize($color_gray-base, 0.9); - - a { - text-decoration: none; - - &:focus { - box-shadow: none; - outline: none; - } - } - - p { - font-size: 1.25em; - color: $color_gray-base; - } - - .eveverest-forms-welcome-header { - display: flex; - align-items: center; - justify-content: space-between; - padding: 1em; - border-bottom: 1px solid $color_gray-lighten; - } - - .eveverest-forms-welcome-header__logo-wrap { - display: flex; - align-items: center; - - .eveverest-forms-welcome-header__logo-icon { - margin-right: 16px; - padding-right: 16px; - border-right: 1px solid $color_gray-lighten; - - svg { - display: block; - fill: $everestforms; - width: 24px; - height: 24px; - } - } - - span { - font-size: 14px; - font-weight: 600; - } - } - - .everest-forms-welcome-container { - text-align: center; - - .everest-forms-welcome-container__header { - padding: 0 1em; - - h2 { - font-size: 1.75em; - margin-top: 1.75em; - } - - p { - margin-bottom: 1.5em; - } - } - - .everest-forms-welcome-video { - cursor: pointer; - display: flex; - position: relative; - align-items: center; - justify-content: center; - - .everest-forms-welcome-video__button { - border: none; - cursor: pointer; - font-size: 24px; - height: 40px; - width: 54px; - border-radius: 12px; - padding: 8px 15px; - position: absolute; - color: $color-white; - opacity: 0; - visibility: hidden; - transition: 0.25s ease; - background: transparentize($color_gray-base, 0.25); - - svg { - height: 24px; - width: 224px; - } - - &:hover { - background: $red; - visibility: visible; - opacity: 1; - } - } - - img { - display: block; - max-width: 100%; - - &:hover { - & + .everest-forms-welcome-video__button { - visibility: visible; - opacity: 1; - } - } - } - } - - .everest-forms-welcome-container__action { - padding: 0 32px; - margin: 3rem 0; - display: flex; - justify-content: space-between; - - .everest-forms-welcome-container__action-card { - padding: 1em; - margin: 0 1em; - width: 100%; - border-radius: 4px; - width: calc(50% - 38px); - border: 1px solid $color_gray-lighten; - transition: 0.3s ease; - - .everest-forms-welcome-container__action-card-img { - svg { - height: 64px; - width: 64px; - } - } - - .everest-forms-welcome-container__action-card-content { - h3 { - font-size: 1.23em; - margin-bottom: 0.5em; - } - - p { - margin-top: 0.5em; - } - } - - &:hover { - box-shadow: 0 2px 20px 0 - transparentize($color_gray-base, 0.85); - } - } - } - } - } - - /** +.dashboard_page_evf-welcome { + #message { + &.updated { + display: none; + } + } +} + +#everest-forms-welcome { + max-width: 760px; + border-radius: 4px; + margin: 3rem auto; + background: $color-white; + border: 1px solid $color_gray-lighten; + box-shadow: 0 2px 10px transparentize($color_gray-base, 0.9); + + a { + text-decoration: none; + + &:focus { + box-shadow: none; + outline: none; + } + } + + p { + font-size: 1.25em; + color: $color_gray-base; + } + + .eveverest-forms-welcome-header { + display: flex; + align-items: center; + justify-content: space-between; + padding: 1em; + border-bottom: 1px solid $color_gray-lighten; + } + + .eveverest-forms-welcome-header__logo-wrap { + display: flex; + align-items: center; + + .eveverest-forms-welcome-header__logo-icon { + margin-right: 16px; + padding-right: 16px; + border-right: 1px solid $color_gray-lighten; + + svg { + display: block; + fill: $everestforms; + width: 24px; + height: 24px; + } + } + + span { + font-size: 14px; + font-weight: 600; + } + } + + .everest-forms-welcome-container { + text-align: center; + + .everest-forms-welcome-container__header { + padding: 0 1em; + + h2 { + font-size: 1.75em; + margin-top: 1.75em; + } + + p { + margin-bottom: 1.5em; + } + } + + .everest-forms-welcome-video { + cursor: pointer; + display: flex; + position: relative; + align-items: center; + justify-content: center; + + .everest-forms-welcome-video__button { + border: none; + cursor: pointer; + font-size: 24px; + height: 40px; + width: 54px; + border-radius: 12px; + padding: 8px 15px; + position: absolute; + color: $color-white; + opacity: 0; + visibility: hidden; + transition: 0.25s ease; + background: transparentize($color_gray-base, 0.25); + + svg { + height: 24px; + width: 224px; + } + + &:hover { + background: $red; + visibility: visible; + opacity: 1; + } + } + + img { + display: block; + max-width: 100%; + + &:hover { + & + .everest-forms-welcome-video__button { + visibility: visible; + opacity: 1; + } + } + } + } + + .everest-forms-welcome-container__action { + padding: 0 32px; + margin: 3rem 0; + display: flex; + justify-content: space-between; + + .everest-forms-welcome-container__action-card { + padding: 1em; + margin: 0 1em; + width: 100%; + border-radius: 4px; + width: calc(50% - 38px); + border: 1px solid $color_gray-lighten; + transition: 0.3s ease; + + .everest-forms-welcome-container__action-card-img { + svg { + height: 64px; + width: 64px; + } + } + + .everest-forms-welcome-container__action-card-content { + h3 { + font-size: 1.23em; + margin-bottom: 0.5em; + } + + p { + margin-top: 0.5em; + } + } + + &:hover { + box-shadow: 0 2px 20px 0 + transparentize($color_gray-base, 0.85); + } + } + } + } +} + +/** * Branding */ - .everest-forms_page_evf-builder, - .everest-forms_page_evf-settings, - .everest-forms_page_evf-entries, - .everest-forms_page_evf-tools { - select { - max-width: inherit; - } - - .clearfix { - height: auto; - } - - // Toggle switch. - .everest-forms-toggle-form { - width: 28px; - height: 16px; - float: left; - margin-top: 3px; - margin-right: 4px; - position: relative; - - input[type="checkbox"] { - position: absolute; - top: 0; - bottom: 0; - width: 100%; - opacity: 0; - z-index: 1; - - &:checked { - + .slider { - // background-color: $green; - background-color: $evf_primary-color; - - &::before { - transform: translateX(100%); - } - } - } - } - - .slider { - cursor: pointer; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - transition: 0.4s; - background-color: #cdd0d2; - - &::before { - content: ""; - width: 12px; - height: 12px; - position: absolute; - left: 2px; - bottom: 2px; - transition: 0.4s; - background-color: $color-white; - } - - &.round { - border-radius: 16px; - - &::before { - border-radius: 50%; - } - } - } - } - - .evf-toggle-section { - display: inline-block; - - .evf-toggle-switch { - display: inline-flex; - position: relative; - line-height: 1; - margin-bottom: 0; - position: relative; - - input { - top: 0; - left: 0; - margin: 0; - z-index: 1; - opacity: 0; - padding: 0; - width: 100%; - height: 100%; - border: none; - position: absolute; - - &:checked { - + .evf-toggle-switch-wrap { - background-color: #11a0d2; - border: 2px solid #11a0d2; - border: 9px solid transparent; - - &::before { - content: ""; - height: 6px; - width: 2px; - background: #fff; - position: absolute; - left: 0; - top: 0; - transform: translateY(-50%); - } - - &::after { - border: 2px solid transparent; - } - } - - ~ .evf-toggle-switch-control { - background-color: #fff; - border-width: 0; - transform: translateX(18px) translateY(-50%); - } - - &::before { - display: none; - } - } - - &:focus { - + .evf-toggle-switch-wrap { - box-shadow: - 0 0 0 2px #fff, - 0 0 0 3px #6c7781; - } - } - } - - .evf-toggle-switch-wrap { - width: 36px; - height: 18px; - display: inline-flex; - background-color: #fff; - border: 2px solid #6c7781; - border-radius: 9px; - transition: 0.2s background ease; - position: relative; - align-items: center; - justify-content: flex-end; - - &::after { - content: ""; - width: 4px; - height: 4px; - margin-right: 2px; - border-radius: 50%; - display: inline-block; - border: 2px solid $color_gray-normal; - } - } - - .evf-toggle-switch-control { - display: block; - position: absolute; - top: 50%; - left: 4px; - width: 10px; - height: 10px; - border-radius: 50%; - transition: 0.1s transform ease; - background-color: #6c7781; - border: 5px solid #6c7781; - transform: translateY(-50%); - } - } - - label.evf-toggle-label { - display: inline-block; - margin-bottom: 0; - margin-left: 4px; - } - } - - .everest-forms-disabled { - opacity: 0.5; - pointer-events: none; - } - - // Radio and checkbox list option - .everest-forms-checklist { - margin-bottom: 14px; - - ul { - margin-bottom: 0; - - label { - font-weight: normal; - margin-bottom: 0; - margin-top: 0; - } - } - - &.everest-forms-checklist-inline { - ul { - display: flex; - flex-wrap: wrap; - - li { - margin-right: 10px; - margin-bottom: 0; - } - } - } - } - - .everest-forms-label-edit { - display: flex; - justify-content: space-between; - - .dashicons { - color: $color_gray-light; - height: 24px; - width: 24px; - cursor: pointer; - flex: 0 0 24px; - margin: 4px; - border-radius: 3px; - display: flex; - align-items: center; - justify-content: center; - opacity: 0; - visibility: hidden; - } - - &:hover, - &:active, - &:focus, - &:focus-within { - .dashicons { - visibility: visible; - opacity: 1; - } - } - - input { - margin-right: 6px; - } - } - - .everest-forms { - .loading-dot { - background: url(../images/icons/three-dots.svg); - opacity: 0.7; - width: 25px; - height: 10px; - display: inline-block; - vertical-align: middle; - background-size: 25px 10px; - } - - .everest-forms-overlay { - width: 100%; - z-index: 99999; - overflow: hidden; - background: #f1f1f1; - position: absolute; - top: 0; - bottom: 0; - height: auto; - min-height: 100vh; - - .everest-forms-overlay-content { - position: absolute; - top: 50%; - left: 0; - right: 0; - width: 128px; - height: 128px; - margin: 0 auto; - transform: translateY(-50%); - - span.loading { - display: block; - font-size: 20px; - text-align: center; - letter-spacing: 0.05em; - } - } - } - - nav.evf-nav-tab-wrapper { - padding: 0; - border: none; - display: flex; - align-items: center; - margin: 0; - // margin: 0 0 1.5em; - position: relative; - border-bottom: none; - background-color: $everestforms; - - a.nav-tab { - position: relative; - z-index: 1; - color: $color-white; - margin-left: 0; - display: block; - cursor: pointer; - font-size: 12px; - font-weight: 400; - line-height: 24px; - padding: 10px 32px; - border: none transparent; - background-color: transparent; - transition: 0.3s background-color ease-in-out; - - span { - &.evf-nav-icon { - float: none; - width: auto; - height: auto; - display: block; - font-size: 32px; - text-align: center; - - &::before { - @include iconbefore("\e001"); - margin-right: 0; - } - - &.general::before { - content: "\e001"; - } - - &.settings::before { - content: "\e002"; - } - - &.recaptcha::before { - content: "\e003"; - } - - &.email::before { - content: "\e006"; - } - - &.validation::before { - content: "\e910"; - } - - &.pdf-submission::before { - content: "\e023"; - } - - &.fields::before { - content: "\e00b"; - } - - &.payment, - &.payments { - &::before { - content: "\e01f"; - } - } - - &.integration, - &.integrations { - &::before { - content: "\e01e"; - } - } - - &.logs::before { - content: "\e02d"; - } - - &.import::before { - content: "\e02e"; - } - - &.export::before { - content: "\e02f"; - } - &.form_migrator::before { - content: "\e916"; - } - &.payment_log::before { - content: "\e918"; - } - &.permission::before { - content: "\e030"; - } - &.evf-widget::before { - content: "\e902"; - } - &.geolocation::before { - content: "\e900"; - } - &.delete::before { - content: "\e906"; - } - &.misc::before { - content: "\e911"; - } - &.ai::before { - content: "\e912"; - } - &.lookup::before { - content: "\e914"; - } - &.analytics::before { - content: "\e915"; - } - } - } - - // &.nav-tab-active { - // margin-bottom: 0; - // background-color: adjust-color($everestforms, $saturation: +20%, $lightness: +6%); - - // &:focus { - // box-shadow: none; - // } - // } - - &:focus { - box-shadow: none; - } - - // &:hover:not(.nav-tab-active) { - // background-color: adjust-color($everestforms, $saturation: -4%, $lightness: -4%); - // } +.everest-forms_page_evf-builder, +.everest-forms_page_evf-settings, +.everest-forms_page_evf-entries, +.everest-forms_page_evf-tools { + select { + max-width: inherit; + } - // &::before { - // content: ""; - // background: #8c3eeb; - // position: absolute; - // z-index: -1; - // width: 100%; - // height: 100%; - // top: 0; - // left: 0; - // opacity: 0; - // border-radius: 0 0 7px 7px; - // transition: all 0.3s ease-in-out; - // } + .clearfix { + height: auto; + } - // &:hover, - // &.nav-tab-active { - // &::before { - // top: -7px; - // opacity: 1; - // } - // } - } - } - - .everest-forms-tools, - .everest-forms-settings { - padding-left: 20px; - padding-right: 20px; - - h2 { - font-size: 20px; - } - - .form-table { - tr { - border-bottom: 1px solid $color_gray-lighten; - - &:first-child { - border-top: 1px solid $color_gray-lighten; - } - } - - th { - padding-top: 31px; - - .everest-forms-help-tip { - margin: 0; - transform: translateY(-50%); - } - } - - td:not(.everest-forms-permissions) { - padding: 25px 0; - } - - .forminp-radio-image { - ul { - margin: 0; - display: flex; - - li { - margin-right: 30px; - - label, - img { - display: block; - } - - img { - margin-bottom: 15px; - border: 2px solid $color_gray-lighten; - } - } - } - } - } - } - } - } - - /** - * Tabs - */ - .everest-forms-tab { - ul { - display: flex; - flex-wrap: wrap; - margin: 0; - - .everest-forms-tab-nav { - display: inline-flex; - margin: 0 8px 0 0; - - .everest-forms-tab-nav-link { - font-weight: 600; - padding: 16px 8px; - color: $color_gray-base; - text-decoration: none; - border-bottom: 2px solid transparent; - } - - &.active { - .everest-forms-tab-nav-link { - color: $everestforms; - border-color: $everestforms; - } - } - } - } - } - - .everest-forms-setup { - font-size: 14px; - max-width: calc(100% - 32px); - margin: 20px auto; - background: $color-white; - - @media (min-width: 960px) { - max-width: 835px; - } - - @media (min-width: 1280px) { - max-width: 1100px; - } - - a { - &:focus { - box-shadow: none; - } - } - - .page-title-action { - top: 0; - margin-left: 16px; - &:active { - top: 0; - margin-left: 16px; - } - } - - .everest-forms-setup-header { - display: flex; - flex-wrap: wrap; - align-items: center; - padding: 0 16px; - background-color: $color-white; - border-bottom: 1px solid $color_gray-lighten; - - @media only screen and (max-width: 768px) { - padding-top: 16px; - } - - .everest-forms-logo { - display: flex; - flex-wrap: wrap; - padding-right: 1em; - border-right: 1px solid $color_gray-lighten; - margin-right: 1em; - } - - h4 { - margin: 0; - } - - .everest-forms-tab { - margin-left: auto; - - @media only screen and (max-width: 768px) { - width: calc(100% + 32px); - flex: 0 0 calc(100% + 32px); - margin-top: 16px; - margin-right: -16px; - margin-left: -16px; - border-top: 1px solid $color_gray-lighten; - } - } - } - } - - /** - * Template Setup - **/ - .everest-forms { - border-radius: 4px; - - * { - box-sizing: border-box; - } - - span { - display: inline-block; - } - - .everest-forms-loader-overlay { - background: transparentize($color_gray-dark, 0.25); - position: fixed; - left: 0; - right: 0; - top: 0; - bottom: 0; - z-index: 9; - - .evf-loading { - margin: 0 auto; - position: absolute; - left: 0; - right: 0; - top: 50%; - transform: translateY(-50%); - } - } - - .everest-forms-setup-form-name { - padding: 15px 20px; - border-bottom: 1px solid $color_gray-lighten; - - .everest-forms-setup-name { - margin-left: 40px; - padding: 10px; - height: 35px; - width: 400px; - - &.everest-forms-required { - border-color: $red; - box-shadow: 0 0 2px rgba(175, 0, 0, 0.8); - } - } - } - - .evf-setup-title { - width: auto; - font-size: 24px; - line-height: 34px; - font-weight: 600; - color: $color_gray-dark; - padding: 15px 20px 10px; - - p.desc { - font-weight: normal; - } - } - - .evf-setup-templates { - display: flex; - flex-wrap: wrap; - padding: 8px; - - .evf-loading { - margin: 80px auto; - } - - .evf-template { - .everest-forms-screenshot { - cursor: pointer; - padding: 8px; - margin: 0; - min-height: auto; - position: relative; - border-radius: 4px; - background: $color_gray-more-lighten; - - @media only screen and (min-width: 1280px) { - min-height: 280px; - } - - .everest-forms-badge { - position: absolute; - bottom: 16px; - right: 16px; - z-index: 1; - } - - .form-action { - display: none; - position: absolute; - left: 0; - right: 0; - top: 50%; - transform: translateY(-50%); - z-index: 1; - - .everest-forms-btn { - &.everest-forms-btn-secondary { - background: $color-white; - } - - &:last-child { - margin-left: 8px; - } - } - } - } - - img { - display: block; - width: 100%; - } - - .everest-forms-form-id-container { - display: flex; - flex-wrap: wrap; - align-items: center; - justify-content: space-between; - position: relative; - - .everest-forms-template-name { - font-size: 16px; - font-weight: 600; - margin: 16px 0; - color: $color_gray-base; - text-decoration: none; - - &:hover { - color: $everestforms; - } - } - } - - &:hover { - .everest-forms-screenshot::after { - content: ""; - display: block; - background: transparentize($color_gray-base, 0.5); - position: absolute; - top: 0; - left: 0; - bottom: 0; - right: 0; - } - - .form-action { - display: flex; - align-items: center; - justify-content: center; - } - } - - &:nth-child(even) { - float: right; - } - - .evf-template-overlay { - position: absolute; - background-color: rgba(0, 0, 0, 0.5); - top: 0; - left: 0; - right: 0; - bottom: 0; - opacity: 0; - visibility: hidden; - transition: 0.5s background-color ease-in-out; - color: $color-white; - text-align: center; - padding: 40% 0; - - .evf-template-select { - text-decoration: none; - } - - &.loading { - .evf-button, - .evf-button::before, - .evf-button::after { - background: $color-white; - -webkit-animation: load1 1s infinite ease-in-out; - animation: load1 1s infinite ease-in-out; - width: 1em; - height: 4em; - padding: 0; - border-radius: 0; - } - .evf-button { - color: $color-white; - text-indent: -9999em; - margin: 0 auto; - position: relative; - font-size: 11px; - -webkit-transform: translateZ(0); - -ms-transform: translateZ(0); - transform: translateZ(0); - -webkit-animation-delay: -0.16s; - animation-delay: -0.16s; - } - .evf-button::before, - .evf-button::after { - position: absolute; - top: 0; - content: ""; - } - .evf-button::before { - left: -1.5em; - -webkit-animation-delay: -0.32s; - animation-delay: -0.32s; - } - .evf-button::after { - left: 1.5em; - } - @-webkit-keyframes load1 { - 0%, - 80%, - 100% { - box-shadow: 0 0; - height: 4em; - } - 40% { - box-shadow: 0 -2em; - height: 5em; - } - } - @keyframes load1 { - 0%, - 80%, - 100% { - box-shadow: 0 0; - height: 4em; - } - 40% { - box-shadow: 0 -2em; - height: 5em; - } - } - } - } - - &:hover .evf-template-overlay, - .evf-template-overlay.loading { - opacity: 1; - visibility: visible; - } - - .evf-button { - display: inline-block; - padding: 15px 22px; - background-color: $color-white; - color: #000; - font-size: 12px; - text-transform: uppercase; - border: none; - border-radius: 100px; - } - } - } - } - - /** - * Form Setup - */ - .everest-forms-builder-setup { - #screen-meta-links { - display: none; - } - - .jconfirm-everest-forms { - .jconfirm-box { - border-radius: 4px !important; - - div.jconfirm-title-c { - padding-bottom: 10px; - - .jconfirm-icon-c { - margin-bottom: 16px !important; - - .dashicons { - color: $color-white; - font-size: 28px !important; - height: 54px !important; - width: 54px !important; - border-radius: 50%; - background: $red; - line-height: 54px; - } - } - - .jconfirm-title { - font-size: 22px !important; - font-weight: 600; - } - } - - div.jconfirm-content { - margin-bottom: 0 !important; - } - } - } - - .jconfirm-everest-forms-left { - &.jconfirm-modern { - .jconfirm-box { - width: 500px !important; - padding: 20px 30px 15px; - border-radius: 4px !important; - - .jconfirm-title-c { - text-align: left; - font-size: 20px; - font-weight: 400; - padding-bottom: 0; - line-height: 1.8; - - .jconfirm-icon-c { - margin: 0; - } - } - - .jconfirm-content { - white-space: initial !important; // to avoid spacing issue on notice while installing addons - text-align: left; - margin-bottom: 0; - - input[type="text"] { - margin: 5px 2px 2px; - padding: 5px 10px; - - &:focus { - border-color: #007cba; - box-shadow: 0 0 0 1px #007cba; - } - } - } - - .jconfirm-buttons { - text-align: right; - - .everest-forms-btn { - font-weight: 400; - text-transform: none; - } - } - } - } - } - - .everest-forms-recommend-addons { - margin-top: 20px; - padding-top: 16px; - border-top: 2px solid $color_gray-more-lighten; - - .bulk-action-notice { - margin: 0 0 20px; - - p { - padding: 0; - margin: 8px 0 !important; - } - - &.notice-error { - .button-link { - text-decoration: none; - display: flex; - align-items: center; - margin-top: 8px; - - .toggle-indicator { - display: inline-flex; - } - } - - .bulk-action-errors { - margin-top: 0; - } - } - } - - .plugins-list-table { - border-radius: 4px; - - .plugin-status { - float: right; - - span { - width: 20px; - height: 20px; - overflow: hidden; - border-radius: 50%; - position: relative; - vertical-align: top; - white-space: nowrap; - text-indent: -9999px; - display: inline-block; - border: 2px solid $color_gray-lighten; - - &.active, - &.activate-now { - &::after { - position: absolute; - left: 50%; - top: 50%; - opacity: 1; - width: 34%; - height: 50%; - content: ""; - transform-origin: left top; - border-top: 2px solid $color_gray-lighten; - border-right: 2px solid $color_gray-lighten; - transform: scaleX(-1) rotate(135deg) - translate(-58%, -40%); - } - } - - &.activate-now { - border-color: $color_gray-lighten; - - &.updating-message { - border-color: $color_gray-lighten; - border-left-color: $green; - } - } - - &.active { - border-color: $green; - - &::after { - border-top: 2px solid $green; - border-right: 2px solid $green; - } - } - - &.updating-message { - border-left-color: $green; - animation: spin 0.75s linear infinite; - - &::after { - content: none; - } - } - } - } - } - - .everest-forms-template-install-addon { - margin-top: 20px; - } - } - - .everest-forms { - .evf-setup-templates { - .evf-template { - width: 100%; - background: $color-white; - border-radius: 4px; - position: relative; - margin: 12px; - - @media (min-width: 400px) { - width: calc(50% - 24px); - flex: 0 0 calc(50% - 24px); - } - - @media only screen and (min-width: 768px) { - width: calc(33.333% - 24px); - flex: 0 0 calc(33.333% - 24px); - } - - @media (min-width: 960px) { - width: calc(25% - 24px); - flex: 0 0 calc(25% - 24px); - } - } - } - } - } - // Entries page - #evf-dashboard-analytisc-body { - &::after, - &::before { - display: none; - } - } - p.search-box { - margin-top: 15px; - } - - #evf-dashboard-analytics { - .evf-container { - margin-left: 0; - margin-right: 0; - max-width: 100%; - } - } - - /** - * Form Builder - **/ - #everest-forms-panel-settings { - .evf-content-section { - display: none; - } - - .evf-content-section.active { - display: block; - } - - .everest-forms-panel-content-wrap { - .everest-forms-panel-content { - .evf-content-section, - .evf-panel-content-section { - min-height: calc(100vh - 155px); - - &.active { - padding: 18px 32px 32px; - background: #ffffff; - border-radius: 13px; - border: 1px solid #e1e1e1; - box-shadow: 0px 7px 29px 0px rgba(100, 100, 111, 0.09); - } - - &-title { - font-size: 22px; - line-height: 130%; - color: #222222; - padding-top: 6px; - } - - .everest-forms-panel-field { - input, - textarea, - select { - border-color: #e1e1e1; - padding: 3px 10px; - color: #383838; - } - - &.everest-forms-panel-field-toggle { - display: flex; - align-items: center; - justify-content: flex-end; - flex-direction: row-reverse; - gap: 8px; - - label, - .evf-toggle-section { - margin-bottom: 0; - } - - .evf-toggle-section { - .everest-forms-toggle-form { - margin: 0; - } - } - } - } - } - } - } - } - - #everest-forms-panel-payments, - #everest-forms-panel-integrations { - .evf-panel-content-section { - display: none; - } - - .evf-panel-content-section.active { - display: block; - } - - .everest-forms-panel-content-wrap { - .everest-forms-panel-content { - .evf-content-section, - .evf-panel-content-section { - min-height: calc(100vh - 155px); - - &.active { - padding: 18px 32px 32px; - background: #ffffff; - border-radius: 13px; - border: 1px solid #e1e1e1; - box-shadow: 0px 7px 29px 0px rgba(100, 100, 111, 0.09); - } - - &-title { - font-size: 22px; - line-height: 130%; - color: #222222; - padding-top: 6px; - } - - .everest-forms-panel-field { - input, - textarea, - select { - border-color: #e1e1e1; - padding: 3px 10px; - color: #383838; - } - - &.everest-forms-panel-field-toggle { - display: flex; - align-items: center; - justify-content: flex-end; - flex-direction: row-reverse; - gap: 8px; - - label, - .evf-toggle-section { - margin-bottom: 0; - } - - .evf-toggle-section { - .everest-forms-toggle-form { - margin: 0; - } - } - } - } - } - } - } - } - - .everest-forms_page_evf-builder { - .everest-forms-add-fields-group, - .everest-forms-field-option-group { - .handlediv { - float: right; - - &::before { - content: "\f142" !important; - cursor: pointer; - display: inline-block; - font: 400 20px/1 Dashicons; - line-height: 0.5 !important; - padding: 4px; - position: relative; - right: 0; - top: 0; - } - } - - &.closed { - .handlediv::before { - content: "\f140" !important; - } - } - } - - #everest-forms-builder { - width: 100%; - position: absolute; - top: 0; - bottom: 0; - min-height: calc(100vh - 32px); - - * { - box-sizing: border-box; - } - - .wp-picker-holder * { - box-sizing: content-box; - } - - #everest-forms-builder-form { - position: fixed; - } - - h2, - h3, - h4, - h5, - h6 { - color: $color_gray-dark; - } - - a { - text-decoration: none; - - &:focus { - outline: none; - box-shadow: 0 0 0 rgba(0, 0, 0, 0); - } - } - - .add, - .remove, - .addPayment, - .removePayment { - color: $color_gray-normal; - background: $color-white; - height: 30px; - width: 30px; - display: flex; - align-items: center; - justify-content: center; - border-radius: 4px; - border: 1px solid $color_gray-lighten; - - &:hover { - color: $color-white; - } - } - - .add { - &:hover { - background: $blue; - border-color: $blue; - } - } - - .remove { - margin-left: 8px; - - &:hover { - background: $red; - border-color: $red; - } - } - - .after-label-description { - float: right; - } - - input, - select, - option, - textarea { - border-color: $color_gray-lighten; - - &::placeholder { - color: $color_gray-light; - } - - &:focus { - border-color: #5b9dd9; - } - } - - .everest-forms-inner-options { - padding-left: 20px; - } - - .input-group-col-2 { - display: flex; - flex-wrap: nowrap; - - input[type="text"], - input[type="number"], - select { - flex: 0 0 50%; - margin-right: 2%; - margin-bottom: 10px; - max-width: calc(50% - 1%); - - &:nth-child(2n) { - margin-right: 0; - } - } - } - - .everest-forms-nav-wrapper { - background-color: $everestforms; - display: flex; - flex-wrap: wrap; - align-items: center; - padding-left: 24px; - - .everest-forms-logo { - border-right: 1px solid #e2e2e2; - padding: 6px 24px 6px 0; - margin-right: 24px; - - img { - width: 32px; - height: 32px; - } - } - - .everest-forms-btn { - &:focus { - box-shadow: 0 0 0 3px - adjust-color( - $everestforms, - $saturation: 39%, - $lightness: +18% - ); - } - } - - .evf-forms-nav-right { - padding: 21px 30px 19px; - margin-left: auto; - - .evf-shortcode-field { - display: inline-block; - vertical-align: middle; - - input { - margin: 0; - width: 225px; - height: 36px; - padding: 4px 10px; - line-height: 1.25; - border-radius: 3px 0 0 3px; - } - - button { - padding: 0; - width: 36px; - height: 36px; - margin-left: -4px; - border-radius: 0 3px 3px 0; - background-color: lighten($everestforms, 7%); - - &.copy-shortcode { - // font-size: 16px; - // color: $color-white; - - &::before { - @include iconbefore("\e00c"); - line-height: 27px; - margin-right: 0; - padding-right: 0; - border-right: none; - content: none; - } - - svg { - width: 24px; - height: 24px; - fill: $color-white; - margin-top: 4px; - } - } - - &:focus { - box-shadow: none; - } - } - } - - .everest-forms-embed-button { - margin-left: 6px; - vertical-align: middle; - background: #f4f4f4; - - &:active { - color: #494d50; - } - - &:focus { - box-shadow: none; - } - - &:hover { - background: rgba(255, 255, 255, 0.9); - } - - &.processing { - font-size: 0; - height: 36px; - background: transparent; - border: 1px solid #ffffff; - } - } - - .everest-forms-save-button { - min-width: 75px; - cursor: pointer; - min-height: 36px; - color: $color-white; - background: $green; - margin-left: 10px; - position: relative; - display: inline-block; - vertical-align: middle; - text-transform: uppercase; - - &.processing { - width: 75px; - font-size: 0; - min-height: 36px; - transition: all 0.35s ease 0s; - - &:focus { - box-shadow: 0 0 0 2px - adjust-color( - $everestforms, - $saturation: 39%, - $lightness: +18% - ); - } - } - - .loading-dot { - position: absolute; - top: 50%; - transform: translateY(-50%); - left: 0; - right: 0; - margin: 0 auto; - } - - .spinner, - .evf-loading { - width: 14px; - height: 14px; - margin-top: 5px !important; - margin-left: 5px !important; - background-size: 14px 14px; - } - - &:hover { - background: darken($green, 10%); - } - } - - .everest-forms-preview-button { - background: $color-white; - margin-left: 10px; - display: inline-block; - vertical-align: middle; - - &:hover { - background: transparentize($color-white, 0.1); - } - } - } - - .evf-nav-tab-wrapper { - gap: 4px; - } - } - - .evf-tab-content { - h5 { - margin: 0 auto 20px auto; - font-size: 24px; - line-height: normal; - } - - .evf_smart_tag { - input[type="text"] { - // width: calc(100% - 34px); - // min-height: 27px; - width: 100%; - min-height: 36px; - } - } - - .evf-toggle-smart-tag-display { - position: absolute; - border-radius: 4px; - background: #eeeeee; - color: #4f4f4f; - right: 4px; - width: 28px; - height: 28px; - top: 34px; - - .dashicons-editor-code { - &::before { - left: 0; - right: 0; - margin: 0 auto; - line-height: 28px; - position: absolute; - } - } - } - - .evf-smart-tag-lists { - min-height: 125px; - max-height: 300px; - border: 1px solid rgb(219, 219, 219); - right: 0; - z-index: 1; - margin-top: -1px; - width: 230px; - overflow-y: auto; - position: absolute; - background: $color-white; - border-radius: 4px; - box-shadow: 1px 3px 20px 0 transparentize($color_gray-dark, 0.8); - top: 65px; - - &::-webkit-scrollbar { - width: 6px; - } - - /* Track */ - &::-webkit-scrollbar-track { - box-shadow: inset 0 0 5px #939393; - border-radius: 10px; - } - - /* Handle */ - &::-webkit-scrollbar-thumb { - background: #787878; - border-radius: 10px; - } - - /* Handle on hover */ - &::-webkit-scrollbar-thumb:hover { - background: #3f3f3f; - } - - li, - .smart-tag-title { - padding: 7px 10px; - } - - .smart-tag-title { - font-size: 14px; - font-weight: 600; - padding: 10px 12px; - background: #e4e4e4; - color: #3a3a3a; - } - - ul { - margin: 0; - padding: 6px; - } - - li { - cursor: pointer; - margin-bottom: 0; - padding: 8px; - border-radius: 3px; - font-size: 14px; - transition: all 0.3s ease-in-out; - - &:hover { - background: #eaeaea; - } - } - } - - .evf-field-conditional-container { - .evf-field-logic { - .everest-forms-conditional-field-settings-redirect_to { - width: 120px; - } - - .everest-forms-conditional-field-settings-custom_page { - width: 150px; - } - - .remove-logic { - padding: 4px; - } - } - - // .evf-conditional-group { - // > a { - // height: 32px !important; - - // &.conditonal-rule-add { - // width: 42px !important; - // } - - // &.conditonal-rule-remove { - // width: 32px !important; - // } - // } - // } - } - - #evf-custom-css-block, - #evf-custom-js-block { - position: relative; - top: 0; - right: 0; - bottom: 0; - left: 0; - min-height: 200px; - font-size: 12px; - } - - &.everest-forms-panel-field-textarea { - .evf-smart-tag-lists { - top: 40%; - } - } - - .everest-forms-panel { - width: 100%; - display: none; - - &.active { - display: block; - } - - .everest-forms-sub-label { - font-size: 12px; - font-weight: 400; - margin-bottom: 0; - color: $color_gray-base; - } - - .everest-forms-panel-sidebar-content { - display: flex; - - .everest-forms-panel-content-wrap { - width: calc(100% - 400px); - } - } - - .everest-forms-one-half { - float: left; - width: 49%; - margin-right: 2%; - - &:nth-child(2) { - margin-right: 0; - } - } - - .everest-forms-field-row { - margin: 0 0 10px 0; - position: relative; - } - - .everest-forms-panel-sidebar { - width: 400px; - height: calc(100vh - 105px); - position: relative; - background-color: $color_gray-light-skin; - border-right: 1px solid $color_gray-lighten; - - @media screen and (max-width: 1226px) { - height: calc(100vh - 180px); - } - - #evf-collapse { - width: 22px; - height: 41px; - background: #f6f7f9; - position: fixed; - bottom: 100px; - border-style: solid; - border-width: 1px 1px 1px 0px; - border-color: #cdd0d8; - border-radius: 0 3px 3px 0; - z-index: 1; - cursor: pointer; - - &.close { - left: 559px; - - @media screen and (max-width: 960px) { - left: 315px; - } - - @media screen and (max-width: 782px) { - left: 279px; - } - - @media screen and (max-width: 600px) { - display: none; - } - } - - &.open { - left: 160px; - - svg { - transform: rotate(180deg) translateX(2px); - } - - &:hover { - svg { - transform: rotate(180deg) translateX(0px); - } - } - - @media screen and (max-width: 960px) { - left: 36px; - } - - @media screen and (max-width: 782px) { - left: 0; - } - } - - svg { - width: 12px; - height: 12px; - display: block; - transform: translateX(-2px); - transition: all 0.3s ease-in-out; - } - - &:hover { - svg { - transform: translateX(-4px); - } - } - } - - .everest-forms-input-group { - background-color: $color-white; - border: 1px solid $input-border-color; - border-radius: 4px; - - .everest-forms-input-control { - background: none; - border-color: transparent !important; - box-shadow: none; - height: 38px; - padding: 0 12px; - - &::placeholder { - font-size: 14px; - color: #999999; - } - - &:focus { - border-color: transparent; - } - } - - &__text { - background: none; - border: none; - - svg { - fill: #999999; - } - } - - &:focus-within { - border: 1px solid $everestforms; - box-shadow: 0 0 0 1px $everestforms; - } - } - - .everest-forms-fields-not-found { - text-align: center; - margin-top: 2.85em; - - .everest-forms-fields-not-found__title { - font-size: 1.7em; - } - } - - .everest-forms-add-fields-heading { - display: block; - font-size: 16px; - line-height: 150%; - font-weight: 500; - margin-bottom: 20px; - padding-bottom: 14px; - color: $color_gray-dark; - border-bottom: 1px solid $color_gray-lighten; - display: flex; - align-items: center; - justify-content: space-between; - - i { - display: flex; - align-items: center; - justify-content: center; - width: 18px; - height: 18px; - - &::before { - padding: 0; - } - } - } - - .evf-registered-buttons { - list-style: none; - padding: 0; - display: flex; - flex-wrap: wrap; - gap: 16px; - } - - .evf-registered-item { - padding: 20px 8px; - border: 1px solid $color_gray-lighten; - width: 30.3%; - z-index: 999; - color: $color_gray-light; - cursor: pointer; - border-radius: 4px; - font-size: 12px; - transition: all 0.3s ease-in-out; - text-align: center; - background-color: $color-white; - - .dashicons { - display: block; - margin: 0 auto; - } - &.evf-upgrade-addon { - cursor: not-allowed; - } - - // &.evf-upgrade-addon, - &.recaptcha_empty_key_validate, - &.turnstile_empty_key_validate, - &.hcaptcha_empty_key_validate, - &.enable-stripe-model, - &.enable-authorize-net-model, - &.enable-mollie-model - &.enable-square-model{ - opacity: 0.45; - - &:hover { - opacity: 1; - color: $evf_primary-color; - border-color: $evf_primary-color; - background: #fbf9fd; - } - } - - &.evf-upgrade-addon, - &.upgrade-modal { - position: relative; - background: #fafbfc; - border-color: #e3e6ea; - color: #ccd1d6; - - &::before { - content: ""; - background-image: url(../images/icons/evf-pro-icon.png); - background-repeat: no-repeat; - background-position: center; - background-size: 100%; - position: absolute; - border-radius: 2px; - width: 16px; - height: 16px; - top: 7px; - right: 7px; - } - } - - &:hover { - color: $evf_primary-color; - border-color: $evf_primary-color; - background: #fbf9fd; - - .evf-icon { - color: inherit; - } - - svg { - .cls-1, - .cls-2, - .cls-3 { - fill: $blue; - } - } - } - - &:focus { - outline: none; - } - - svg { - width: 40px; - height: 40px; - display: block; - margin: 0 auto 10px; - - .cls-1, - .cls-2, - .cls-3 { - fill: #414042; - transition: 0.5s fill ease-in-out; - font-size: 7px; - font-weight: 300; - } - } - - &.ui-draggable-dragging { - margin: 0; - width: 105px !important; - background-color: $color-white; - position: relative; - z-index: 99999; - - svg { - .cls-1, - .cls-2, - .cls-3 { - fill: $blue; - } - } - } - } - - .evf-setting--checkbox, - .evf-field-option--checkbox { - input, - label { - width: auto; - padding: 0; - display: inline-block; - vertical-align: top; - height: auto; - } - - input { - margin: 3px 5px 0 0; - } - } - - .everest-forms-field-options { - display: none; - - .everest-forms-border-container { - .everest-forms-field-option-row { - &.everest-forms-field-option-row-date_format { - > .inline { - margin-left: 0; - margin-right: 10px; - - &:last-child { - margin-right: 0; - } - } - } - - &:last-child { - margin-bottom: 15px; - } - } - } - - .everest-forms-field-option-row { - position: relative; - margin-bottom: 15px; - - &:last-child { - margin-bottom: 0; - } - - .inline { - margin-bottom: 0; - display: inline-block; - vertical-align: top; - margin-left: 5px; - } - - .everest-forms-current-date-format, - .everest-forms-past-date-disable-format, - .everest-forms-min-max-date-format, - .everest-forms-slot-booking { - margin-bottom: 14px; - } - - &.everest-forms-field-option-row-limit_controls, - &.everest-forms-field-option-row-min_length_controls { - display: flex; - align-items: center; - - input[type="number"] { - width: 30%; - margin-right: 8px; - } - - select { - min-height: 30px; - } - - &.everest-forms-hidden { - display: none !important; - } - } - input, - select { - height: 36px; - - &[type="checkbox"], - &[type="radio"] { - height: 16px; - } - } - - input, - select, - textarea { - &:focus { - box-shadow: none; - border-color: $evf_primary-color; - } - } - } - - .everest-forms-field-option { - display: none; - - // Email/Password Confirmation. - &.everest-forms-confirm-disabled, - &.everest-forms-field-option-email:not( - .everest-forms-confirm-enabled - ), - &.everest-forms-field-option-password:not( - .everest-forms-confirm-enabled - ) { - .everest-forms-field-option-row-sublabel_hide, - .everest-forms-field-option-row-confirmation_placeholder { - display: none; - } - } - } - - .everest-forms-field-option-phone { - .format-selected-smart { - display: none; - } - - .format-selected-default { - .everest-forms-field-option-row { - margin-bottom: 15px; - } - } - } - - .everest-forms-field-option-group { - &.everest-forms-field-option-group-basic { - .everest-forms-field-option-group-toggle { - padding-top: 0; - } - } - - &:last-child { - .everest-forms-field-option-group-inner { - border-bottom: none; - } - } - } - - .everest-forms-field-option-group-toggle { - background-color: $color_gray-light-skin; - border-bottom: 1px solid $color_gray-lighten; - padding: 15px 0; - font-size: 14px; - font-weight: 600; - display: block; - color: $color_gray-dark; - } - - .everest-forms-field-option-group-inner { - padding: 15px 0; - border-bottom: 1px solid $color_gray-lighten; - } - } - - .evf-panel-tab { - display: flex; - align-items: center; - justify-content: space-between; - padding: 15px 20px; - font-size: 14px; - font-weight: 600; - color: $color_gray-dark; - background-color: adjust-color( - $color_gray-more-lighten, - $saturation: -1, - $lightness: +2 - ); - border-bottom: 1px solid $color_gray-lighten; - position: relative; - transition: all 0.3s ease-in-out; - - &.upgrade-addons-settings { - opacity: .4; - } - - &::before { - content: ""; - background: #7545bb; - width: 4px; - height: 100%; - position: absolute; - top: 0; - left: 0; - opacity: 0; - transition: all 0.3s ease-in-out; - } - - .everest-forms-toggle-arrow { - font-size: 14px; - margin-left: auto; - line-height: 1.4; - } - - &:hover, - &.active { - position: relative; - color: $everestforms; - background-color: $color-white; - - &::before { - opacity: 1; - } - } - } - - .everest-forms-active-connections, - .everest-forms-active-email, - .everest-forms-active-sms-notifications { - display: none; - padding: 0 20px; - margin-top: -2px; - background: $color-white; - position: relative; - border-bottom: 1px solid $color_gray-lighten; - - &.active { - display: flex; - align-items: flex-end; - flex-direction: column-reverse; - - &.everest-forms-hidden { - display: none; - } - } - - .everest-forms-connections-add, - .everest-forms-email-add { - margin-bottom: 20px; - } - - .everest-forms-active-connections-list, - .everest-forms-active-email-connections-list, - .everest-forms-active-sms-notifications-connections-list { - width: 100%; - padding: 14px 16px 16px; - display: flex; - flex-wrap: wrap; - margin: 0 0 20px; - border-radius: 3px; - border: 1px solid #e9e9e9; - background: $color-white; - gap: 24px; - - &.empty-list { - display: none; - } - - h4 { - margin-top: 0; - color: #222; - font-size: 14px; - font-weight: 500; - line-height: 150%; - margin-top: 4px; - margin-bottom: 24px; - } - - li { - width: 100%; - display: flex; - padding: 10px; - cursor: pointer; - margin-bottom: 2px; - align-items: center; - justify-content: space-between; - transition: all 0.25s ease 0s; - // border: 1px solid $color_gray-lighten; - - &.active-user { - background: #f6f3fa; - border: 0; - padding: 10px; - border-radius: 3px; - - .user-nickname { - color: $everestforms; - transition: all 0.25s ease 0s; - color: $evf_primary-color; - line-height: 150%; - } - } - - &:hover { - .user-nickname { - color: $everestforms; - } - } - - .user-nickname { - color: $color_gray-base; - font-weight: 600; - } - - .evf-email-side-section { - display: flex; - align-items: center; - gap: 12px; - - .evf-toggle-section { - .everest-forms-toggle-form { - margin: 0; - } - } - - .evf-vertical-divider { - background: #bababa; - width: 1.5px; - height: 16px; - } - - a { - // display: flex; - - span { - display: flex; - align-items: center; - justify-content: center; - } - - svg { - width: 18px; - height: 18px; - fill: #999999; - transition: all 0.3s ease-in-out; - } - - &:hover { - svg { - fill: #ff2f39; - } - } - } - } - - .toggle-remove { - color: $color_gray-base; - cursor: pointer; - position: relative; - padding-left: 13px; - transition: all 0.25s ease 0s; - - &:hover { - color: $red; - - &::before, - &::after { - background: $red; - } - } - - &::before, - &::after { - top: 50%; - left: 3px; - width: 2px; - content: ""; - height: 10px; - position: absolute; - background: $color_gray-base; - display: inline-block; - transition: all 0.25s ease 0s; - } - - &::before { - transform: translateY(-50%) - rotate(45deg); - } - - &::after { - transform: translateY(-50%) - rotate(-45deg); - } - } - } - } - - .everest-forms-active-email-connections-list { - gap: 0; - } - } - - .everest-forms-active-email { - position: relative; - transition: all 0.3s ease-in-out; - - &::before { - content: ""; - background: #7545bb; - width: 4px; - height: 100%; - position: absolute; - top: 0; - left: 0; - opacity: 0; - transition: all 0.3s ease-in-out; - } - - &.active { - &::before { - opacity: 1; - } - } - - .everest-forms-email-add { - position: absolute; - top: 14px; - right: 38px; - border-radius: 3px; - background: #f6f3fa; - color: #8c64c6; - font-size: 13px; - font-weight: 400; - line-height: 150%; - padding: 6px 12px 6px 10px; - display: flex; - align-items: center; - gap: 6px; - margin: 0; - transition: all 0.3s ease-in-out; - - svg { - width: 13px; - height: 13px; - fill: #8c64c6; - transition: all 0.3s ease-in-out; - } - - &:hover { - background: #8c64c6; - color: $color-white; - - svg { - fill: $color-white; - } - } - } - } - } - - .everest-forms-field-option-date-time { - .format-selected-date .everest-forms-time, - .format-selected-time .everest-forms-date { - display: none; - } - } - - .everest-forms-field-captcha { - .format-selected-math { - font-size: 16px; - - input { - width: 70px; - display: inline-block; - } - } - - .format-selected-math .everest-forms-question, - .format-selected-question .everest-forms-equation { - display: none; - } - } - - .everest-forms-field-option-address { - .default, - .placeholder { - width: 44%; - float: left; - margin-right: 2%; - - input { - width: 99%; - } - - label { - font-weight: 400; - } - } - - .hide { - input { - margin: 7px 0 0 0; - } - } - } - - &-sidebar-content { - &.collapsed { - .everest-forms-panel-sidebar { - width: 0px; - } - - .everest-forms-panel-content-wrap { - width: 100% !important; - - // @media screen and (max-width: 960px) { - // width: 100% !important; - // } - } - } - } - } - - .everest-forms-panel-content-wrap { - .evf-admin-row { - display: flex; - position: relative; - margin-bottom: 15px; - background-color: transparent; - border: 1px solid transparent; - transition: - 0.5s border, - 0.5s background-color; - - &:last-child { - margin-bottom: 0; - } - - .evf-toggle-row { - top: 0; - right: 0; - opacity: 0; - display: flex; - cursor: pointer; - position: absolute; - visibility: hidden; - color: $color-white; - transition: 0.7s all; - z-index: 9999; - - .evf-show-grid { - &:hover { - span { - &.dashicons { - background-color: $green; - } - } - } - } - - .evf-delete-row { - span { - &.dashicons { - // border-right: 1px solid transparentize($color-white, 0.8); - border-right: 1px solid #fff; - } - } - - &:hover { - span { - &.dashicons { - background-color: $red; - } - } - } - } - - .evf-duplicate-row { - span { - &.dashicons { - border-radius: 0 0 0 3px; - border-right: 1px solid - transparentize($color-white, 0.8); - } - } - - &:hover { - span { - &.dashicons { - background-color: $blue; - } - } - } - } - - span { - &.dashicons { - // background: $color_gray-base; - font-size: 14px; - height: auto; - width: auto; - // color: $color-white; - padding: 5px; - background: #e9e9e9; - color: #666666; - - &:hover { - color: #fff; - } - } - } - - .evf-toggle-row-content { - display: none; - position: absolute; - width: 160px; - padding: 20px; - text-align: center; - right: -10px; - border-radius: 5px; - background-color: $color-white; - font-weight: 600; - font-size: 12px; - top: 35px; - transition: 0.9s background-color; - border: 1px solid $color-gray-lighten; - box-shadow: 1px 2px 10px 0 - transparentize($color_gray-dark, 0.85); - - &::before, - &::after { - content: ""; - position: absolute; - } - - &::before { - top: -7px; - right: 14px; - border-right: 7px solid transparent; - border-bottom: 7px solid $color-white; - border-left: 7px solid transparent; - } - - &::after { - top: -8px; - right: 12px; - border-right: 9px solid transparent; - border-bottom: 9px solid $color-gray-lighten; - border-left: 9px solid transparent; - z-index: -1; - } - - > span { - color: $color_gray-base; - display: block; - } - - small { - color: $color_gray-light; - margin-bottom: 10px; - display: block; - } - - .evf-grid-selector { - margin: 3px; - width: 40px; - height: 30px; - display: inline-block; - border: 1px solid $color_gray-lighten; - - span { - height: 100%; - display: inline-block; - background: $color-white; - - &:nth-child(n + 1) { - border-left: 1px solid - $color_gray-lighten; - } - &:nth-child(1) { - border-left: 0 none; - } - } - - &.active { - border-color: $blue; - - span { - border-color: $blue; - } - } - } - } - } - - &.evf-hover { - // background-color: lighten($blue, 48%); - // border: 1px dashed $blue; - background: #fcfcfc; - border: 1px solid #e7e7e7; - border-radius: 5px; - - .evf-admin-grid { - // border: 1px dashed $color-gray-light; - background: transparent; - } - - .evf-toggle-row { - opacity: 1; - visibility: visible; - } - } - - .evf-admin-grid { - padding: 20px; - cursor: pointer; - background: $color-white; - position: relative; - border: 1px solid transparent; - transition: - 0.5s border, - 0.5s background-color; - - &.evf-hover { - &.evf-item-hover { - position: relative; - - .everest-forms-field, - .evf-registered-item { - &:nth-last-child(2) { - margin-bottom: 0; - - &.active { - margin-bottom: 10px; - } - } - } - - &::before { - display: none; - } - } - } - - &.evf-grid-1 { - width: 100%; - } - - &.evf-grid-2 { - width: 50%; - } - - &.evf-grid-3 { - width: 33.3333%; - } - - &.evf-grid-4 { - width: 25%; - } - - .evf-registered-item { - padding: 20px; - font-size: 18px; - min-height: 94px; - margin-bottom: 10px; - - &:last-child { - margin-bottom: 0; - } - - &.ui-draggable { - width: 100%; - - .evf-icon { - display: inline-block; - } - } - - .evf-icon { - font-size: 24px; - vertical-align: middle; - } - - .spinner { - float: none; - width: 25px; - height: 25px; - margin: 10px 0 5px 10px; - } - - .dashicons { - font-size: 22px; - margin-top: 3px; - } - } - - .ui-sortable-placeholder { - width: 100%; - visibility: visible !important; - background-color: lighten($green, 42%); - border: 1px dashed lighten($green, 15%); - } - - &.evf-empty-grid { - display: flex; - align-items: center; - justify-content: center; - position: relative; - border: 1px dashed $color-gray-light; - - &::before { - content: "\f132"; - font-size: 40px; - font-family: dashicons; - line-height: 1.2; - cursor: all-scroll; - color: $color_gray-lighten; - } - } - } - } - - .everest-forms-field-payment-single { - .widefat, - .item-price-hidden { - display: none; - } - .item-price-hidden { - margin: 0; - color: #999; - font-size: 12px; - } - - .format-selected-user { - .widefat { - display: block; - } - .item-price { - display: none; - } - } - - .format-selected-hidden { - .item-price-hidden { - display: block; - } - } - } - - .everest-forms-field { - cursor: move; - padding: 15px; - position: relative; - margin-bottom: 10px; - border: 1px solid transparent; - border-radius: 3px; - transition: 0.5s box-shadow; - - .everest-forms-image-choices { - .everest-forms-image-choices-item { - label { - font-weight: normal; - margin-bottom: 0; - } - - .everest-forms-image-choices-image { - display: block; - margin-bottom: 10px; - - img { - max-width: 100%; - display: block; - } - } - } - } - - // column layout for choice fields - &.everest-forms-list-2-columns, - &.everest-forms-list-3-columns { - ul { - display: flex; - flex-wrap: wrap; - margin-left: -15px; - margin-right: -15px; - - li { - padding-left: 15px; - padding-right: 15px; - } - } - } - - &.everest-forms-list-2-columns { - li { - flex: 0 0 50%; - max-width: 50%; - - &:nth-child(1n + 3) { - margin-top: 10px; - } - } - } - - &.everest-forms-list-3-columns { - li { - flex: 0 0 33.333%; - max-width: 33.333%; - - &:nth-child(1n + 4) { - margin-top: 10px; - } - } - } - - &.everest-forms-list-inline { - ul { - li { - display: inline-block; - margin-right: 15px; - } - } - } - - &:last-child { - margin-bottom: 0; - } - - &.everest-forms-field--first, - &.everest-forms-field--last { - width: 48.5%; - margin-right: 3%; - float: left; - } - - &.everest-forms-field--last { - margin-right: 0; - float: right; - } - - &.active { - margin: 0 0 10px; - // border: 1px solid $color_gray-lighten; - border: 1px solid #d7d9e0; - // background: $color_gray-light-skin; - background: #f9f9f9; - - .evf-field-action { - opacity: 1; - visibility: visible; - } - - &:last-child { - margin-bottom: 0; - } - } - - &.required label { - .required { - font-weight: 300; - margin: 0 0 0 5px; - display: inline-block; - vertical-align: middle; - } - } - - &.ui-sortable-placeholder { - border: 1px dashed transparentize($blue, 0.75); - } - - &.label_hide { - input[type="text"] { - margin-bottom: 0; - } - - .description { - margin-top: 5px; - - &:empty { - margin-top: 0; - } - } - } - - input { - &[type="text"], - &[type="email"] { - margin-bottom: 5px; - } - - &[type="checkbox"], - &[type="radio"] { - margin-right: 10px; - } - } - - select, - textarea { - margin-bottom: 5px; - } - - select { - option { - color: inherit; - - &.placeholder { - opacity: 0.5; - } - } - - &[multiple] { - padding: 6px 8px; - box-shadow: none; - } - } - - canvas { - border: 1px solid rgba(222, 222, 222, 0.75); - } - - &.everest-forms-field-select { - select:not([multiple]) { - height: 35px; - } - } - - .select2-container { - margin-bottom: 5px; - width: 100% !important; - - span.selection { - width: 100% !important; - } - - .select2-selection--multiple { - border-color: $color_gray-lighten; - } - - .select2-selection__choice { - margin: 4px 4px 0 0; - } - - .select2-search__field { - min-height: 24px; - line-height: 1.4; - } - } - - .evf-field-action { - position: absolute; - // top: 15px; - // right: 15px; - top: 6px; - right: 1px; - visibility: hidden; - opacity: 0; - transition: 0.5s all; - - a { - padding: 5px; - // color: $color-white; - // background: $color_gray-base; - // border-right: 1px solid transparentize($color-white, 0.8); - background: #e9e9e9; - border-right: 1px solid #fff; - color: #666666; - - &:first-child { - // border-radius: 3px 0 0 3px; - border-radius: 0 0 0 3px; - } - - &:last-child { - // border-radius: 0 3px 3px 0; - border-radius: 0 3px 0 0; - border-right: none; - } - - &.everest-forms-field-delete:hover { - background-color: $red; - } - - &:hover { - color: #fff; - background-color: $blue; - } - } - - .dashicons { - font-size: 15px; - height: auto; - width: auto; - } - } - - &.label_hide { - .label-title { - display: none; - } - } - - &.sublabel_hide { - .everest-forms-sub-label { - display: none; - } - } - - .everest-forms-confirm-enabled { - display: flex; - - .everest-forms-confirm-primary, - .everest-forms-confirm-confirmation { - width: 50%; - flex-wrap: wrap; - } - - .everest-forms-confirm-primary { - padding-right: 15px; - } - - .everest-forms-confirm-confirmation { - padding-left: 15px; - } - } - - .everest-forms-confirm-disabled { - .everest-forms-confirm-primary { - .everest-forms-sub-label { - display: none; - } - } - - .everest-forms-confirm-confirmation { - display: none; - } - } - - &:hover { - border-radius: 3px; - border: 1px dashed #8c64c6; - background: #f8f8fa; - - .evf-field-action { - visibility: visible; - opacity: 1; - } - } - - &.ui-sortable-helper { - padding: 20px 30px; - height: auto !important; - left: -20px; - right: -20px; - background-color: $color-white; - - &:hover { - .evf-field-action { - display: none; - } - } - } - - label { - cursor: all-scroll; - } - - img { - width: 280px; - height: auto; - } - } - - .file-uploader { - width: 100%; - border: 2px dashed $color_gray-lighten; - background-color: $color_gray-light-skin; - border-radius: 3px; - cursor: pointer; - text-align: center; - padding-top: 30px; - padding-bottom: 30px; - position: relative; - - svg { - width: 30px; - height: 30px; - fill: #bbbcbd; - margin-bottom: 20px; - } - - input { - &.file-input { - touch-action: manipulation; - max-width: 100%; - min-width: 14px; - margin: 0; - opacity: 0; - height: 18px; - } - } - - .drop { - display: block; - font-size: 14px; - font-weight: 600; - color: $color_gray-light; - margin-bottom: 10px; - } - - .or { - font-size: 12px; - color: $color-gray-light; - font-weight: 600; - display: block; - margin-bottom: 10px; - } - - .file-control { - position: absolute; - bottom: 30px; - color: $blue; - padding-bottom: 2px; - display: block; - left: 0; - right: 0; - - &::before { - content: ""; - width: 45px; - background-color: $blue; - height: 1px; - display: block; - left: 50%; - bottom: -2px; - position: absolute; - transform: translateX(-50%); - } - } - } - - .publishing-action { - width: 100%; - text-align: right; - } - - .submit-button { - display: inline-block; - font-size: 12px; - font-weight: 600; - color: $color-white; - padding: 15px 20px; - border: 0 none; - background-color: $green; - border-radius: 3px; - } - } - - label { - font-size: 14px; - margin-bottom: 10px; - // color: $color_gray-base; - color: #222222; - display: block; - font-weight: 600; - - i { - color: $color_gray-light; - font-size: 16px; - line-height: 1.2; - } - - .required { - color: $red; - display: none; - } - - input { - &[type="checkbox"], - &[type="radio"] { - margin-right: 10px; - } - } - - &.evf-toggle-switch { - margin-bottom: 0; - } - - &.evf-toggle-label { - display: inline-block; - margin-bottom: 0; - } - - &.everest-forms-hidden { - display: none; - } - - &.evf-privacy-policy-consent-message { - display: initial; - margin-bottom: 0; - } - } - - .everest-forms-label-edit { - margin-bottom: 4px; - - label { - margin-bottom: 4px; - padding: 4px 0; - flex: 1; - } - - input { - font-size: 13px; - font-weight: 600; - } - - .dashicons { - margin-right: 7px; - } - } - - input:not(.ed_button), - textarea:not(.wp-editor-area) { - color: $color_gray-base; - - &::placeholder { - color: $color_gray-light; - } - } - - textarea, - textarea:not(.wp-editor-area) { - height: 120px; - - &.short { - height: 60px; - } - } - - .description { - color: $color_gray-normal; - } - - .everest-forms-checklist { - ul { - label { - margin-top: 0; - margin-bottom: 0; - font-weight: normal; - } - } - } - - .everest-forms-question { - margin-top: 0; - line-height: 1.2; - } - - .evf-grid-lists { - margin-left: -1.5%; - margin-right: 1.5%; - background-color: $color_gray-light-skin; - display: flex; - - .evf-grid-lists-item { - padding-left: 1.5%; - padding-right: 1.5%; - background-color: $color-white; - } - } - - .evf-content-section-title { - position: relative; - font-size: 22px; - font-weight: 600; - line-height: 130%; - margin-bottom: 20px; - padding-bottom: 20px; - display: flex; - align-items: center; - justify-content: space-between; - color: #222222; - border-bottom: 1px solid #e9e9e9; - - .evf-title { - margin-right: 20px; - } - - .evf-enable-email-toggle { - position: absolute; - top: 15px; - right: -20px; - - img { - width: 100%; - height: auto; - } - } - - .evf-toggle-section { - margin-top: 2px; - } - } - - .everest-forms-panel-field { - position: relative; - margin-bottom: 20px; - max-width: 740px; - - .wp-editor-container { - margin-bottom: 10px; - border-radius: 4px; - - .quicktags-toolbar { - border-radius: 4px 4px 0 0; - } - - textarea { - border-radius: 0 0 4px 4px; - } - } - - .submission-date-wrapper { - .evf-form-row { - margin-left: 0; - margin-right: 0; - - .evf-form-col-12 { - gap: 12px; - - .everest-forms-panel-field-checkbox { - margin-bottom: 12px; - - input[type="checkbox"] { - margin-right: 8px; - } - } - } - } - } - - input, - select, - textarea { - &:focus { - box-shadow: none; - border-color: $evf_primary-color; - } - } - - .desc { - margin: 10px 0; - font-style: italic; - line-height: 1.2; - } - - .evf-hidden-content { - margin-top: 10px; - } - - .max-entry-section { - .max-entry-section-content { - display: flex; - - .everest-forms-panel-field { - margin-bottom: 0; - } - - .entry-period { - flex: 1; - margin-left: 10px; - } - } - } - - &.everest-forms-panel-field-tinymce { - .evf-toggle-smart-tag-display { - top: 38px; - right: 8px; - border: 1px solid #e1e1e1; - } - - .evf-smart-tag-lists { - top: 70px; - } - } - - &#everest-forms-panel-field-settings-query_string-wrap { - .evf-toggle-smart-tag-display { - top: 32px; - } - } - - &.evf_conditional_logic_container { - label { - margin-bottom: 0; - display: inline-block; - } - } - } - - .evf-choices-list { - background: $color_gray-more-lighten; - border-radius: 4px; - padding: 1px 8px; - - .sort { - cursor: grab; - display: flex; - margin-top: 6px; - padding-right: 6px; - color: $color_gray-light; - - svg { - fill: currentColor; - transform: rotate(90deg); - } - - &:active { - cursor: grabbing; - } - } - - li { - background: $color-white; - border: 1px solid $color_gray-lighten; - display: flex; - flex-wrap: wrap; - padding: 8px; - margin: 8px 0; - z-index: 99999 !important; - - .evf-choice-list-input { - flex: 1; - margin-right: 6px; - } - - input { - &[type="text"] { - width: 100%; - } - - &[type="radio"], - &[type="checkbox"] { - margin: 7px 6px 0 0; - } - - &.value { - display: none; - margin-top: 8px; - - &.evf-money-input { - width: 22%; - display: inline-block; - margin: 0 0 0 auto; - flex: 0 0 22%; - } - } - } - - .everest-forms-attachment-media-view { - flex: 100%; - display: none; - margin-top: 8px; - - .button-add-media { - width: 100%; - padding: 8px; - outline: none; - cursor: pointer; - border-radius: 3px; - color: $color_gray-base; - border: 1px dashed $color-gray-lighten; - } - - .thumbnail-image { - display: block; - max-height: 200px; - margin-bottom: 3px; - border-radius: 4px; - position: relative; - overflow: hidden; - - img { - display: block; - max-width: 100%; - user-select: none; - border-radius: 4px; - } - } - - .actions { - margin-top: 8px; - } - } - - &.ui-sortable-placeholder { - visibility: visible !important; // Overwrite CSS over JS. - background: $color_gray-more-lighten; - border: 1px dashed $color_gray-lighten; - } - - &.ui-sortable-helper { - z-index: 99999 !important; // Overwrite CSS over JS. - } - } - - .add, - .remove { - display: inline-flex; - align-items: center; - justify-content: center; - width: 20px; - height: 20px; - margin-top: 5px; - border: none; - - .dashicons { - width: 16px; - height: 16px; - font-size: 16px; - } - } - - .add { - &:hover { - color: $blue; - background: none; - } - } - - .remove { - margin-left: 0; - - &:hover { - color: $red; - background: none; - } - } - - &.show-images { - li { - .everest-forms-attachment-media-view { - display: block; - } - } - } - - &.show-values { - li { - input[type="text"].value { - display: block; - } - } - } - } - - .everest-forms-field-option-row-choices_images { - .notice { - display: inline-block; - margin: 0 0 15px 0 !important; - - &.hidden { - display: none; - } - } - } - - .everest-forms-field-option-row-rows, - .everest-forms-field-option-row-columns, - .everest-forms-field-option-row-drop_down_choices, - .everest-forms-field-option-row-choices, - .everest-forms-field-option-row-questions { - ul { - li { - clear: both; - padding: 5px 10px; - border-radius: 4px; - border: 1px solid transparent; - } - } - - .evf-questions-list { - li { - padding: 10px; - background: $color-white; - margin-bottom: 10px; - border: 1px solid $color_gray-lighten; - - input[type="text"] { - width: calc(100% - 39px); - } - - .answer-wrap { - margin-top: 6px; - } - } - } - - .question-wrap, - .answer-wrap { - input { - margin-right: 8px; - vertical-align: middle; - } - - .add, - .remove { - width: 30px; - height: 30px; - display: inline-flex; - vertical-align: middle; - border-radius: 3px; - border: 1px solid $color_gray-lighten; - } - - .add { - &:hover { - background: $blue; - border-color: $blue; - } - } - - .remove { - &:hover { - background: $red; - border-color: $red; - } - } - } - } - - .everest-forms-field-option-payment-multiple, - .everest-forms-field-option-payment-checkbox { - .everest-forms-field-option-row { - li { - input[type="text"] { - width: 73%; - margin-right: 8px; - - &.evf-money-input { - width: 23%; - display: inline-block; - margin: 0 0 0 auto; - flex: 0 0 23%; - } - } - } - } - } - - .evf-content-email-settings-inner { - display: none; - -webkit-animation: fadeIn 0.5s; - animation: fadeIn 0.5s; - margin: 20px 0; - border-radius: 4px; - - &.active-connection { - display: block; - - &.everest-forms-hidden { - display: none; - } - } - } - - .evf-content-sms-notifications-settings-inner { - display: none; - -webkit-animation: fadeIn 0.5s; - animation: fadeIn 0.5s; - margin: 20px 0; - border-radius: 4px; - - &.active-connection { - display: block; - - &.everest-forms-hidden { - display: none; - } - } - } - } - - .evf-registered-item { - z-index: 999; - cursor: pointer; - border-radius: 2px; - font-size: 12px; - text-align: center; - margin: 0; - background-color: $color-white; - border: 1px solid $color_gray-lighten; - color: $color_gray-normal; - - .evf-icon { - color: inherit; - display: block; - // font-size: 32px; - font-size: 28px; - text-align: center; - margin-bottom: 6px; - padding: 0; - } - - &.ui-draggable-dragging { - width: calc(100% - 20px) !important; - text-align: center !important; - font-size: 12px !important; - } - - &.ui-sortable-placeholder { - width: 100% !important; - } - } - - .everest-forms-field.ui-draggable-dragging { - margin: 0; - width: 105px !important; - background-color: $color-white; - text-align: center; - font-size: 12px !important; - - .evf-icon { - color: inherit; - display: block !important; - font-size: 32px !important; - } - } - - .everest-forms-border-container { - border: 1px solid #e9e9e9; - background: #fcfcfd; - border-radius: 5px; - padding: 18px 22px 6px; - margin-bottom: 20px; - max-width: 740px; - - &:last-child { - margin-bottom: 0; - } - - .everest-forms-border-container-title { - // display: inline-block; - color: #222222; - font-size: 18px; - font-weight: 600; - line-height: 140%; - background: transparent; - margin: 0 0 16px; - padding-bottom: 14px; - border-bottom: 1px solid #e9e9e9; - } - - label { - margin-bottom: 10px; - margin-top: 2px; - - .everest-forms-help-tooltip { - height: 16px; - width: 16px; - line-height: 1; - vertical-align: middle; - } - } - - select { - // margin-bottom: 14px; - } - - .inline { - margin-top: 0; - padding-left: 0; - } - - .input-group-col-2 { - margin-bottom: 15px; - - input[type="text"], - input[type="number"], - select { - margin-bottom: 0; - margin-left: 0; - } - } - } - - .everest-forms-tab-content { - position: relative; - // height: calc(100vh - 200px); - - .everest-forms-add-fields-group { - margin-bottom: 36px; - - &.closed { - margin-bottom: 0; - } - } - - .everest-forms-notice { - display: inline-block; - } - } - - .everest-forms-panel { - .panel-wrap { - overflow: hidden; - } - - .wp-picker-input-wrap { - label { - font-weight: 400; - display: inline-block; - } - } - } - - .everest-forms-panel-content-wrap { - .everest-forms-panel-content { - position: relative; - padding: 30px; - background: #f6f7f9; - height: calc(100vh - 105px); - overflow-x: hidden !important; - - @media screen and (max-width: 1226px) { - height: calc(100vh - 180px); - } - - /* width */ - &::-webkit-scrollbar { - width: 6px; - } - - /* Track */ - &::-webkit-scrollbar-track { - box-shadow: inset 0 0 5px rgb(158, 158, 158); - border-radius: 10px; - } - - /* Handle */ - &::-webkit-scrollbar-thumb { - background: rgb(93, 93, 93); - border-radius: 10px; - } - - /* Handle on hover */ - &::-webkit-scrollbar-thumb:hover { - background: #454545; - } - - .everest-forms-preview-wrap { - background: #ffffff; - padding: 28px 32px; - border-radius: 9px; - border: 1px solid #e1e1e1; - box-shadow: 0px 7px 29px 0px rgba(100, 100, 111, 0.09); - } - - .evf-content-sms-notifications-settings { - .evf-content-sms-notifications-settings-inner { - padding: 20px 20px 0; - border: 1px solid $color_gray-lighten; - - .everest-forms-sms-notfications-name { - background: $color_gray-light-skin; - margin-left: -20px; - margin-top: -20px; - margin-right: -20px; - padding: 20px; - border-radius: 4px 4px 0 0; - border-bottom: 1px solid $color_gray-lighten; - - input[type="text"] { - font-weight: 600; - } - - .everest-forms-text-danger { - margin: 10px 0 0; - } - } - } - } - - .evf-content-email-settings { - .evf-content-email-settings-inner { - // padding: 20px 20px 0; - padding: 18px 22px 24px; - // border: 1px solid $color_gray-lighten; - border: 1px solid #e2e2e2; - max-width: 740px; - - .everest-forms-email-name { - background: transparent; - // margin-left: -20px; - // margin-top: -20px; - // margin-right: -20px; - // padding: 20px; - padding: 0; - border-radius: 4px 4px 0 0; - // border-bottom: 1px solid $color_gray-lighten; - border-bottom: 1px solid #e2e2e2; - margin-bottom: 20px; - - input[type="text"] { - font-weight: 600; - border: 0; - padding: 0; - font-size: 18px; - line-height: 140%; - color: #222; - padding-bottom: 14px; - } - - .everest-forms-text-danger { - margin: 10px 0 0; - } - } - } - } - - .evf-content-post-submissions-settings, - .evf-content-user-registration-settings { - .everest-forms-panel-field { - max-width: 500px; - } - } - - .everest-forms-title-desc { - display: inline-flex; - align-items: center; - flex-direction: row-reverse; - position: relative; - margin-bottom: 10px; - - .evf-icon { - display: flex; - align-items: center; - justify-content: center; - width: 32px; - height: 32px; - cursor: pointer; - border-radius: 3px; - color: $color_gray-normal; - background: $color_gray-more-lighten; - - &::after { - content: ""; - border-radius: 3px; - position: absolute; - left: 32px; - right: calc(100% - 36px); - height: 30px; - border-radius: 0 3px 3px 0; - transition: all 0.3s ease 0s; - } - } - - .everest-forms-name-input { - font-size: 1.3em; - font-weight: 600; - height: 32px; - border: none; - margin: 0; - box-shadow: none; - pointer-events: none; - background: none; - z-index: 1; - padding: 0 12px; - - &.everst-forms-name-editing { - pointer-events: all; - - & + .evf-icon { - background: $everestforms; - color: $color-white; - border-radius: 4px 0 0 4px; - - &::after { - top: 0; - right: 0; - border: 1px solid $everestforms; - } - } - } - - &:focus { - box-shadow: none; - } - } - } - - .evf-admin-field-wrapper { - cursor: move; - position: relative; - - .evf-sortable-placeholder { - background-color: transparentize($green, 0.95); - border: 1px dashed transparentize($green, 0.75); - } - } - - .evf-add-row { - margin: 20px auto 0; - text-align: center; - - span { - // width: auto; - height: auto; - // font-size: 13px; - // background: #51cf66; - font-family: inherit; - padding: 8px 16px 8px 14px; - display: flex; - align-items: center; - justify-content: center; - width: max-content; - margin: 0 auto; - gap: 6px; - font-size: 14px; - background: #7e3bd0; - transition: all 0.3s ease-in-out; - - &.dashicons { - &::before { - // width: 20px; - // height: 20px; - // line-height: 1; - font-size: 16px; - // margin-right: 10px; - font-family: dashicons; - vertical-align: middle; - // padding: 2px 12px 2px 0; - // border-right: 1px solid - // transparentize($color-white, 0.7); - width: auto; - height: auto; - margin: 0; - padding: 0; - border-right: 0; - } - } - - &:hover { - // background: #33ba4a; - background: #8d2fff; - } - } - } - .evf-add-row-repeater { - margin: 20px auto; - text-align: left; - pointer-events: none; - - span { - width: auto; - height: auto; - padding: 10px; - font-size: 13px; - background: #51cf66; - color: $color-white; - font-family: inherit; - - &.dashicons { - &::before { - width: 20px; - height: 20px; - line-height: 1; - font-size: 16px; - margin: 0 10px 0 10px; - font-family: dashicons; - text-align: center; - vertical-align: middle; - padding: 10px; - cursor: text; - border-right: none; - } - } - - &:hover { - background: #33ba4a; - } - } - } - } - } - - .everest-forms-fields-tab { - display: flex; - flex-wrap: wrap; - - a { - width: 50%; - display: block; - padding: 15px 0; - font-size: 14px; - line-height: 150%; - font-weight: 600; - text-align: center; - color: $color_gray-dark; - background: $color_gray-more-lighten; - border-bottom: 1px solid $color_gray-lighten; - - &.active { - background: $color_gray-light-skin; - border-bottom: 1px solid transparent; - } - - &:first-child { - border-right: 1px solid $color_gray-lighten; - } - } - } - - .everest-forms-panel-sidebar { - .everest-forms-add-fields, - .everest-forms-field-options { - padding: 32px 14px; - } - .everest-forms-add-fields { - .everest-forms-input-group { - margin-bottom: 26px !important; - } - } - } - - .evf-range-slider-reset-icon { - width: 16px; - height: 16px; - font-size: 16px; - cursor: pointer; - margin-left: 10px; - color: $color_gray-light; - transition: all 0.2s ease 0s; - } - .everest-forms-field { - &.everest-forms-field-image-upload { - .everest-forms-uploader { - display: flex; - flex-direction: column; - align-items: center; - padding: 20px; - border-radius: 4px; - border: 1px dashed $color_gray-lighten; - - svg { - margin-bottom: 10px; - background: $color_gray-light-skin; - height: 48px; - width: 48px; - padding: 8px; - border-radius: 4px; - } - - span { - display: block; - font-size: 14px; - - &.everest-forms-upload-title { - margin-bottom: 5px; - } - - &.everest-forms-upload-hint { - color: $color_gray-light; - } - } - } - - input { - display: none; - } - - &.active { - svg { - background: darken($color_gray-light-skin, 5%); - } - } - } - } - } - } - - /** - * Settings styling. - **/ - .everest-forms { - h2.evf-nav-tab-wrapper { - margin-bottom: 1em; - } - - nav.evf-nav-tab-wrapper { - margin: 1.5em 0 1em; - } - - .subsubsub { - margin: -8px 0 0; - } - - .evf-admin-breadcrumb { - margin-left: 0.5em; - a { - color: #a46497; - } - } - - #template div { - margin: 0; - - p .button { - float: right; - margin-left: 10px; - margin-top: -4px; - } - - .editor textarea { - margin-bottom: 8px; - } - } - - textarea[disabled="disabled"] { - background: #dfdfdf !important; - } - - table.form-table { - margin: 0; - position: relative; - table-layout: fixed; - - .forminp-radio { - ul { - margin: 0; - - li { - line-height: 1.4em; - } - - &.everest-forms-recaptcha-type { - display: flex; - - li { - margin-right: 15px; - margin-bottom: 0; - - label { - margin-bottom: 0 !important; - margin-top: 5px !important; - } - } - } - } - } - - input[type="text"], - input[type="number"], - input[type="email"] { - height: auto; - } - - textarea.input-text { - height: 100%; - min-width: 150px; - display: block; - } - - // Give regular settings inputs a standard width and padding. - textarea, - input[type="text"], - input[type="email"], - input[type="number"], - input[type="password"], - input[type="datetime"], - input[type="datetime-local"], - input[type="date"], - input[type="time"], - input[type="week"], - input[type="url"], - input[type="tel"], - input.regular-input { - margin: 0; - padding: 0 8px; - width: 350px; - box-sizing: border-box; - vertical-align: top; - - @media only screen and (max-width: 782px) { - width: 100%; - } - } - - input[type="datetime-local"], - input[type="date"], - input[type="time"], - input[type="week"], - input[type="tel"] { - width: 200px; - } - - select { - width: 350px; - margin: 0; - box-sizing: border-box; - height: 32px; - vertical-align: top; - - @media only screen and (max-width: 782px) { - width: 100%; - } - } - - input[size] { - width: auto !important; - } - - // Ignore nested inputs. - table { - select, - textarea, - input[type="text"], - input[type="email"], - input[type="number"], - input.regular-input { - width: auto; - } - } - - textarea.wide-input { - width: 100%; - } - - img.help_tip, - .everest-forms-help-tip { - padding: 0; - margin: -4px 0 0 5px; - vertical-align: middle; - cursor: help; - line-height: 1; - } - - span.help_tip { - cursor: help; - color: $blue; - } - - th { - width: 270px; - position: relative; - padding-right: 24px; - } - - th label { - position: relative; - display: block; - - img.help_tip, - .everest-forms-help-tip { - margin: -7px -24px 0 0; - position: absolute; - right: 0; - top: 50%; - - @media only screen and (max-width: 782px) { - right: auto; - margin-left: 5px; - } - } - } - - th label, - th.titledesc { - color: $color_gray-base; - } - - th label + .everest-forms-help-tip { - position: absolute; - margin: 0; - right: 0; - top: 20px; - } - - td.everest-forms-permissions { - display: flex; - flex-wrap: wrap; - align-items: flex-end; - - fieldset { - padding: 0 20px; - - label { - position: relative; - display: block; - font-weight: 600; - } - } - } - - .select2-container { - vertical-align: top; - margin-bottom: 3px; - } - - table.widefat th { - padding-right: inherit; - } - - .wp-list-table .everest-forms-help-tip { - float: none; - } - - fieldset { - margin-top: 4px; - - img.help_tip, - .everest-forms-help-tip { - margin: -3px 0 0 5px; - } - - p.description { - margin-bottom: 8px; - } - - &:first-child { - margin-top: 0; - } - } - - .iris-picker { - z-index: 100; - display: none; - position: absolute; - border: 1px solid #ccc; - border-radius: 3px; - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); - - .ui-slider { - border: 0 !important; - margin: 0 !important; - width: auto !important; - height: auto !important; - background: none transparent !important; - - .ui-slider-handle { - margin-bottom: 0 !important; - } - } - } - - .forminp-color { - font-size: 0; - } - - .iris-error { - background-color: #ffafaf; - } - - .colorpickpreview { - padding: 0; - width: 30px; - height: 30px; - box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2); - font-size: 16px; - border-radius: 4px; - margin-right: 3px; - - @media only screen and (max-width: 782px) { - float: left; - width: 40px; - height: 40px; - } - } - } - - .everest-forms-save-button { - box-shadow: none; - text-shadow: none; - transition: 0.25s all ease-in-out; - } - - .everest-forms-integrations-connection { - a { - text-decoration: none; - } - - .everest-forms-integrations { - border-radius: 3px; - background: #FBFAFC; - border: 1px solid #EEE8F7; - padding: 16px 20px; - display: flex; - flex-wrap: wrap; - align-items: center; - justify-content: space-between; - margin-bottom: 10px; - - &[data-action="upgrade"] { - opacity: .4; - } - - .integration-header-info { - display: flex; - flex: 1; - align-items: center; - gap: 16px; - - .integration-status { - position: relative; - - .toggle-switch-outer { - width: 20px; - height: 20px; - display: block; - position: relative; - border-radius: 3px; - border: 1px solid #ced4da; - - &.connected { - border-color: $green; - - &::before { - background-color: $green; - } - } - - &::before { - left: 0; - top: 50%; - right: 0; - content: ""; - width: 10px; - height: 10px; - display: block; - margin: 0 auto; - border-radius: 2px; - position: absolute; - background-color: #ced4da; - transform: translateY(-50%); - } - } - } - - .integration-detail { - display: flex; - align-items: center; - gap: 16px; - - .logo { - width: 50px; - height: 50px; - flex: 0 0 50px; - display: flex; - overflow: hidden; - align-items: center; - padding: 2px; - border-radius: 2px; - border: 1px solid #edeff7; - background: #ffffff; - margin: 0; + // Toggle switch. + .everest-forms-toggle-form { + width: 28px; + height: 16px; + float: left; + margin-top: 3px; + margin-right: 4px; + position: relative; + + input[type="checkbox"] { + position: absolute; + top: 0; + bottom: 0; + width: 100%; + opacity: 0; + z-index: 1; + + &:checked { + + .slider { + // background-color: $green; + background-color: $evf_primary-color; + + &::before { + transform: translateX(100%); + } + } + } + } - img { - width: 100%; - display: block; - } - } - - .integration-info { - a { - display: inline-block; - - &:hover h3 { - color: $everestforms; - } - - &:focus { - box-shadow: none; - } - } - - h3, - p { - margin-top: 0; - margin-bottom: 0; - } - } - } - } - - .integartion-action { - flex-wrap: wrap; - display: flex; - align-items: center; - - .toggle-button { - margin-right: 20px; - - .slide { - display: block; - height: 22px; - cursor: pointer; - width: 44px; - position: relative; - - &.inactive, - &.active { - border-radius: 34px; - - &::before { - border-radius: 50%; - position: absolute; - content: ""; - height: 18px; - width: 18px; - bottom: 2px; - background-color: $color-white; - -webkit-transition: 0.4s; - transition: 0.4s; - } - } - - &.inactive { - background-color: #ced4da; - - &::before { - left: 2px; - } - } - - &.active { - background-color: $everestforms; - - &::before { - right: 2px; - } - } - } - } - - .integration-setup { - width: 35px; - height: 35px; - display: block; - font-size: 16px; - color: #78818a; - position: relative; - border-radius: 3px; - border: 1px solid #ced4da; - transition: all 0.25s; - - .evf-icon-setting-cog { - position: absolute; - top: 50%; - transform: translateY(-50%); - width: 100%; - text-align: center; - - &::before { - content: "\e021"; - } - } - - &:hover { - color: $everestforms; - border-color: $everestforms; - } - } - } - } - } - - .evf-connection-form { - input { - width: 100%; - margin-right: 15px; - margin-bottom: 15px; - - @media screen and (min-width: 1200px) { - width: calc(33% - 20px); - } - } - } - - .everest-forms-integration-content { - display: flex; - background-color: $color-white; - border: 1px solid #ced4da; - - .integration-addon-detail { - width: 400px; - padding: 20px; - border-right: 1px solid #ced4da; - - .evf-integration-info-header { - display: flex; - align-items: center; - } - - .evf-integration-logo { - width: 60px; - height: 60px; - padding: 10px; - display: flex; - align-items: center; - flex: 0 0 60px; - margin: 0 20px 0 0; - border-radius: 3px; - border: 1px solid #ced4da; - - img { - width: 100%; - } - } - - .integration-info { - h3 { - margin-top: 0; - margin-bottom: 5px; - } - - .toggle-switch { - &.connected { - display: block; - padding-left: 15px; - position: relative; - - &::before { - left: 0; - top: 50%; - content: ""; - width: 10px; - height: 10px; - display: block; - position: absolute; - background: $green; - border-radius: 50%; - transform: translateY(-50%); - } - } - } - } - } - - .integration-connection-detail { - padding: 20px; - width: calc(100% - 400px); - - .evf-account-connect { - margin-bottom: 20px; - - h3 { - margin-top: 0; - } - - .everest-forms-btn { - .evf-loading { - width: 14px; - height: 14px; - background-size: 14px 14px; - margin: 2px 0 0 5px; - } - } - } - - .evf-connection-list { - table.evf-connection-list-table { - width: 100%; - border-spacing: 0; - border-collapse: collapse; - border: 1px solid #ced4da; - - tr { - td { - padding: 10px 20px; - border-bottom: 1px solid #ced4da; - - &:last-child { - text-align: right; - } - - .disconnect { - color: $red; - position: relative; - display: inline-block; - padding-left: 15px; - - &::before { - display: block; - content: ""; - position: absolute; - height: 10px; - width: 10px; - background: $red; - top: 50%; - transform: translateY(-50%); - left: 0; - border-radius: 50%; - } - } - } - - &:last-child { - td { - border-bottom: none; - } - } - } - } - } - } - } - } - - /** - * Import and Export - */ - .evf-tools-export-entries, - .everest-forms-import-form, - .everest-forms-import-entries-wrapper, - .everest-forms-export-form, - .everest-forms-form-migrator { - background: $color-white; - max-width: 700px; - padding: 20px; - margin-top: 20px; - box-shadow: 1px 3px 10px transparentize($color_gray-base, 0.95); - border-radius: 4px; - - h3 { - margin: 0; - font-size: 20px; - padding-bottom: 16px; - border-bottom: 2px solid $color_gray-more-lighten; - } - - p { - font-size: 14px; - } - - select { - margin: 1em 0; - } - - .description { - margin-bottom: 16px; - - .dashicons { - width: 16px; - height: 16px; - font-size: 16px; - vertical-align: middle; - margin-right: 2px; - margin-bottom: 3px; - } - } - - .everest-forms-file-upload { - margin: 1em 0; - position: relative; - z-index: 1; - - input { - opacity: 0; - z-index: 2; - width: 400px; - height: 46px; - } - - label { - display: inline-block; - padding: 4px; - min-width: 400px; - position: absolute; - left: 0; - border-radius: 4px; - border: 1px solid $color_gray-lighten; - z-index: -1; - } - - .everest-forms-btn { - width: auto; - height: auto; - font-size: 13px; - margin-right: 10px; - vertical-align: middle; - } - } - - .publishing-action { - padding-top: 20px; - text-align: right; - border-top: 2px solid $color_gray-more-lighten; - } - .evf-fm-wrapper { - .evf-fm-form-list-container { - .evf-fm-forms-table-wrapper { - h4 { - margin: 0; - font-size: 16px; - padding-top: 16px; - padding-bottom: 16px; - } - table, - th, - td { - border-collapse: collapse; - } - - table { - tr { - border-bottom: 2px solid #e9ebf1; - &.evf-fm-hide-row { - display: none; - } - &.evf-fm-show-row { - display: none; - } - - th { - width: 150px; - padding: 12px; - } - td { - .evf-fm-import-actions { - display: flex; - } - width: 600px; - padding: 12px; - text-align: center; - .evf-fm-import-single { - padding: 8px; - background-color: #e9ebf1; - border-radius: 4px; - border: none; - &:hover { - background-color: #7e3bd0; - color: #fff; - border: none; - cursor: pointer; - } - } - .evf-fm-import-entry { - padding: 8px; - background-color: #b5facd; - border-radius: 4px; - border: none; - display: inline; - margin-left: 8px; - &:not(:disabled):hover { - background-color: #7e3bd0; - color: #fff; - border: none; - cursor: pointer; - } - } - } - } - } - .evf-fm-pagination { - padding-top: 16px; - button { - margin: 2px; - cursor: pointer; - &:hover { - background-color: #7e3bd0; - color: #fff; - border: none; - } - &.evf-fm-btn-active { - background-color: #7e3bd0; - color: #fff; - border: none; - } - } - } - .evf-fm-import-selected-wrapper { - display: flex; - flex-direction: row; - justify-content: space-between; - margin-left: 15px; - margin-right: 100px; - } - .evf-fm-import-selected-btn { - margin-top: 16px; - padding: 8px; - background-color: #e9ebf1; - border-radius: 4px; - border: none; - align-items: right; - &:hover { - background-color: #7e3bd0; - color: #fff; - border: none; - cursor: pointer; - } - } - } - } - } - } - - /** - * List Table. + .slider { + cursor: pointer; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + transition: 0.4s; + background-color: #cdd0d2; + + &::before { + content: ""; + width: 12px; + height: 12px; + position: absolute; + left: 2px; + bottom: 2px; + transition: 0.4s; + background-color: $color-white; + } + + &.round { + border-radius: 16px; + + &::before { + border-radius: 50%; + } + } + } + } + + .evf-toggle-section { + display: inline-block; + + .evf-toggle-switch { + display: inline-flex; + position: relative; + line-height: 1; + margin-bottom: 0; + position: relative; + + input { + top: 0; + left: 0; + margin: 0; + z-index: 1; + opacity: 0; + padding: 0; + width: 100%; + height: 100%; + border: none; + position: absolute; + + &:checked { + + .evf-toggle-switch-wrap { + background-color: #11a0d2; + border: 2px solid #11a0d2; + border: 9px solid transparent; + + &::before { + content: ""; + height: 6px; + width: 2px; + background: #fff; + position: absolute; + left: 0; + top: 0; + transform: translateY(-50%); + } + + &::after { + border: 2px solid transparent; + } + } + + ~ .evf-toggle-switch-control { + background-color: #fff; + border-width: 0; + transform: translateX(18px) translateY(-50%); + } + + &::before { + display: none; + } + } + + &:focus { + + .evf-toggle-switch-wrap { + box-shadow: + 0 0 0 2px #fff, + 0 0 0 3px #6c7781; + } + } + } + + .evf-toggle-switch-wrap { + width: 36px; + height: 18px; + display: inline-flex; + background-color: #fff; + border: 2px solid #6c7781; + border-radius: 9px; + transition: 0.2s background ease; + position: relative; + align-items: center; + justify-content: flex-end; + + &::after { + content: ""; + width: 4px; + height: 4px; + margin-right: 2px; + border-radius: 50%; + display: inline-block; + border: 2px solid $color_gray-normal; + } + } + + .evf-toggle-switch-control { + display: block; + position: absolute; + top: 50%; + left: 4px; + width: 10px; + height: 10px; + border-radius: 50%; + transition: 0.1s transform ease; + background-color: #6c7781; + border: 5px solid #6c7781; + transform: translateY(-50%); + } + } + + label.evf-toggle-label { + display: inline-block; + margin-bottom: 0; + margin-left: 4px; + } + } + + .everest-forms-disabled { + opacity: 0.5; + pointer-events: none; + } + + // Radio and checkbox list option + .everest-forms-checklist { + margin-bottom: 14px; + + ul { + margin-bottom: 0; + + label { + font-weight: normal; + margin-bottom: 0; + margin-top: 0; + } + } + + &.everest-forms-checklist-inline { + ul { + display: flex; + flex-wrap: wrap; + + li { + margin-right: 10px; + margin-bottom: 0; + } + } + } + } + + .everest-forms-label-edit { + display: flex; + justify-content: space-between; + + .dashicons { + color: $color_gray-light; + height: 24px; + width: 24px; + cursor: pointer; + flex: 0 0 24px; + margin: 4px; + border-radius: 3px; + display: flex; + align-items: center; + justify-content: center; + opacity: 0; + visibility: hidden; + } + + &:hover, + &:active, + &:focus, + &:focus-within { + .dashicons { + visibility: visible; + opacity: 1; + } + } + + input { + margin-right: 6px; + } + } + + .everest-forms { + .loading-dot { + background: url(../images/icons/three-dots.svg); + opacity: 0.7; + width: 25px; + height: 10px; + display: inline-block; + vertical-align: middle; + background-size: 25px 10px; + } + + .everest-forms-overlay { + width: 100%; + z-index: 99999; + overflow: hidden; + background: #f1f1f1; + position: absolute; + top: 0; + bottom: 0; + height: auto; + min-height: 100vh; + + .everest-forms-overlay-content { + position: absolute; + top: 50%; + left: 0; + right: 0; + width: 128px; + height: 128px; + margin: 0 auto; + transform: translateY(-50%); + + span.loading { + display: block; + font-size: 20px; + text-align: center; + letter-spacing: 0.05em; + } + } + } + + nav.evf-nav-tab-wrapper { + padding: 0; + border: none; + display: flex; + align-items: center; + margin: 0; + // margin: 0 0 1.5em; + position: relative; + border-bottom: none; + background-color: $everestforms; + + a.nav-tab { + position: relative; + z-index: 1; + color: $color-white; + margin-left: 0; + display: block; + cursor: pointer; + font-size: 12px; + font-weight: 400; + line-height: 24px; + padding: 10px 32px; + border: none transparent; + background-color: transparent; + transition: 0.3s background-color ease-in-out; + + span { + &.evf-nav-icon { + float: none; + width: auto; + height: auto; + display: block; + font-size: 32px; + text-align: center; + + &::before { + @include iconbefore("\e001"); + margin-right: 0; + } + + &.general::before { + content: "\e001"; + } + + &.settings::before { + content: "\e002"; + } + + &.recaptcha::before { + content: "\e003"; + } + + &.email::before { + content: "\e006"; + } + + &.validation::before { + content: "\e910"; + } + + &.pdf-submission::before { + content: "\e023"; + } + + &.fields::before { + content: "\e00b"; + } + + &.payment, + &.payments { + &::before { + content: "\e01f"; + } + } + + &.integration, + &.integrations { + &::before { + content: "\e01e"; + } + } + + &.logs::before { + content: "\e02d"; + } + + &.import::before { + content: "\e02e"; + } + + &.export::before { + content: "\e02f"; + } + &.form_migrator::before { + content: "\e916"; + } + &.payment_log::before { + content: "\e918"; + } + &.permission::before { + content: "\e030"; + } + &.evf-widget::before { + content: "\e902"; + } + &.geolocation::before { + content: "\e900"; + } + &.delete::before { + content: "\e906"; + } + &.misc::before { + content: "\e911"; + } + &.ai::before { + content: "\e912"; + } + &.lookup::before { + content: "\e914"; + } + &.analytics::before { + content: "\e915"; + } + } + } + + // &.nav-tab-active { + // margin-bottom: 0; + // background-color: adjust-color($everestforms, $saturation: +20%, $lightness: +6%); + + // &:focus { + // box-shadow: none; + // } + // } + + &:focus { + box-shadow: none; + } + + // &:hover:not(.nav-tab-active) { + // background-color: adjust-color($everestforms, $saturation: -4%, $lightness: -4%); + // } + + // &::before { + // content: ""; + // background: #8c3eeb; + // position: absolute; + // z-index: -1; + // width: 100%; + // height: 100%; + // top: 0; + // left: 0; + // opacity: 0; + // border-radius: 0 0 7px 7px; + // transition: all 0.3s ease-in-out; + // } + + // &:hover, + // &.nav-tab-active { + // &::before { + // top: -7px; + // opacity: 1; + // } + // } + } + } + + .everest-forms-tools, + .everest-forms-settings { + padding-left: 20px; + padding-right: 20px; + + h2 { + font-size: 20px; + } + + .form-table { + tr { + border-bottom: 1px solid $color_gray-lighten; + + &:first-child { + border-top: 1px solid $color_gray-lighten; + } + } + + th { + padding-top: 31px; + + .everest-forms-help-tip { + margin: 0; + transform: translateY(-50%); + } + } + + td:not(.everest-forms-permissions) { + padding: 25px 0; + } + + .forminp-radio-image { + ul { + margin: 0; + display: flex; + + li { + margin-right: 30px; + + label, + img { + display: block; + } + + img { + margin-bottom: 15px; + border: 2px solid $color_gray-lighten; + } + } + } + } + } + } + } +} + +/** + * Tabs */ - table.wp-list-table { - span.na { - color: #999; - } - - .row-actions { - color: #999; - } - - .column-date { - width: 12%; - } - - .column-entries { - width: 74px; - text-align: center; - } - - .column-actions { - width: 175px; - } - - .column-enabled { - width: 25px; - } - - .column-status img { - height: 12px; - margin-left: 5px; - margin-bottom: -2px; - } - - img.attachment-thumbnail { - height: 40px; - } - - .submitdelete { - &:hover { - color: #a00; - } - } - - .new-entries-notification td { - padding: 0; - text-align: center; - - a { - padding: 10px; - box-shadow: none; - background: lighten(#0095ff, 45%); - } - } - } - - /** - * Entry viewer. - **/ - .everest-forms-entry { - .postbox { - .inside { - padding: 6px 0 0; - - p { - margin: 0; - padding: 6px 10px 8px; - } - } - - .submitdelete { - color: #a00; - padding: 1px 2px; - text-decoration: none; - } - } - - #poststuff { - #everest-forms-entry-fields, - #everest-forms-entry-details, - #everest-forms-entry-actions, - #everest-forms-entry-payment { - h2.hndle { - cursor: inherit; - - .dashicons { - width: 16px; - height: 16px; - font-size: 16px; - margin: 1px 2px 0 4px; - } - } - - .inside { - margin: 0; - padding: 0; - - .everest-forms-edit-entry-field { - .evf-field { - input[type="text"], - input[type="date"], - input[type="date"], - input[type="datetime-local"], - input[type="email"], - input[type="file"], - input[type="image"], - input[type="month"], - input[type="number"], - input[type="password"], - input[type="range"], - input[type="search"], - input[type="tel"], - input[type="time"], - input[type="url"], - input[type="week"], - select, - .StripeElement, - canvas.evf-signature-canvas { - padding: 0 8px; - margin-bottom: 0; - } - - textarea { - width: 100%; - max-width: 100%; - min-width: 100%; - height: 120px; - } - - ul { - li { - margin: 0; - display: block; - - label, - input { - margin: 0; - } - - input[type="radio"], - input[type="checkbox"] { - margin-top: 4px; - margin-right: 8px; - } - } - } - } - - .evf-field-radio ul, - .evf-field-checkbox ul, - .evf-field-payment-radio ul, - .evf-field-payment-checkbox ul { - margin: 0; - - li { - display: flex; - margin-bottom: 5px; - } - } - - label.evf-error { - cursor: default; - color: #900; - margin: 5px 0 0 0; - } - - abbr.required { - color: #fa5252; - font-weight: 700; - border: 0 !important; - text-decoration: none; - vertical-align: middle; - } - } - - .everest-forms-entry-details-meta, - .everest-forms-entry-actions-meta, - .everest-forms-entry-payment-meta { - padding: 6px 0 0; - - p { - margin: 0; - padding: 6px 10px 8px; - } - - .dashicons { - top: 0; - left: -2px; - position: relative; - padding: 0 2px 0 0; - color: $color_gray-light; - text-decoration: none; - } - } - - .everest-forms-entry-actions-meta a { - box-shadow: none; - text-decoration: none; - } - - #major-publishing-actions { - outline: inherit; - - a.button-secondary { - margin-left: 5px; - } - } - } - } - - #evf-entry-nav-buttons { - padding: 5px 10px; - - #evf-next-entry-button { - float: right; - } - } - - #everest-forms-entry-fields { - .inside { - table { - border: none; - - td a:focus { - box-shadow: none; - } - } - - span.list { - display: block; - } - - img.attachment-thumbnail { - height: 150px; - } - } - - .everest-forms-empty-field-toggle { - float: right; - padding: 3px 0 0; - text-decoration: none; - } - } - } - } - - /** - * DB log viewer. - **/ - .wp-list-table.logs { - .log-level { - display: inline; - padding: 0.2em 0.6em 0.3em; - font-size: 80%; - font-weight: bold; - line-height: 1; - color: $color-white; - text-align: center; - white-space: nowrap; - vertical-align: baseline; - border-radius: 0.2em; - - &:empty { - display: none; - } - } - - /** - * Add color to levels - * - * Descending severity: - * emergency, alert -> red - * critical, error -> orange - * warning, notice -> yellow - * info -> blue - * debug -> green - */ - .log-level--emergency, - .log-level--alert { - background-color: #ff4136; - } - .log-level--critical, - .log-level--error { - background-color: #ff851b; - } - .log-level--warning, - .log-level--notice { - color: #222; - background-color: #ffdc00; - } - .log-level--info { - background-color: #0074d9; - } - .log-level--debug { - background-color: #3d9970; - } - - // Adjust log table columns only when table is not collapsed. - @media screen and (min-width: 783px) { - .column-timestamp { - width: 18%; - } - .column-level { - width: 14%; - } - .column-source { - width: 15%; - } - } - } - - #log-viewer-select { - padding: 10px 0 8px; - line-height: 28px; - h2 a { - vertical-align: middle; - } - } - - #log-viewer { - background: $color-white; - border: 1px solid #e5e5e5; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04); - padding: 5px 20px; - - pre { - font-family: monospace; - white-space: pre-wrap; - word-wrap: break-word; - } - } - - /** - * Tooltips. - **/ - .tips { - cursor: help; - text-decoration: none; - } - - img.tips { - padding: 5px 0 0; - } - - .tooltipster-base { - display: flex; - position: absolute; - pointer-events: none; - - &.tooltipster-ruler { - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0; - overflow: hidden; - visibility: hidden; - } - - .tooltipster-box { - border: none; - flex: 1 1 auto; - border-radius: 3px; - background: #333; - margin: 0 !important; - - .tooltipster-content { - color: $color-white; - overflow: auto; - font-size: 0.8em; - max-width: 150px; - max-height: 100%; - text-align: center; - padding: 0.618em 1em; - box-sizing: border-box; - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); - - a { - // color: #ff7d20; - color: #967cff; - } - - code { - padding: 1px; - background: #888; - } - } - } - - .tooltipster-arrow { - overflow: hidden; - position: absolute; - - .tooltipster-arrow-uncropped { - position: relative; - - .tooltipster-arrow-border { - top: 0; - left: 0; - width: 0; - height: 0; - position: absolute; - border: 5px solid transparent; - } - - .tooltipster-arrow-background { - display: none; - } - } - } - - &.tooltipster-top, - &.tooltipster-bottom { - .tooltipster-arrow { - width: 10px; - height: 5px; - margin-left: -5px; - } - } - - &.tooltipster-left, - &.tooltipster-right { - .tooltipster-arrow { - top: 0; - width: 5px; - height: 10px; - margin-left: 0; - margin-top: -5px; - } - } - - &.tooltipster-bottom { - .tooltipster-arrow { - top: -5px; - - .tooltipster-arrow-uncropped { - top: -5px; - - .tooltipster-arrow-border { - border-bottom-color: #333; - } - } - } - } - - &.tooltipster-left { - .tooltipster-arrow { - right: -5px; - - .tooltipster-arrow-border { - border-left-color: #333; - } - } - } - - &.tooltipster-right { - .tooltipster-arrow { - left: -5px; - - .tooltipster-arrow-uncropped { - left: -5px; - - .tooltipster-arrow-border { - border-right-color: #333; - } - } - } - } - - &.tooltipster-top { - .tooltipster-arrow { - bottom: -5px; - - .tooltipster-arrow-border { - border-top-color: #333; - } - } - } - - &.tooltipster-fade { - opacity: 0; - transition-property: opacity; - - &.tooltipster-show { - opacity: 1; - } - } - - &.tooltipster-update-rotate { - animation: rotating 600ms; - } - } - - .evf_error_tip { - color: $color-white; - max-width: 20em; - font-size: 0.8em; - line-height: 1.8em; - text-align: center; - border-radius: 3px; - position: absolute; - white-space: normal; - background: #d82223; - margin: 1.5em 1px 0 -1em; - padding: 0.618em 1em; - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); - z-index: 9999999; - - code { - padding: 1px; - background: #888; - } - - &::after { - content: ""; - display: block; - border: 8px solid #d82223; - border-right-color: transparent; - border-left-color: transparent; - border-top-color: transparent; - position: absolute; - top: -3px; - left: 50%; - margin: -1em 0 0 -3px; - } - } - - /** - *Date picker. +.everest-forms-tab { + ul { + display: flex; + flex-wrap: wrap; + margin: 0; + + .everest-forms-tab-nav { + display: inline-flex; + margin: 0 8px 0 0; + + .everest-forms-tab-nav-link { + font-weight: 600; + padding: 16px 8px; + color: $color_gray-base; + text-decoration: none; + border-bottom: 2px solid transparent; + } + + &.active { + .everest-forms-tab-nav-link { + color: $everestforms; + border-color: $everestforms; + } + } + } + } +} + +.everest-forms-setup { + font-size: 14px; + max-width: calc(100% - 32px); + margin: 20px auto; + background: $color-white; + + @media (min-width: 960px) { + max-width: 835px; + } + + @media (min-width: 1280px) { + max-width: 1100px; + } + + a { + &:focus { + box-shadow: none; + } + } + + .page-title-action { + top: 0; + margin-left: 16px; + &:active { + top: 0; + margin-left: 16px; + } + } + + .everest-forms-setup-header { + display: flex; + flex-wrap: wrap; + align-items: center; + padding: 0 16px; + background-color: $color-white; + border-bottom: 1px solid $color_gray-lighten; + + @media only screen and (max-width: 768px) { + padding-top: 16px; + } + + .everest-forms-logo { + display: flex; + flex-wrap: wrap; + padding-right: 1em; + border-right: 1px solid $color_gray-lighten; + margin-right: 1em; + } + + h4 { + margin: 0; + } + + .everest-forms-tab { + margin-left: auto; + + @media only screen and (max-width: 768px) { + width: calc(100% + 32px); + flex: 0 0 calc(100% + 32px); + margin-top: 16px; + margin-right: -16px; + margin-left: -16px; + border-top: 1px solid $color_gray-lighten; + } + } + } +} + +/** + * Template Setup **/ - img.ui-datepicker-trigger { - vertical-align: middle; - margin-top: -1px; - cursor: pointer; - } +.everest-forms { + border-radius: 4px; + + * { + box-sizing: border-box; + } + + span { + display: inline-block; + } + + .everest-forms-loader-overlay { + background: transparentize($color_gray-dark, 0.25); + position: fixed; + left: 0; + right: 0; + top: 0; + bottom: 0; + z-index: 9; + + .evf-loading { + margin: 0 auto; + position: absolute; + left: 0; + right: 0; + top: 50%; + transform: translateY(-50%); + } + } + + .everest-forms-setup-form-name { + padding: 15px 20px; + border-bottom: 1px solid $color_gray-lighten; + + .everest-forms-setup-name { + margin-left: 40px; + padding: 10px; + height: 35px; + width: 400px; + + &.everest-forms-required { + border-color: $red; + box-shadow: 0 0 2px rgba(175, 0, 0, 0.8); + } + } + } + + .evf-setup-title { + width: auto; + font-size: 24px; + line-height: 34px; + font-weight: 600; + color: $color_gray-dark; + padding: 15px 20px 10px; + + p.desc { + font-weight: normal; + } + } + + .evf-setup-templates { + display: flex; + flex-wrap: wrap; + padding: 8px; + + .evf-loading { + margin: 80px auto; + } + + .evf-template { + .everest-forms-screenshot { + cursor: pointer; + padding: 8px; + margin: 0; + min-height: auto; + position: relative; + border-radius: 4px; + background: $color_gray-more-lighten; + + @media only screen and (min-width: 1280px) { + min-height: 280px; + } + + .everest-forms-badge { + position: absolute; + bottom: 16px; + right: 16px; + z-index: 1; + } + + .form-action { + display: none; + position: absolute; + left: 0; + right: 0; + top: 50%; + transform: translateY(-50%); + z-index: 1; + + .everest-forms-btn { + &.everest-forms-btn-secondary { + background: $color-white; + } + + &:last-child { + margin-left: 8px; + } + } + } + } + + img { + display: block; + width: 100%; + } + + .everest-forms-form-id-container { + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: space-between; + position: relative; + + .everest-forms-template-name { + font-size: 16px; + font-weight: 600; + margin: 16px 0; + color: $color_gray-base; + text-decoration: none; + + &:hover { + color: $everestforms; + } + } + } + + &:hover { + .everest-forms-screenshot::after { + content: ""; + display: block; + background: transparentize($color_gray-base, 0.5); + position: absolute; + top: 0; + left: 0; + bottom: 0; + right: 0; + } + + .form-action { + display: flex; + align-items: center; + justify-content: center; + } + } + + &:nth-child(even) { + float: right; + } + + .evf-template-overlay { + position: absolute; + background-color: rgba(0, 0, 0, 0.5); + top: 0; + left: 0; + right: 0; + bottom: 0; + opacity: 0; + visibility: hidden; + transition: 0.5s background-color ease-in-out; + color: $color-white; + text-align: center; + padding: 40% 0; + + .evf-template-select { + text-decoration: none; + } + + &.loading { + .evf-button, + .evf-button::before, + .evf-button::after { + background: $color-white; + -webkit-animation: load1 1s infinite ease-in-out; + animation: load1 1s infinite ease-in-out; + width: 1em; + height: 4em; + padding: 0; + border-radius: 0; + } + .evf-button { + color: $color-white; + text-indent: -9999em; + margin: 0 auto; + position: relative; + font-size: 11px; + -webkit-transform: translateZ(0); + -ms-transform: translateZ(0); + transform: translateZ(0); + -webkit-animation-delay: -0.16s; + animation-delay: -0.16s; + } + .evf-button::before, + .evf-button::after { + position: absolute; + top: 0; + content: ""; + } + .evf-button::before { + left: -1.5em; + -webkit-animation-delay: -0.32s; + animation-delay: -0.32s; + } + .evf-button::after { + left: 1.5em; + } + @-webkit-keyframes load1 { + 0%, + 80%, + 100% { + box-shadow: 0 0; + height: 4em; + } + 40% { + box-shadow: 0 -2em; + height: 5em; + } + } + @keyframes load1 { + 0%, + 80%, + 100% { + box-shadow: 0 0; + height: 4em; + } + 40% { + box-shadow: 0 -2em; + height: 5em; + } + } + } + } + + &:hover .evf-template-overlay, + .evf-template-overlay.loading { + opacity: 1; + visibility: visible; + } + + .evf-button { + display: inline-block; + padding: 15px 22px; + background-color: $color-white; + color: #000; + font-size: 12px; + text-transform: uppercase; + border: none; + border-radius: 100px; + } + } + } +} + +/** + * Form Setup + */ +.everest-forms-builder-setup { + #screen-meta-links { + display: none; + } + + .jconfirm-everest-forms { + .jconfirm-box { + border-radius: 4px !important; + + div.jconfirm-title-c { + padding-bottom: 10px; + + .jconfirm-icon-c { + margin-bottom: 16px !important; + + .dashicons { + color: $color-white; + font-size: 28px !important; + height: 54px !important; + width: 54px !important; + border-radius: 50%; + background: $red; + line-height: 54px; + } + } + + .jconfirm-title { + font-size: 22px !important; + font-weight: 600; + } + } + + div.jconfirm-content { + margin-bottom: 0 !important; + } + } + } + + .jconfirm-everest-forms-left { + &.jconfirm-modern { + .jconfirm-box { + width: 500px !important; + padding: 20px 30px 15px; + border-radius: 4px !important; + + .jconfirm-title-c { + text-align: left; + font-size: 20px; + font-weight: 400; + padding-bottom: 0; + line-height: 1.8; + + .jconfirm-icon-c { + margin: 0; + } + } + + .jconfirm-content { + white-space: initial !important; // to avoid spacing issue on notice while installing addons + text-align: left; + margin-bottom: 0; + + input[type="text"] { + margin: 5px 2px 2px; + padding: 5px 10px; + + &:focus { + border-color: #007cba; + box-shadow: 0 0 0 1px #007cba; + } + } + } + + .jconfirm-buttons { + text-align: right; + + .everest-forms-btn { + font-weight: 400; + text-transform: none; + } + } + } + } + } + + .everest-forms-recommend-addons { + margin-top: 20px; + padding-top: 16px; + border-top: 2px solid $color_gray-more-lighten; + + .bulk-action-notice { + margin: 0 0 20px; + + p { + padding: 0; + margin: 8px 0 !important; + } + + &.notice-error { + .button-link { + text-decoration: none; + display: flex; + align-items: center; + margin-top: 8px; + + .toggle-indicator { + display: inline-flex; + } + } + + .bulk-action-errors { + margin-top: 0; + } + } + } + + .plugins-list-table { + border-radius: 4px; + + .plugin-status { + float: right; + + span { + width: 20px; + height: 20px; + overflow: hidden; + border-radius: 50%; + position: relative; + vertical-align: top; + white-space: nowrap; + text-indent: -9999px; + display: inline-block; + border: 2px solid $color_gray-lighten; + + &.active, + &.activate-now { + &::after { + position: absolute; + left: 50%; + top: 50%; + opacity: 1; + width: 34%; + height: 50%; + content: ""; + transform-origin: left top; + border-top: 2px solid $color_gray-lighten; + border-right: 2px solid $color_gray-lighten; + transform: scaleX(-1) rotate(135deg) + translate(-58%, -40%); + } + } + + &.activate-now { + border-color: $color_gray-lighten; + + &.updating-message { + border-color: $color_gray-lighten; + border-left-color: $green; + } + } + + &.active { + border-color: $green; + + &::after { + border-top: 2px solid $green; + border-right: 2px solid $green; + } + } + + &.updating-message { + border-left-color: $green; + animation: spin 0.75s linear infinite; + + &::after { + content: none; + } + } + } + } + } + + .everest-forms-template-install-addon { + margin-top: 20px; + } + } + + .everest-forms { + .evf-setup-templates { + .evf-template { + width: 100%; + background: $color-white; + border-radius: 4px; + position: relative; + margin: 12px; + + @media (min-width: 400px) { + width: calc(50% - 24px); + flex: 0 0 calc(50% - 24px); + } + + @media only screen and (min-width: 768px) { + width: calc(33.333% - 24px); + flex: 0 0 calc(33.333% - 24px); + } + + @media (min-width: 960px) { + width: calc(25% - 24px); + flex: 0 0 calc(25% - 24px); + } + } + } + } +} +// Entries page +#evf-dashboard-analytisc-body { + &::after, + &::before { + display: none; + } +} +p.search-box { + margin-top: 15px; +} + +#evf-dashboard-analytics { + .evf-container { + margin-left: 0; + margin-right: 0; + max-width: 100%; + } +} + +/** + * Form Builder + **/ +#everest-forms-panel-settings { + .evf-content-section { + display: none; + } + + .evf-content-section.active { + display: block; + } + + .everest-forms-panel-content-wrap { + .everest-forms-panel-content { + .evf-content-section, + .evf-panel-content-section { + min-height: calc(100vh - 155px); + + &.active { + padding: 18px 32px 32px; + background: #ffffff; + border-radius: 13px; + border: 1px solid #e1e1e1; + box-shadow: 0px 7px 29px 0px rgba(100, 100, 111, 0.09); + } + + &-title { + font-size: 22px; + line-height: 130%; + color: #222222; + padding-top: 6px; + } + + .everest-forms-panel-field { + input, + textarea, + select { + border-color: #e1e1e1; + padding: 3px 10px; + color: #383838; + } + + &.everest-forms-panel-field-toggle { + display: flex; + align-items: center; + justify-content: flex-end; + flex-direction: row-reverse; + gap: 8px; + + label, + .evf-toggle-section { + margin-bottom: 0; + } + + .evf-toggle-section { + .everest-forms-toggle-form { + margin: 0; + } + } + } + } + } + } + } +} + +#everest-forms-panel-payments, +#everest-forms-panel-integrations { + .evf-panel-content-section { + display: none; + } + + .evf-panel-content-section.active { + display: block; + } + + .everest-forms-panel-content-wrap { + .everest-forms-panel-content { + .evf-content-section, + .evf-panel-content-section { + min-height: calc(100vh - 155px); + + &.active { + padding: 18px 32px 32px; + background: #ffffff; + border-radius: 13px; + border: 1px solid #e1e1e1; + box-shadow: 0px 7px 29px 0px rgba(100, 100, 111, 0.09); + } + + &-title { + font-size: 22px; + line-height: 130%; + color: #222222; + padding-top: 6px; + } + + .everest-forms-panel-field { + input, + textarea, + select { + border-color: #e1e1e1; + padding: 3px 10px; + color: #383838; + } + + &.everest-forms-panel-field-toggle { + display: flex; + align-items: center; + justify-content: flex-end; + flex-direction: row-reverse; + gap: 8px; + + label, + .evf-toggle-section { + margin-bottom: 0; + } + + .evf-toggle-section { + .everest-forms-toggle-form { + margin: 0; + } + } + } + } + } + } + } +} + +.everest-forms_page_evf-builder { + .everest-forms-add-fields-group, + .everest-forms-field-option-group { + .handlediv { + float: right; + + &::before { + content: "\f142" !important; + cursor: pointer; + display: inline-block; + font: 400 20px/1 Dashicons; + line-height: 0.5 !important; + padding: 4px; + position: relative; + right: 0; + top: 0; + } + } + + &.closed { + .handlediv::before { + content: "\f140" !important; + } + } + } + + #everest-forms-builder { + width: 100%; + position: absolute; + top: 0; + bottom: 0; + min-height: calc(100vh - 32px); + + * { + box-sizing: border-box; + } + + .wp-picker-holder * { + box-sizing: content-box; + } + + #everest-forms-builder-form { + position: fixed; + } + + h2, + h3, + h4, + h5, + h6 { + color: $color_gray-dark; + } + + a { + text-decoration: none; + + &:focus { + outline: none; + box-shadow: 0 0 0 rgba(0, 0, 0, 0); + } + } + + .add, + .remove, + .addPayment, + .removePayment { + color: $color_gray-normal; + background: $color-white; + height: 30px; + width: 30px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 4px; + border: 1px solid $color_gray-lighten; + + &:hover { + color: $color-white; + } + } + + .add { + &:hover { + background: $blue; + border-color: $blue; + } + } + + .remove { + margin-left: 8px; + + &:hover { + background: $red; + border-color: $red; + } + } + + .after-label-description { + float: right; + } + + input, + select, + option, + textarea { + border-color: $color_gray-lighten; + + &::placeholder { + color: $color_gray-light; + } + + &:focus { + border-color: #5b9dd9; + } + } + + .everest-forms-inner-options { + padding-left: 20px; + } + + .input-group-col-2 { + display: flex; + flex-wrap: nowrap; + + input[type="text"], + input[type="number"], + select { + flex: 0 0 50%; + margin-right: 2%; + margin-bottom: 10px; + max-width: calc(50% - 1%); + + &:nth-child(2n) { + margin-right: 0; + } + } + } + + .everest-forms-nav-wrapper { + background-color: $everestforms; + display: flex; + flex-wrap: wrap; + align-items: center; + padding-left: 24px; + + .everest-forms-logo { + border-right: 1px solid #e2e2e2; + padding: 6px 24px 6px 0; + margin-right: 24px; + + img { + width: 32px; + height: 32px; + } + } + + .everest-forms-btn { + &:focus { + box-shadow: 0 0 0 3px + adjust-color( + $everestforms, + $saturation: 39%, + $lightness: +18% + ); + } + } + + .evf-forms-nav-right { + padding: 21px 30px 19px; + margin-left: auto; + + .evf-shortcode-field { + display: inline-block; + vertical-align: middle; + + input { + margin: 0; + width: 225px; + height: 36px; + padding: 4px 10px; + line-height: 1.25; + border-radius: 3px 0 0 3px; + } + + button { + padding: 0; + width: 36px; + height: 36px; + margin-left: -4px; + border-radius: 0 3px 3px 0; + background-color: lighten($everestforms, 7%); + + &.copy-shortcode { + // font-size: 16px; + // color: $color-white; + + &::before { + @include iconbefore("\e00c"); + line-height: 27px; + margin-right: 0; + padding-right: 0; + border-right: none; + content: none; + } + + svg { + width: 24px; + height: 24px; + fill: $color-white; + margin-top: 4px; + } + } + + &:focus { + box-shadow: none; + } + } + } + + .everest-forms-embed-button { + margin-left: 6px; + vertical-align: middle; + background: #f4f4f4; + + &:active { + color: #494d50; + } + + &:focus { + box-shadow: none; + } + + &:hover { + background: rgba(255, 255, 255, 0.9); + } + + &.processing { + font-size: 0; + height: 36px; + background: transparent; + border: 1px solid #ffffff; + } + } + + .everest-forms-save-button { + min-width: 75px; + cursor: pointer; + min-height: 36px; + color: $color-white; + background: $green; + margin-left: 10px; + position: relative; + display: inline-block; + vertical-align: middle; + text-transform: uppercase; + + &.processing { + width: 75px; + font-size: 0; + min-height: 36px; + transition: all 0.35s ease 0s; + + &:focus { + box-shadow: 0 0 0 2px + adjust-color( + $everestforms, + $saturation: 39%, + $lightness: +18% + ); + } + } + + .loading-dot { + position: absolute; + top: 50%; + transform: translateY(-50%); + left: 0; + right: 0; + margin: 0 auto; + } + + .spinner, + .evf-loading { + width: 14px; + height: 14px; + margin-top: 5px !important; + margin-left: 5px !important; + background-size: 14px 14px; + } + + &:hover { + background: darken($green, 10%); + } + } + + .everest-forms-preview-button { + background: $color-white; + margin-left: 10px; + display: inline-block; + vertical-align: middle; + + &:hover { + background: transparentize($color-white, 0.1); + } + } + } + + .evf-nav-tab-wrapper { + gap: 4px; + } + } + + .evf-tab-content { + h5 { + margin: 0 auto 20px auto; + font-size: 24px; + line-height: normal; + } + + .evf_smart_tag { + input[type="text"] { + // width: calc(100% - 34px); + // min-height: 27px; + width: 100%; + min-height: 36px; + } + } + + .evf-toggle-smart-tag-display { + position: absolute; + border-radius: 4px; + background: #eeeeee; + color: #4f4f4f; + right: 4px; + width: 28px; + height: 28px; + top: 34px; + + .dashicons-editor-code { + &::before { + left: 0; + right: 0; + margin: 0 auto; + line-height: 28px; + position: absolute; + } + } + } + + .evf-smart-tag-lists { + min-height: 125px; + max-height: 300px; + border: 1px solid rgb(219, 219, 219); + right: 0; + z-index: 1; + margin-top: -1px; + width: 230px; + overflow-y: auto; + position: absolute; + background: $color-white; + border-radius: 4px; + box-shadow: 1px 3px 20px 0 transparentize($color_gray-dark, 0.8); + top: 65px; + + &::-webkit-scrollbar { + width: 6px; + } + + /* Track */ + &::-webkit-scrollbar-track { + box-shadow: inset 0 0 5px #939393; + border-radius: 10px; + } + + /* Handle */ + &::-webkit-scrollbar-thumb { + background: #787878; + border-radius: 10px; + } + + /* Handle on hover */ + &::-webkit-scrollbar-thumb:hover { + background: #3f3f3f; + } + + li, + .smart-tag-title { + padding: 7px 10px; + } + + .smart-tag-title { + font-size: 14px; + font-weight: 600; + padding: 10px 12px; + background: #e4e4e4; + color: #3a3a3a; + } + + ul { + margin: 0; + padding: 6px; + } + + li { + cursor: pointer; + margin-bottom: 0; + padding: 8px; + border-radius: 3px; + font-size: 14px; + transition: all 0.3s ease-in-out; + + &:hover { + background: #eaeaea; + } + } + } + + .evf-field-conditional-container { + .evf-field-logic { + .everest-forms-conditional-field-settings-redirect_to { + width: 120px; + } + + .everest-forms-conditional-field-settings-custom_page { + width: 150px; + } + + .remove-logic { + padding: 4px; + } + } + + // .evf-conditional-group { + // > a { + // height: 32px !important; + + // &.conditonal-rule-add { + // width: 42px !important; + // } + + // &.conditonal-rule-remove { + // width: 32px !important; + // } + // } + // } + } + + #evf-custom-css-block, + #evf-custom-js-block { + position: relative; + top: 0; + right: 0; + bottom: 0; + left: 0; + min-height: 200px; + font-size: 12px; + } + + &.everest-forms-panel-field-textarea { + .evf-smart-tag-lists { + top: 40%; + } + } + + .everest-forms-panel { + width: 100%; + display: none; + + &.active { + display: block; + } + + .everest-forms-sub-label { + font-size: 12px; + font-weight: 400; + margin-bottom: 0; + color: $color_gray-base; + } + + .everest-forms-panel-sidebar-content { + display: flex; + + .everest-forms-panel-content-wrap { + width: calc(100% - 400px); + } + } + + .everest-forms-one-half { + float: left; + width: 49%; + margin-right: 2%; + + &:nth-child(2) { + margin-right: 0; + } + } + + .everest-forms-field-row { + margin: 0 0 10px 0; + position: relative; + } + + .everest-forms-panel-sidebar { + width: 400px; + height: calc(100vh - 105px); + position: relative; + background-color: $color_gray-light-skin; + border-right: 1px solid $color_gray-lighten; + + @media screen and (max-width: 1226px) { + height: calc(100vh - 180px); + } + + #evf-collapse { + width: 22px; + height: 41px; + background: #f6f7f9; + position: fixed; + bottom: 100px; + border-style: solid; + border-width: 1px 1px 1px 0px; + border-color: #cdd0d8; + border-radius: 0 3px 3px 0; + z-index: 1; + cursor: pointer; + + &.close { + left: 559px; + + @media screen and (max-width: 960px) { + left: 315px; + } + + @media screen and (max-width: 782px) { + left: 279px; + } + + @media screen and (max-width: 600px) { + display: none; + } + } + + &.open { + left: 160px; + + svg { + transform: rotate(180deg) translateX(2px); + } + + &:hover { + svg { + transform: rotate(180deg) translateX(0px); + } + } + + @media screen and (max-width: 960px) { + left: 36px; + } + + @media screen and (max-width: 782px) { + left: 0; + } + } + + svg { + width: 12px; + height: 12px; + display: block; + transform: translateX(-2px); + transition: all 0.3s ease-in-out; + } + + &:hover { + svg { + transform: translateX(-4px); + } + } + } + + .everest-forms-input-group { + background-color: $color-white; + border: 1px solid $input-border-color; + border-radius: 4px; + + .everest-forms-input-control { + background: none; + border-color: transparent !important; + box-shadow: none; + height: 38px; + padding: 0 12px; + + &::placeholder { + font-size: 14px; + color: #999999; + } + + &:focus { + border-color: transparent; + } + } + + &__text { + background: none; + border: none; + + svg { + fill: #999999; + } + } + + &:focus-within { + border: 1px solid $everestforms; + box-shadow: 0 0 0 1px $everestforms; + } + } + + .everest-forms-fields-not-found { + text-align: center; + margin-top: 2.85em; + + .everest-forms-fields-not-found__title { + font-size: 1.7em; + } + } + + .everest-forms-add-fields-heading { + display: block; + font-size: 16px; + line-height: 150%; + font-weight: 500; + margin-bottom: 20px; + padding-bottom: 14px; + color: $color_gray-dark; + border-bottom: 1px solid $color_gray-lighten; + display: flex; + align-items: center; + justify-content: space-between; + + i { + display: flex; + align-items: center; + justify-content: center; + width: 18px; + height: 18px; + + &::before { + padding: 0; + } + } + } + + .evf-registered-buttons { + list-style: none; + padding: 0; + display: flex; + flex-wrap: wrap; + gap: 16px; + } + + .evf-registered-item { + padding: 20px 8px; + border: 1px solid $color_gray-lighten; + width: 30.3%; + z-index: 999; + color: $color_gray-light; + cursor: pointer; + border-radius: 4px; + font-size: 12px; + transition: all 0.3s ease-in-out; + text-align: center; + background-color: $color-white; + + .dashicons { + display: block; + margin: 0 auto; + } + &.evf-upgrade-addon { + cursor: not-allowed; + } + + // &.evf-upgrade-addon, + &.recaptcha_empty_key_validate, + &.turnstile_empty_key_validate, + &.hcaptcha_empty_key_validate, + &.enable-stripe-model, + &.enable-authorize-net-model, + &.enable-mollie-model &.enable-square-model { + opacity: 0.45; + + &:hover { + opacity: 1; + color: $evf_primary-color; + border-color: $evf_primary-color; + background: #fbf9fd; + } + } + + &.evf-upgrade-addon, + &.upgrade-modal { + position: relative; + background: #fafbfc; + border-color: #e3e6ea; + color: #ccd1d6; + + &::before { + content: ""; + background-image: url(../images/icons/evf-pro-icon.png); + background-repeat: no-repeat; + background-position: center; + background-size: 100%; + position: absolute; + border-radius: 2px; + width: 16px; + height: 16px; + top: 7px; + right: 7px; + } + } + + &:hover { + color: $evf_primary-color; + border-color: $evf_primary-color; + background: #fbf9fd; + + .evf-icon { + color: inherit; + } + + svg { + .cls-1, + .cls-2, + .cls-3 { + fill: $blue; + } + } + } + + &:focus { + outline: none; + } + + svg { + width: 40px; + height: 40px; + display: block; + margin: 0 auto 10px; + + .cls-1, + .cls-2, + .cls-3 { + fill: #414042; + transition: 0.5s fill ease-in-out; + font-size: 7px; + font-weight: 300; + } + } + + &.ui-draggable-dragging { + margin: 0; + width: 105px !important; + background-color: $color-white; + position: relative; + z-index: 99999; + + svg { + .cls-1, + .cls-2, + .cls-3 { + fill: $blue; + } + } + } + } + + .evf-setting--checkbox, + .evf-field-option--checkbox { + input, + label { + width: auto; + padding: 0; + display: inline-block; + vertical-align: top; + height: auto; + } + + input { + margin: 3px 5px 0 0; + } + } + + .everest-forms-field-options { + display: none; + + .everest-forms-border-container { + .everest-forms-field-option-row { + &.everest-forms-field-option-row-date_format { + > .inline { + margin-left: 0; + margin-right: 10px; + + &:last-child { + margin-right: 0; + } + } + } + + &:last-child { + margin-bottom: 15px; + } + } + } + + .everest-forms-field-option-row { + position: relative; + margin-bottom: 15px; + + &:last-child { + margin-bottom: 0; + } + + .inline { + margin-bottom: 0; + display: inline-block; + vertical-align: top; + margin-left: 5px; + } + + .everest-forms-current-date-format, + .everest-forms-past-date-disable-format, + .everest-forms-min-max-date-format, + .everest-forms-slot-booking { + margin-bottom: 14px; + } + + &.everest-forms-field-option-row-limit_controls, + &.everest-forms-field-option-row-min_length_controls { + display: flex; + align-items: center; + + input[type="number"] { + width: 30%; + margin-right: 8px; + } + + select { + min-height: 30px; + } + + &.everest-forms-hidden { + display: none !important; + } + } + input, + select { + height: 36px; + + &[type="checkbox"], + &[type="radio"] { + height: 16px; + } + } + + input, + select, + textarea { + &:focus { + box-shadow: none; + border-color: $evf_primary-color; + } + } + } + + .everest-forms-field-option { + display: none; + + // Email/Password Confirmation. + &.everest-forms-confirm-disabled, + &.everest-forms-field-option-email:not( + .everest-forms-confirm-enabled + ), + &.everest-forms-field-option-password:not( + .everest-forms-confirm-enabled + ) { + .everest-forms-field-option-row-sublabel_hide, + .everest-forms-field-option-row-confirmation_placeholder { + display: none; + } + } + } + + .everest-forms-field-option-phone { + .format-selected-smart { + display: none; + } + + .format-selected-default { + .everest-forms-field-option-row { + margin-bottom: 15px; + } + } + } + + .everest-forms-field-option-group { + &.everest-forms-field-option-group-basic { + .everest-forms-field-option-group-toggle { + padding-top: 0; + } + } + + &:last-child { + .everest-forms-field-option-group-inner { + border-bottom: none; + } + } + } + + .everest-forms-field-option-group-toggle { + background-color: $color_gray-light-skin; + border-bottom: 1px solid $color_gray-lighten; + padding: 15px 0; + font-size: 14px; + font-weight: 600; + display: block; + color: $color_gray-dark; + } + + .everest-forms-field-option-group-inner { + padding: 15px 0; + border-bottom: 1px solid $color_gray-lighten; + } + } + + .evf-panel-tab { + display: flex; + align-items: center; + justify-content: space-between; + padding: 15px 20px; + font-size: 14px; + font-weight: 600; + color: $color_gray-dark; + background-color: adjust-color( + $color_gray-more-lighten, + $saturation: -1, + $lightness: +2 + ); + border-bottom: 1px solid $color_gray-lighten; + position: relative; + transition: all 0.3s ease-in-out; + + &.upgrade-addons-settings { + opacity: 0.4; + } + + &::before { + content: ""; + background: #7545bb; + width: 4px; + height: 100%; + position: absolute; + top: 0; + left: 0; + opacity: 0; + transition: all 0.3s ease-in-out; + } + + .everest-forms-toggle-arrow { + font-size: 14px; + margin-left: auto; + line-height: 1.4; + } + + &:hover, + &.active { + position: relative; + color: $everestforms; + background-color: $color-white; + + &::before { + opacity: 1; + } + } + } + + .everest-forms-active-connections, + .everest-forms-active-email, + .everest-forms-active-sms-notifications { + display: none; + padding: 0 20px; + margin-top: -2px; + background: $color-white; + position: relative; + border-bottom: 1px solid $color_gray-lighten; + + &.active { + display: flex; + align-items: flex-end; + flex-direction: column-reverse; + + &.everest-forms-hidden { + display: none; + } + } + + .everest-forms-connections-add, + .everest-forms-email-add { + margin-bottom: 20px; + } + + .everest-forms-active-connections-list, + .everest-forms-active-email-connections-list, + .everest-forms-active-sms-notifications-connections-list { + width: 100%; + padding: 14px 16px 16px; + display: flex; + flex-wrap: wrap; + margin: 0 0 20px; + border-radius: 3px; + border: 1px solid #e9e9e9; + background: $color-white; + gap: 24px; + + &.empty-list { + display: none; + } + + h4 { + margin-top: 0; + color: #222; + font-size: 14px; + font-weight: 500; + line-height: 150%; + margin-top: 4px; + margin-bottom: 24px; + } + + li { + width: 100%; + display: flex; + padding: 10px; + cursor: pointer; + margin-bottom: 2px; + align-items: center; + justify-content: space-between; + transition: all 0.25s ease 0s; + // border: 1px solid $color_gray-lighten; + + &.active-user { + background: #f6f3fa; + border: 0; + padding: 10px; + border-radius: 3px; + + .user-nickname { + color: $everestforms; + transition: all 0.25s ease 0s; + color: $evf_primary-color; + line-height: 150%; + } + } + + &:hover { + .user-nickname { + color: $everestforms; + } + } + + .user-nickname { + color: $color_gray-base; + font-weight: 600; + } + + .evf-email-side-section { + display: flex; + align-items: center; + gap: 12px; + + .evf-toggle-section { + .everest-forms-toggle-form { + margin: 0; + } + } + + .evf-vertical-divider { + background: #bababa; + width: 1.5px; + height: 16px; + } + + a { + // display: flex; + + span { + display: flex; + align-items: center; + justify-content: center; + } + + svg { + width: 18px; + height: 18px; + fill: #999999; + transition: all 0.3s ease-in-out; + } + + &:hover { + svg { + fill: #ff2f39; + } + } + } + } + + .toggle-remove { + color: $color_gray-base; + cursor: pointer; + position: relative; + padding-left: 13px; + transition: all 0.25s ease 0s; + + &:hover { + color: $red; + + &::before, + &::after { + background: $red; + } + } + + &::before, + &::after { + top: 50%; + left: 3px; + width: 2px; + content: ""; + height: 10px; + position: absolute; + background: $color_gray-base; + display: inline-block; + transition: all 0.25s ease 0s; + } + + &::before { + transform: translateY(-50%) + rotate(45deg); + } + + &::after { + transform: translateY(-50%) + rotate(-45deg); + } + } + } + } + + .everest-forms-active-email-connections-list { + gap: 0; + } + } + + .everest-forms-active-email { + position: relative; + transition: all 0.3s ease-in-out; + + &::before { + content: ""; + background: #7545bb; + width: 4px; + height: 100%; + position: absolute; + top: 0; + left: 0; + opacity: 0; + transition: all 0.3s ease-in-out; + } + + &.active { + &::before { + opacity: 1; + } + } + + .everest-forms-email-add { + position: absolute; + top: 14px; + right: 38px; + border-radius: 3px; + background: #f6f3fa; + color: #8c64c6; + font-size: 13px; + font-weight: 400; + line-height: 150%; + padding: 6px 12px 6px 10px; + display: flex; + align-items: center; + gap: 6px; + margin: 0; + transition: all 0.3s ease-in-out; + + svg { + width: 13px; + height: 13px; + fill: #8c64c6; + transition: all 0.3s ease-in-out; + } + + &:hover { + background: #8c64c6; + color: $color-white; + + svg { + fill: $color-white; + } + } + } + } + } + + .everest-forms-field-option-date-time { + .format-selected-date .everest-forms-time, + .format-selected-time .everest-forms-date { + display: none; + } + } + + .everest-forms-field-captcha { + .format-selected-math { + font-size: 16px; + + input { + width: 70px; + display: inline-block; + } + } + + .format-selected-math .everest-forms-question, + .format-selected-question .everest-forms-equation { + display: none; + } + } + + .everest-forms-field-option-address { + .default, + .placeholder { + width: 44%; + float: left; + margin-right: 2%; + + input { + width: 99%; + } + + label { + font-weight: 400; + } + } + + .hide { + input { + margin: 7px 0 0 0; + } + } + } + + &-sidebar-content { + &.collapsed { + .everest-forms-panel-sidebar { + width: 0px; + } + + .everest-forms-panel-content-wrap { + width: 100% !important; + + // @media screen and (max-width: 960px) { + // width: 100% !important; + // } + } + } + } + } + + .everest-forms-panel-content-wrap { + .evf-admin-row { + display: flex; + position: relative; + margin-bottom: 15px; + background-color: transparent; + border: 1px solid transparent; + transition: + 0.5s border, + 0.5s background-color; + + &:last-child { + margin-bottom: 0; + } + + .evf-toggle-row { + top: 0; + right: 0; + opacity: 0; + display: flex; + cursor: pointer; + position: absolute; + visibility: hidden; + color: $color-white; + transition: 0.7s all; + z-index: 9999; + + .evf-show-grid { + &:hover { + span { + &.dashicons { + background-color: $green; + } + } + } + } + + .evf-delete-row { + span { + &.dashicons { + // border-right: 1px solid transparentize($color-white, 0.8); + border-right: 1px solid #fff; + } + } + + &:hover { + span { + &.dashicons { + background-color: $red; + } + } + } + } + + .evf-duplicate-row { + span { + &.dashicons { + border-radius: 0 0 0 3px; + border-right: 1px solid + transparentize($color-white, 0.8); + } + } + + &:hover { + span { + &.dashicons { + background-color: $blue; + } + } + } + } + + span { + &.dashicons { + // background: $color_gray-base; + font-size: 14px; + height: auto; + width: auto; + // color: $color-white; + padding: 5px; + background: #e9e9e9; + color: #666666; + + &:hover { + color: #fff; + } + } + } + + .evf-toggle-row-content { + display: none; + position: absolute; + width: 160px; + padding: 20px; + text-align: center; + right: -10px; + border-radius: 5px; + background-color: $color-white; + font-weight: 600; + font-size: 12px; + top: 35px; + transition: 0.9s background-color; + border: 1px solid $color-gray-lighten; + box-shadow: 1px 2px 10px 0 + transparentize($color_gray-dark, 0.85); + + &::before, + &::after { + content: ""; + position: absolute; + } + + &::before { + top: -7px; + right: 14px; + border-right: 7px solid transparent; + border-bottom: 7px solid $color-white; + border-left: 7px solid transparent; + } + + &::after { + top: -8px; + right: 12px; + border-right: 9px solid transparent; + border-bottom: 9px solid $color-gray-lighten; + border-left: 9px solid transparent; + z-index: -1; + } + + > span { + color: $color_gray-base; + display: block; + } + + small { + color: $color_gray-light; + margin-bottom: 10px; + display: block; + } + + .evf-grid-selector { + margin: 3px; + width: 40px; + height: 30px; + display: inline-block; + border: 1px solid $color_gray-lighten; + + span { + height: 100%; + display: inline-block; + background: $color-white; + + &:nth-child(n + 1) { + border-left: 1px solid + $color_gray-lighten; + } + &:nth-child(1) { + border-left: 0 none; + } + } + + &.active { + border-color: $blue; + + span { + border-color: $blue; + } + } + } + } + } + + &.evf-hover { + // background-color: lighten($blue, 48%); + // border: 1px dashed $blue; + background: #fcfcfc; + border: 1px solid #e7e7e7; + border-radius: 5px; + + .evf-admin-grid { + // border: 1px dashed $color-gray-light; + background: transparent; + } + + .evf-toggle-row { + opacity: 1; + visibility: visible; + } + } + + .evf-admin-grid { + padding: 20px; + cursor: pointer; + background: $color-white; + position: relative; + border: 1px solid transparent; + transition: + 0.5s border, + 0.5s background-color; + + &.evf-hover { + &.evf-item-hover { + position: relative; + + .everest-forms-field, + .evf-registered-item { + &:nth-last-child(2) { + margin-bottom: 0; + + &.active { + margin-bottom: 10px; + } + } + } + + &::before { + display: none; + } + } + } + + &.evf-grid-1 { + width: 100%; + } + + &.evf-grid-2 { + width: 50%; + } + + &.evf-grid-3 { + width: 33.3333%; + } + + &.evf-grid-4 { + width: 25%; + } + + .evf-registered-item { + padding: 20px; + font-size: 18px; + min-height: 94px; + margin-bottom: 10px; + + &:last-child { + margin-bottom: 0; + } + + &.ui-draggable { + width: 100%; + + .evf-icon { + display: inline-block; + } + } + + .evf-icon { + font-size: 24px; + vertical-align: middle; + } + + .spinner { + float: none; + width: 25px; + height: 25px; + margin: 10px 0 5px 10px; + } + + .dashicons { + font-size: 22px; + margin-top: 3px; + } + } + + .ui-sortable-placeholder { + width: 100%; + visibility: visible !important; + background-color: lighten($green, 42%); + border: 1px dashed lighten($green, 15%); + } + + &.evf-empty-grid { + display: flex; + align-items: center; + justify-content: center; + position: relative; + border: 1px dashed $color-gray-light; + + &::before { + content: "\f132"; + font-size: 40px; + font-family: dashicons; + line-height: 1.2; + cursor: all-scroll; + color: $color_gray-lighten; + } + } + } + } + + .everest-forms-field-payment-single { + .widefat, + .item-price-hidden { + display: none; + } + .item-price-hidden { + margin: 0; + color: #999; + font-size: 12px; + } + + .format-selected-user { + .widefat { + display: block; + } + .item-price { + display: none; + } + } + + .format-selected-hidden { + .item-price-hidden { + display: block; + } + } + } + + .everest-forms-field { + cursor: move; + padding: 15px; + position: relative; + margin-bottom: 10px; + border: 1px solid transparent; + border-radius: 3px; + transition: 0.5s box-shadow; + + .everest-forms-image-choices { + .everest-forms-image-choices-item { + label { + font-weight: normal; + margin-bottom: 0; + } + + .everest-forms-image-choices-image { + display: block; + margin-bottom: 10px; + + img { + max-width: 100%; + display: block; + } + } + } + } + + // column layout for choice fields + &.everest-forms-list-2-columns, + &.everest-forms-list-3-columns { + ul { + display: flex; + flex-wrap: wrap; + margin-left: -15px; + margin-right: -15px; + + li { + padding-left: 15px; + padding-right: 15px; + } + } + } + + &.everest-forms-list-2-columns { + li { + flex: 0 0 50%; + max-width: 50%; + + &:nth-child(1n + 3) { + margin-top: 10px; + } + } + } + + &.everest-forms-list-3-columns { + li { + flex: 0 0 33.333%; + max-width: 33.333%; + + &:nth-child(1n + 4) { + margin-top: 10px; + } + } + } + + &.everest-forms-list-inline { + ul { + li { + display: inline-block; + margin-right: 15px; + } + } + } + + &:last-child { + margin-bottom: 0; + } + + &.everest-forms-field--first, + &.everest-forms-field--last { + width: 48.5%; + margin-right: 3%; + float: left; + } + + &.everest-forms-field--last { + margin-right: 0; + float: right; + } + + &.active { + margin: 0 0 10px; + // border: 1px solid $color_gray-lighten; + border: 1px solid #d7d9e0; + // background: $color_gray-light-skin; + background: #f9f9f9; + + .evf-field-action { + opacity: 1; + visibility: visible; + } + + &:last-child { + margin-bottom: 0; + } + } + + &.required label { + .required { + font-weight: 300; + margin: 0 0 0 5px; + display: inline-block; + vertical-align: middle; + } + } + + &.ui-sortable-placeholder { + border: 1px dashed transparentize($blue, 0.75); + } + + &.label_hide { + input[type="text"] { + margin-bottom: 0; + } + + .description { + margin-top: 5px; + + &:empty { + margin-top: 0; + } + } + } + + input { + &[type="text"], + &[type="email"] { + margin-bottom: 5px; + } + + &[type="checkbox"], + &[type="radio"] { + margin-right: 10px; + } + } + + select, + textarea { + margin-bottom: 5px; + } + + select { + option { + color: inherit; + + &.placeholder { + opacity: 0.5; + } + } + + &[multiple] { + padding: 6px 8px; + box-shadow: none; + } + } + + canvas { + border: 1px solid rgba(222, 222, 222, 0.75); + } + + &.everest-forms-field-select { + select:not([multiple]) { + height: 35px; + } + } + + .select2-container { + margin-bottom: 5px; + width: 100% !important; + + span.selection { + width: 100% !important; + } + + .select2-selection--multiple { + border-color: $color_gray-lighten; + } + + .select2-selection__choice { + margin: 4px 4px 0 0; + } + + .select2-search__field { + min-height: 24px; + line-height: 1.4; + } + } + + .evf-field-action { + position: absolute; + // top: 15px; + // right: 15px; + top: 6px; + right: 1px; + visibility: hidden; + opacity: 0; + transition: 0.5s all; + + a { + padding: 5px; + // color: $color-white; + // background: $color_gray-base; + // border-right: 1px solid transparentize($color-white, 0.8); + background: #e9e9e9; + border-right: 1px solid #fff; + color: #666666; + + &:first-child { + // border-radius: 3px 0 0 3px; + border-radius: 0 0 0 3px; + } + + &:last-child { + // border-radius: 0 3px 3px 0; + border-radius: 0 3px 0 0; + border-right: none; + } + + &.everest-forms-field-delete:hover { + background-color: $red; + } + + &:hover { + color: #fff; + background-color: $blue; + } + } + + .dashicons { + font-size: 15px; + height: auto; + width: auto; + } + } + + &.label_hide { + .label-title { + display: none; + } + } + + &.sublabel_hide { + .everest-forms-sub-label { + display: none; + } + } + + .everest-forms-confirm-enabled { + display: flex; + + .everest-forms-confirm-primary, + .everest-forms-confirm-confirmation { + width: 50%; + flex-wrap: wrap; + } + + .everest-forms-confirm-primary { + padding-right: 15px; + } + + .everest-forms-confirm-confirmation { + padding-left: 15px; + } + } + + .everest-forms-confirm-disabled { + .everest-forms-confirm-primary { + .everest-forms-sub-label { + display: none; + } + } + + .everest-forms-confirm-confirmation { + display: none; + } + } + + &:hover { + border-radius: 3px; + border: 1px dashed #8c64c6; + background: #f8f8fa; + + .evf-field-action { + visibility: visible; + opacity: 1; + } + } + + &.ui-sortable-helper { + padding: 20px 30px; + height: auto !important; + left: -20px; + right: -20px; + background-color: $color-white; + + &:hover { + .evf-field-action { + display: none; + } + } + } + + label { + cursor: all-scroll; + } + + img { + width: 280px; + height: auto; + } + } + + .file-uploader { + width: 100%; + border: 2px dashed $color_gray-lighten; + background-color: $color_gray-light-skin; + border-radius: 3px; + cursor: pointer; + text-align: center; + padding-top: 30px; + padding-bottom: 30px; + position: relative; + + svg { + width: 30px; + height: 30px; + fill: #bbbcbd; + margin-bottom: 20px; + } + + input { + &.file-input { + touch-action: manipulation; + max-width: 100%; + min-width: 14px; + margin: 0; + opacity: 0; + height: 18px; + } + } + + .drop { + display: block; + font-size: 14px; + font-weight: 600; + color: $color_gray-light; + margin-bottom: 10px; + } + + .or { + font-size: 12px; + color: $color-gray-light; + font-weight: 600; + display: block; + margin-bottom: 10px; + } + + .file-control { + position: absolute; + bottom: 30px; + color: $blue; + padding-bottom: 2px; + display: block; + left: 0; + right: 0; + + &::before { + content: ""; + width: 45px; + background-color: $blue; + height: 1px; + display: block; + left: 50%; + bottom: -2px; + position: absolute; + transform: translateX(-50%); + } + } + } + + .publishing-action { + width: 100%; + text-align: right; + } + + .submit-button { + display: inline-block; + font-size: 12px; + font-weight: 600; + color: $color-white; + padding: 15px 20px; + border: 0 none; + background-color: $green; + border-radius: 3px; + } + } + + label { + font-size: 14px; + margin-bottom: 10px; + // color: $color_gray-base; + color: #222222; + display: block; + font-weight: 600; + + i { + color: $color_gray-light; + font-size: 16px; + line-height: 1.2; + } + + .required { + color: $red; + display: none; + } + + input { + &[type="checkbox"], + &[type="radio"] { + margin-right: 10px; + } + } + + &.evf-toggle-switch { + margin-bottom: 0; + } + + &.evf-toggle-label { + display: inline-block; + margin-bottom: 0; + } + + &.everest-forms-hidden { + display: none; + } + + &.evf-privacy-policy-consent-message { + display: initial; + margin-bottom: 0; + } + } + + .everest-forms-label-edit { + margin-bottom: 4px; + + label { + margin-bottom: 4px; + padding: 4px 0; + flex: 1; + } + + input { + font-size: 13px; + font-weight: 600; + } + + .dashicons { + margin-right: 7px; + } + } + + input:not(.ed_button), + textarea:not(.wp-editor-area) { + color: $color_gray-base; + + &::placeholder { + color: $color_gray-light; + } + } + + textarea, + textarea:not(.wp-editor-area) { + height: 120px; + + &.short { + height: 60px; + } + } + + .description { + color: $color_gray-normal; + } + + .everest-forms-checklist { + ul { + label { + margin-top: 0; + margin-bottom: 0; + font-weight: normal; + } + } + } + + .everest-forms-question { + margin-top: 0; + line-height: 1.2; + } + + .evf-grid-lists { + margin-left: -1.5%; + margin-right: 1.5%; + background-color: $color_gray-light-skin; + display: flex; + + .evf-grid-lists-item { + padding-left: 1.5%; + padding-right: 1.5%; + background-color: $color-white; + } + } + + .evf-content-section-title { + position: relative; + font-size: 22px; + font-weight: 600; + line-height: 130%; + margin-bottom: 20px; + padding-bottom: 20px; + display: flex; + align-items: center; + justify-content: space-between; + color: #222222; + border-bottom: 1px solid #e9e9e9; + + .evf-title { + margin-right: 20px; + } + + .evf-enable-email-toggle { + position: absolute; + top: 15px; + right: -20px; + + img { + width: 100%; + height: auto; + } + } + + .evf-toggle-section { + margin-top: 2px; + } + } + + .everest-forms-panel-field { + position: relative; + margin-bottom: 20px; + max-width: 740px; + + .wp-editor-container { + margin-bottom: 10px; + border-radius: 4px; + + .quicktags-toolbar { + border-radius: 4px 4px 0 0; + } + + textarea { + border-radius: 0 0 4px 4px; + } + } + + .submission-date-wrapper { + .evf-form-row { + margin-left: 0; + margin-right: 0; + + .evf-form-col-12 { + gap: 12px; + + .everest-forms-panel-field-checkbox { + margin-bottom: 12px; + + input[type="checkbox"] { + margin-right: 8px; + } + } + } + } + } + + input, + select, + textarea { + &:focus { + box-shadow: none; + border-color: $evf_primary-color; + } + } + + .desc { + margin: 10px 0; + font-style: italic; + line-height: 1.2; + } + + .evf-hidden-content { + margin-top: 10px; + } + + .max-entry-section { + .max-entry-section-content { + display: flex; + + .everest-forms-panel-field { + margin-bottom: 0; + } + + .entry-period { + flex: 1; + margin-left: 10px; + } + } + } + + &.everest-forms-panel-field-tinymce { + .evf-toggle-smart-tag-display { + top: 38px; + right: 8px; + border: 1px solid #e1e1e1; + } + + .evf-smart-tag-lists { + top: 70px; + } + } + + &#everest-forms-panel-field-settings-query_string-wrap { + .evf-toggle-smart-tag-display { + top: 32px; + } + } + + &.evf_conditional_logic_container { + label { + margin-bottom: 0; + display: inline-block; + } + } + } + + .evf-choices-list { + background: $color_gray-more-lighten; + border-radius: 4px; + padding: 1px 8px; + + .sort { + cursor: grab; + display: flex; + margin-top: 6px; + padding-right: 6px; + color: $color_gray-light; + + svg { + fill: currentColor; + transform: rotate(90deg); + } + + &:active { + cursor: grabbing; + } + } + + li { + background: $color-white; + border: 1px solid $color_gray-lighten; + display: flex; + flex-wrap: wrap; + padding: 8px; + margin: 8px 0; + z-index: 99999 !important; + + .evf-choice-list-input { + flex: 1; + margin-right: 6px; + } + + input { + &[type="text"] { + width: 100%; + } + + &[type="radio"], + &[type="checkbox"] { + margin: 7px 6px 0 0; + } + + &.value { + display: none; + margin-top: 8px; + + &.evf-money-input { + width: 22%; + display: inline-block; + margin: 0 0 0 auto; + flex: 0 0 22%; + } + } + } + + .everest-forms-attachment-media-view { + flex: 100%; + display: none; + margin-top: 8px; + + .button-add-media { + width: 100%; + padding: 8px; + outline: none; + cursor: pointer; + border-radius: 3px; + color: $color_gray-base; + border: 1px dashed $color-gray-lighten; + } + + .thumbnail-image { + display: block; + max-height: 200px; + margin-bottom: 3px; + border-radius: 4px; + position: relative; + overflow: hidden; + + img { + display: block; + max-width: 100%; + user-select: none; + border-radius: 4px; + } + } + + .actions { + margin-top: 8px; + } + } + + &.ui-sortable-placeholder { + visibility: visible !important; // Overwrite CSS over JS. + background: $color_gray-more-lighten; + border: 1px dashed $color_gray-lighten; + } + + &.ui-sortable-helper { + z-index: 99999 !important; // Overwrite CSS over JS. + } + } + + .add, + .remove { + display: inline-flex; + align-items: center; + justify-content: center; + width: 20px; + height: 20px; + margin-top: 5px; + border: none; + + .dashicons { + width: 16px; + height: 16px; + font-size: 16px; + } + } + + .add { + &:hover { + color: $blue; + background: none; + } + } + + .remove { + margin-left: 0; + + &:hover { + color: $red; + background: none; + } + } + + &.show-images { + li { + .everest-forms-attachment-media-view { + display: block; + } + } + } + + &.show-values { + li { + input[type="text"].value { + display: block; + } + } + } + } + + .everest-forms-field-option-row-choices_images { + .notice { + display: inline-block; + margin: 0 0 15px 0 !important; + + &.hidden { + display: none; + } + } + } + + .everest-forms-field-option-row-rows, + .everest-forms-field-option-row-columns, + .everest-forms-field-option-row-drop_down_choices, + .everest-forms-field-option-row-choices, + .everest-forms-field-option-row-questions { + ul { + li { + clear: both; + padding: 5px 10px; + border-radius: 4px; + border: 1px solid transparent; + } + } + + .evf-questions-list { + li { + padding: 10px; + background: $color-white; + margin-bottom: 10px; + border: 1px solid $color_gray-lighten; + + input[type="text"] { + width: calc(100% - 39px); + } + + .answer-wrap { + margin-top: 6px; + } + } + } + + .question-wrap, + .answer-wrap { + input { + margin-right: 8px; + vertical-align: middle; + } + + .add, + .remove { + width: 30px; + height: 30px; + display: inline-flex; + vertical-align: middle; + border-radius: 3px; + border: 1px solid $color_gray-lighten; + } + + .add { + &:hover { + background: $blue; + border-color: $blue; + } + } + + .remove { + &:hover { + background: $red; + border-color: $red; + } + } + } + } + + .everest-forms-field-option-payment-multiple, + .everest-forms-field-option-payment-checkbox { + .everest-forms-field-option-row { + li { + input[type="text"] { + width: 73%; + margin-right: 8px; + + &.evf-money-input { + width: 23%; + display: inline-block; + margin: 0 0 0 auto; + flex: 0 0 23%; + } + } + } + } + } + + .evf-content-email-settings-inner { + display: none; + -webkit-animation: fadeIn 0.5s; + animation: fadeIn 0.5s; + margin: 20px 0; + border-radius: 4px; + + &.active-connection { + display: block; + + &.everest-forms-hidden { + display: none; + } + } + } + + .evf-content-sms-notifications-settings-inner { + display: none; + -webkit-animation: fadeIn 0.5s; + animation: fadeIn 0.5s; + margin: 20px 0; + border-radius: 4px; + + &.active-connection { + display: block; + + &.everest-forms-hidden { + display: none; + } + } + } + } + + .evf-registered-item { + z-index: 999; + cursor: pointer; + border-radius: 2px; + font-size: 12px; + text-align: center; + margin: 0; + background-color: $color-white; + border: 1px solid $color_gray-lighten; + color: $color_gray-normal; + + .evf-icon { + color: inherit; + display: block; + // font-size: 32px; + font-size: 28px; + text-align: center; + margin-bottom: 6px; + padding: 0; + } + + &.ui-draggable-dragging { + width: calc(100% - 20px) !important; + text-align: center !important; + font-size: 12px !important; + } + + &.ui-sortable-placeholder { + width: 100% !important; + } + } + + .everest-forms-field.ui-draggable-dragging { + margin: 0; + width: 105px !important; + background-color: $color-white; + text-align: center; + font-size: 12px !important; + + .evf-icon { + color: inherit; + display: block !important; + font-size: 32px !important; + } + } + + .everest-forms-border-container { + border: 1px solid #e9e9e9; + background: #fcfcfd; + border-radius: 5px; + padding: 18px 22px 6px; + margin-bottom: 20px; + max-width: 740px; + + &:last-child { + margin-bottom: 0; + } + + .everest-forms-border-container-title { + // display: inline-block; + color: #222222; + font-size: 18px; + font-weight: 600; + line-height: 140%; + background: transparent; + margin: 0 0 16px; + padding-bottom: 14px; + border-bottom: 1px solid #e9e9e9; + } + + label { + margin-bottom: 10px; + margin-top: 2px; + + .everest-forms-help-tooltip { + height: 16px; + width: 16px; + line-height: 1; + vertical-align: middle; + } + } + + select { + // margin-bottom: 14px; + } + + .inline { + margin-top: 0; + padding-left: 0; + } + + .input-group-col-2 { + margin-bottom: 15px; + + input[type="text"], + input[type="number"], + select { + margin-bottom: 0; + margin-left: 0; + } + } + } + + .everest-forms-tab-content { + position: relative; + // height: calc(100vh - 200px); + + .everest-forms-add-fields-group { + margin-bottom: 36px; + + &.closed { + margin-bottom: 0; + } + } + + .everest-forms-notice { + display: inline-block; + } + } + + .everest-forms-panel { + .panel-wrap { + overflow: hidden; + } + + .wp-picker-input-wrap { + label { + font-weight: 400; + display: inline-block; + } + } + } + + .everest-forms-panel-content-wrap { + .everest-forms-panel-content { + position: relative; + padding: 30px; + background: #f6f7f9; + height: calc(100vh - 105px); + overflow-x: hidden !important; + + @media screen and (max-width: 1226px) { + height: calc(100vh - 180px); + } + + /* width */ + &::-webkit-scrollbar { + width: 6px; + } + + /* Track */ + &::-webkit-scrollbar-track { + box-shadow: inset 0 0 5px rgb(158, 158, 158); + border-radius: 10px; + } + + /* Handle */ + &::-webkit-scrollbar-thumb { + background: rgb(93, 93, 93); + border-radius: 10px; + } + + /* Handle on hover */ + &::-webkit-scrollbar-thumb:hover { + background: #454545; + } + + .everest-forms-preview-wrap { + background: #ffffff; + padding: 28px 32px; + border-radius: 9px; + border: 1px solid #e1e1e1; + box-shadow: 0px 7px 29px 0px rgba(100, 100, 111, 0.09); + } + + .evf-content-sms-notifications-settings { + .evf-content-sms-notifications-settings-inner { + padding: 20px 20px 0; + border: 1px solid $color_gray-lighten; + + .everest-forms-sms-notfications-name { + background: $color_gray-light-skin; + margin-left: -20px; + margin-top: -20px; + margin-right: -20px; + padding: 20px; + border-radius: 4px 4px 0 0; + border-bottom: 1px solid $color_gray-lighten; + + input[type="text"] { + font-weight: 600; + } + + .everest-forms-text-danger { + margin: 10px 0 0; + } + } + } + } + + .evf-content-email-settings { + .evf-content-email-settings-inner { + // padding: 20px 20px 0; + padding: 18px 22px 24px; + // border: 1px solid $color_gray-lighten; + border: 1px solid #e2e2e2; + max-width: 740px; + + .everest-forms-email-name { + background: transparent; + // margin-left: -20px; + // margin-top: -20px; + // margin-right: -20px; + // padding: 20px; + padding: 0; + border-radius: 4px 4px 0 0; + // border-bottom: 1px solid $color_gray-lighten; + border-bottom: 1px solid #e2e2e2; + margin-bottom: 20px; + + input[type="text"] { + font-weight: 600; + border: 0; + padding: 0; + font-size: 18px; + line-height: 140%; + color: #222; + padding-bottom: 14px; + } + + .everest-forms-text-danger { + margin: 10px 0 0; + } + } + } + } + + .evf-content-post-submissions-settings, + .evf-content-user-registration-settings { + .everest-forms-panel-field { + max-width: 500px; + } + } + + .everest-forms-title-desc { + display: inline-flex; + align-items: center; + flex-direction: row-reverse; + position: relative; + margin-bottom: 10px; + + .evf-icon { + display: flex; + align-items: center; + justify-content: center; + width: 32px; + height: 32px; + cursor: pointer; + border-radius: 3px; + color: $color_gray-normal; + background: $color_gray-more-lighten; + + &::after { + content: ""; + border-radius: 3px; + position: absolute; + left: 32px; + right: calc(100% - 36px); + height: 30px; + border-radius: 0 3px 3px 0; + transition: all 0.3s ease 0s; + } + } + + .everest-forms-name-input { + font-size: 1.3em; + font-weight: 600; + height: 32px; + border: none; + margin: 0; + box-shadow: none; + pointer-events: none; + background: none; + z-index: 1; + padding: 0 12px; + + &.everst-forms-name-editing { + pointer-events: all; + + & + .evf-icon { + background: $everestforms; + color: $color-white; + border-radius: 4px 0 0 4px; + + &::after { + top: 0; + right: 0; + border: 1px solid $everestforms; + } + } + } + + &:focus { + box-shadow: none; + } + } + } + + .evf-admin-field-wrapper { + cursor: move; + position: relative; + + .evf-sortable-placeholder { + background-color: transparentize($green, 0.95); + border: 1px dashed transparentize($green, 0.75); + } + } + + .evf-add-row { + margin: 20px auto 0; + text-align: center; + + span { + // width: auto; + height: auto; + // font-size: 13px; + // background: #51cf66; + font-family: inherit; + padding: 8px 16px 8px 14px; + display: flex; + align-items: center; + justify-content: center; + width: max-content; + margin: 0 auto; + gap: 6px; + font-size: 14px; + background: #7e3bd0; + transition: all 0.3s ease-in-out; + + &.dashicons { + &::before { + // width: 20px; + // height: 20px; + // line-height: 1; + font-size: 16px; + // margin-right: 10px; + font-family: dashicons; + vertical-align: middle; + // padding: 2px 12px 2px 0; + // border-right: 1px solid + // transparentize($color-white, 0.7); + width: auto; + height: auto; + margin: 0; + padding: 0; + border-right: 0; + } + } + + &:hover { + // background: #33ba4a; + background: #8d2fff; + } + } + } + .evf-add-row-repeater { + margin: 20px auto; + text-align: left; + pointer-events: none; + + span { + width: auto; + height: auto; + padding: 10px; + font-size: 13px; + background: #51cf66; + color: $color-white; + font-family: inherit; + + &.dashicons { + &::before { + width: 20px; + height: 20px; + line-height: 1; + font-size: 16px; + margin: 0 10px 0 10px; + font-family: dashicons; + text-align: center; + vertical-align: middle; + padding: 10px; + cursor: text; + border-right: none; + } + } + + &:hover { + background: #33ba4a; + } + } + } + } + } + + .everest-forms-fields-tab { + display: flex; + flex-wrap: wrap; + + a { + width: 50%; + display: block; + padding: 15px 0; + font-size: 14px; + line-height: 150%; + font-weight: 600; + text-align: center; + color: $color_gray-dark; + background: $color_gray-more-lighten; + border-bottom: 1px solid $color_gray-lighten; + + &.active { + background: $color_gray-light-skin; + border-bottom: 1px solid transparent; + } + + &:first-child { + border-right: 1px solid $color_gray-lighten; + } + } + } + + .everest-forms-panel-sidebar { + .everest-forms-add-fields, + .everest-forms-field-options { + padding: 32px 14px; + } + .everest-forms-add-fields { + .everest-forms-input-group { + margin-bottom: 26px !important; + } + } + } + + .evf-range-slider-reset-icon { + width: 16px; + height: 16px; + font-size: 16px; + cursor: pointer; + margin-left: 10px; + color: $color_gray-light; + transition: all 0.2s ease 0s; + } + .everest-forms-field { + &.everest-forms-field-image-upload { + .everest-forms-uploader { + display: flex; + flex-direction: column; + align-items: center; + padding: 20px; + border-radius: 4px; + border: 1px dashed $color_gray-lighten; + + svg { + margin-bottom: 10px; + background: $color_gray-light-skin; + height: 48px; + width: 48px; + padding: 8px; + border-radius: 4px; + } + + span { + display: block; + font-size: 14px; + + &.everest-forms-upload-title { + margin-bottom: 5px; + } + + &.everest-forms-upload-hint { + color: $color_gray-light; + } + } + } + + input { + display: none; + } + + &.active { + svg { + background: darken($color_gray-light-skin, 5%); + } + } + } + } + } +} + +/** + * Settings styling. + **/ +.everest-forms { + h2.evf-nav-tab-wrapper { + margin-bottom: 1em; + } + + nav.evf-nav-tab-wrapper { + margin: 1.5em 0 1em; + } + + .subsubsub { + margin: -8px 0 0; + } + + .evf-admin-breadcrumb { + margin-left: 0.5em; + a { + color: #a46497; + } + } + + #template div { + margin: 0; + + p .button { + float: right; + margin-left: 10px; + margin-top: -4px; + } + + .editor textarea { + margin-bottom: 8px; + } + } + + textarea[disabled="disabled"] { + background: #dfdfdf !important; + } + + table.form-table { + margin: 0; + position: relative; + table-layout: fixed; + + .forminp-radio { + ul { + margin: 0; + + li { + line-height: 1.4em; + } + + &.everest-forms-recaptcha-type { + display: flex; + + li { + margin-right: 15px; + margin-bottom: 0; + + label { + margin-bottom: 0 !important; + margin-top: 5px !important; + } + } + } + } + } + + input[type="text"], + input[type="number"], + input[type="email"] { + height: auto; + } + + textarea.input-text { + height: 100%; + min-width: 150px; + display: block; + } + + // Give regular settings inputs a standard width and padding. + textarea, + input[type="text"], + input[type="email"], + input[type="number"], + input[type="password"], + input[type="datetime"], + input[type="datetime-local"], + input[type="date"], + input[type="time"], + input[type="week"], + input[type="url"], + input[type="tel"], + input.regular-input { + margin: 0; + padding: 0 8px; + width: 350px; + box-sizing: border-box; + vertical-align: top; + + @media only screen and (max-width: 782px) { + width: 100%; + } + } + + input[type="datetime-local"], + input[type="date"], + input[type="time"], + input[type="week"], + input[type="tel"] { + width: 200px; + } + + select { + width: 350px; + margin: 0; + box-sizing: border-box; + height: 32px; + vertical-align: top; + + @media only screen and (max-width: 782px) { + width: 100%; + } + } + + input[size] { + width: auto !important; + } + + // Ignore nested inputs. + table { + select, + textarea, + input[type="text"], + input[type="email"], + input[type="number"], + input.regular-input { + width: auto; + } + } + + textarea.wide-input { + width: 100%; + } + + img.help_tip, + .everest-forms-help-tip { + padding: 0; + margin: -4px 0 0 5px; + vertical-align: middle; + cursor: help; + line-height: 1; + } + + span.help_tip { + cursor: help; + color: $blue; + } + + th { + width: 270px; + position: relative; + padding-right: 24px; + } + + th label { + position: relative; + display: block; + + img.help_tip, + .everest-forms-help-tip { + margin: -7px -24px 0 0; + position: absolute; + right: 0; + top: 50%; + + @media only screen and (max-width: 782px) { + right: auto; + margin-left: 5px; + } + } + } + + th label, + th.titledesc { + color: $color_gray-base; + } + + th label + .everest-forms-help-tip { + position: absolute; + margin: 0; + right: 0; + top: 20px; + } + + td.everest-forms-permissions { + display: flex; + flex-wrap: wrap; + align-items: flex-end; + + fieldset { + padding: 0 20px; + + label { + position: relative; + display: block; + font-weight: 600; + } + } + } + + .select2-container { + vertical-align: top; + margin-bottom: 3px; + } + + table.widefat th { + padding-right: inherit; + } + + .wp-list-table .everest-forms-help-tip { + float: none; + } + + fieldset { + margin-top: 4px; + + img.help_tip, + .everest-forms-help-tip { + margin: -3px 0 0 5px; + } + + p.description { + margin-bottom: 8px; + } + + &:first-child { + margin-top: 0; + } + } + + .iris-picker { + z-index: 100; + display: none; + position: absolute; + border: 1px solid #ccc; + border-radius: 3px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); + + .ui-slider { + border: 0 !important; + margin: 0 !important; + width: auto !important; + height: auto !important; + background: none transparent !important; + + .ui-slider-handle { + margin-bottom: 0 !important; + } + } + } + + .forminp-color { + font-size: 0; + } + + .iris-error { + background-color: #ffafaf; + } + + .colorpickpreview { + padding: 0; + width: 30px; + height: 30px; + box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2); + font-size: 16px; + border-radius: 4px; + margin-right: 3px; + + @media only screen and (max-width: 782px) { + float: left; + width: 40px; + height: 40px; + } + } + } + + .everest-forms-save-button { + box-shadow: none; + text-shadow: none; + transition: 0.25s all ease-in-out; + } + + .everest-forms-integrations-connection { + a { + text-decoration: none; + } + + .everest-forms-integrations { + border-radius: 3px; + background: #fbfafc; + border: 1px solid #eee8f7; + padding: 16px 20px; + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: space-between; + margin-bottom: 10px; + + &[data-action="upgrade"] { + opacity: 0.4; + } + + .integration-header-info { + display: flex; + flex: 1; + align-items: center; + gap: 16px; + + .integration-status { + position: relative; + + .toggle-switch-outer { + width: 20px; + height: 20px; + display: block; + position: relative; + border-radius: 3px; + border: 1px solid #ced4da; + + &.connected { + border-color: $green; + + &::before { + background-color: $green; + } + } + + &::before { + left: 0; + top: 50%; + right: 0; + content: ""; + width: 10px; + height: 10px; + display: block; + margin: 0 auto; + border-radius: 2px; + position: absolute; + background-color: #ced4da; + transform: translateY(-50%); + } + } + } + + .integration-detail { + display: flex; + align-items: center; + gap: 16px; + + .logo { + width: 50px; + height: 50px; + flex: 0 0 50px; + display: flex; + overflow: hidden; + align-items: center; + padding: 2px; + border-radius: 2px; + border: 1px solid #edeff7; + background: #ffffff; + margin: 0; + + img { + width: 100%; + display: block; + } + } + + .integration-info { + a { + display: inline-block; + + &:hover h3 { + color: $everestforms; + } + + &:focus { + box-shadow: none; + } + } + + h3, + p { + margin-top: 0; + margin-bottom: 0; + } + } + } + } + + .integartion-action { + flex-wrap: wrap; + display: flex; + align-items: center; + + .toggle-button { + margin-right: 20px; + + .slide { + display: block; + height: 22px; + cursor: pointer; + width: 44px; + position: relative; + + &.inactive, + &.active { + border-radius: 34px; + + &::before { + border-radius: 50%; + position: absolute; + content: ""; + height: 18px; + width: 18px; + bottom: 2px; + background-color: $color-white; + -webkit-transition: 0.4s; + transition: 0.4s; + } + } + + &.inactive { + background-color: #ced4da; + + &::before { + left: 2px; + } + } + + &.active { + background-color: $everestforms; + + &::before { + right: 2px; + } + } + } + } + + .integration-setup { + width: 35px; + height: 35px; + display: block; + font-size: 16px; + color: #78818a; + position: relative; + border-radius: 3px; + border: 1px solid #ced4da; + transition: all 0.25s; + + .evf-icon-setting-cog { + position: absolute; + top: 50%; + transform: translateY(-50%); + width: 100%; + text-align: center; + + &::before { + content: "\e021"; + } + } + + &:hover { + color: $everestforms; + border-color: $everestforms; + } + } + } + } + } + + .evf-connection-form { + input { + width: 100%; + margin-right: 15px; + margin-bottom: 15px; + + @media screen and (min-width: 1200px) { + width: calc(33% - 20px); + } + } + } + + .everest-forms-integration-content { + display: flex; + background-color: $color-white; + border: 1px solid #ced4da; + + .integration-addon-detail { + width: 400px; + padding: 20px; + border-right: 1px solid #ced4da; + + .evf-integration-info-header { + display: flex; + align-items: center; + } + + .evf-integration-logo { + width: 60px; + height: 60px; + padding: 10px; + display: flex; + align-items: center; + flex: 0 0 60px; + margin: 0 20px 0 0; + border-radius: 3px; + border: 1px solid #ced4da; + + img { + width: 100%; + } + } + + .integration-info { + h3 { + margin-top: 0; + margin-bottom: 5px; + } + + .toggle-switch { + &.connected { + display: block; + padding-left: 15px; + position: relative; + + &::before { + left: 0; + top: 50%; + content: ""; + width: 10px; + height: 10px; + display: block; + position: absolute; + background: $green; + border-radius: 50%; + transform: translateY(-50%); + } + } + } + } + } + + .integration-connection-detail { + padding: 20px; + width: calc(100% - 400px); + + .evf-account-connect { + margin-bottom: 20px; + + h3 { + margin-top: 0; + } + + .everest-forms-btn { + .evf-loading { + width: 14px; + height: 14px; + background-size: 14px 14px; + margin: 2px 0 0 5px; + } + } + } + + .evf-connection-list { + table.evf-connection-list-table { + width: 100%; + border-spacing: 0; + border-collapse: collapse; + border: 1px solid #ced4da; + + tr { + td { + padding: 10px 20px; + border-bottom: 1px solid #ced4da; + + &:last-child { + text-align: right; + } + + .disconnect { + color: $red; + position: relative; + display: inline-block; + padding-left: 15px; + + &::before { + display: block; + content: ""; + position: absolute; + height: 10px; + width: 10px; + background: $red; + top: 50%; + transform: translateY(-50%); + left: 0; + border-radius: 50%; + } + } + } + + &:last-child { + td { + border-bottom: none; + } + } + } + } + } + } + } +} + +/** + * Import and Export + */ +.evf-tools-export-entries, +.everest-forms-import-form, +.everest-forms-import-entries-wrapper, +.everest-forms-export-form, +.everest-forms-form-migrator { + background: $color-white; + max-width: 700px; + padding: 20px; + margin-top: 20px; + box-shadow: 1px 3px 10px transparentize($color_gray-base, 0.95); + border-radius: 4px; + + h3 { + margin: 0; + font-size: 20px; + padding-bottom: 16px; + border-bottom: 2px solid $color_gray-more-lighten; + } + + p { + font-size: 14px; + } + + select { + margin: 1em 0; + } + + .description { + margin-bottom: 16px; + + .dashicons { + width: 16px; + height: 16px; + font-size: 16px; + vertical-align: middle; + margin-right: 2px; + margin-bottom: 3px; + } + } + + .everest-forms-file-upload { + margin: 1em 0; + position: relative; + z-index: 1; + + input { + opacity: 0; + z-index: 2; + width: 400px; + height: 46px; + } + + label { + display: inline-block; + padding: 4px; + min-width: 400px; + position: absolute; + left: 0; + border-radius: 4px; + border: 1px solid $color_gray-lighten; + z-index: -1; + } + + .everest-forms-btn { + width: auto; + height: auto; + font-size: 13px; + margin-right: 10px; + vertical-align: middle; + } + } + + .publishing-action { + padding-top: 20px; + text-align: right; + border-top: 2px solid $color_gray-more-lighten; + } + .evf-fm-wrapper { + .evf-fm-form-list-container { + .evf-fm-forms-table-wrapper { + h4 { + margin: 0; + font-size: 16px; + padding-top: 16px; + padding-bottom: 16px; + } + table, + th, + td { + border-collapse: collapse; + } + + table { + tr { + border-bottom: 2px solid #e9ebf1; + &.evf-fm-hide-row { + display: none; + } + &.evf-fm-show-row { + display: none; + } + + th { + width: 150px; + padding: 12px; + } + td { + .evf-fm-import-actions { + display: flex; + } + width: 600px; + padding: 12px; + text-align: center; + .evf-fm-import-single { + padding: 8px; + background-color: #e9ebf1; + border-radius: 4px; + border: none; + &:hover { + background-color: #7e3bd0; + color: #fff; + border: none; + cursor: pointer; + } + } + .evf-fm-import-entry { + padding: 8px; + background-color: #b5facd; + border-radius: 4px; + border: none; + display: inline; + margin-left: 8px; + &:not(:disabled):hover { + background-color: #7e3bd0; + color: #fff; + border: none; + cursor: pointer; + } + } + } + } + } + .evf-fm-pagination { + padding-top: 16px; + button { + margin: 2px; + cursor: pointer; + &:hover { + background-color: #7e3bd0; + color: #fff; + border: none; + } + &.evf-fm-btn-active { + background-color: #7e3bd0; + color: #fff; + border: none; + } + } + } + .evf-fm-import-selected-wrapper { + display: flex; + flex-direction: row; + justify-content: space-between; + margin-left: 15px; + margin-right: 100px; + } + .evf-fm-import-selected-btn { + margin-top: 16px; + padding: 8px; + background-color: #e9ebf1; + border-radius: 4px; + border: none; + align-items: right; + &:hover { + background-color: #7e3bd0; + color: #fff; + border: none; + cursor: pointer; + } + } + } + } + } +} + +/** + * List Table. + */ +table.wp-list-table { + span.na { + color: #999; + } + + .row-actions { + color: #999; + } + + .column-date { + width: 12%; + } + + .column-entries { + width: 74px; + text-align: center; + } + + .column-actions { + width: 175px; + } + + .column-enabled { + width: 25px; + } + + .column-status img { + height: 12px; + margin-left: 5px; + margin-bottom: -2px; + } + + img.attachment-thumbnail { + height: 40px; + } + + .submitdelete { + &:hover { + color: #a00; + } + } + + .new-entries-notification td { + padding: 0; + text-align: center; + + a { + padding: 10px; + box-shadow: none; + background: lighten(#0095ff, 45%); + } + } +} + +/** + * Entry viewer. + **/ +.everest-forms-entry { + .postbox { + .inside { + padding: 6px 0 0; + + p { + margin: 0; + padding: 6px 10px 8px; + } + } + + .submitdelete { + color: #a00; + padding: 1px 2px; + text-decoration: none; + } + } + + #poststuff { + #everest-forms-entry-fields, + #everest-forms-entry-details, + #everest-forms-entry-actions, + #everest-forms-entry-payment { + h2.hndle { + cursor: inherit; + + .dashicons { + width: 16px; + height: 16px; + font-size: 16px; + margin: 1px 2px 0 4px; + } + } + + .inside { + margin: 0; + padding: 0; + + .everest-forms-edit-entry-field { + .evf-field { + input[type="text"], + input[type="date"], + input[type="date"], + input[type="datetime-local"], + input[type="email"], + input[type="file"], + input[type="image"], + input[type="month"], + input[type="number"], + input[type="password"], + input[type="range"], + input[type="search"], + input[type="tel"], + input[type="time"], + input[type="url"], + input[type="week"], + select, + .StripeElement, + canvas.evf-signature-canvas { + padding: 0 8px; + margin-bottom: 0; + } + + textarea { + width: 100%; + max-width: 100%; + min-width: 100%; + height: 120px; + } + + ul { + li { + margin: 0; + display: block; + + label, + input { + margin: 0; + } + + input[type="radio"], + input[type="checkbox"] { + margin-top: 4px; + margin-right: 8px; + } + } + } + } + + .evf-field-radio ul, + .evf-field-checkbox ul, + .evf-field-payment-radio ul, + .evf-field-payment-checkbox ul { + margin: 0; + + li { + display: flex; + margin-bottom: 5px; + } + } + + label.evf-error { + cursor: default; + color: #900; + margin: 5px 0 0 0; + } + + abbr.required { + color: #fa5252; + font-weight: 700; + border: 0 !important; + text-decoration: none; + vertical-align: middle; + } + } + + .everest-forms-entry-details-meta, + .everest-forms-entry-actions-meta, + .everest-forms-entry-payment-meta { + padding: 6px 0 0; + + p { + margin: 0; + padding: 6px 10px 8px; + } + + .dashicons { + top: 0; + left: -2px; + position: relative; + padding: 0 2px 0 0; + color: $color_gray-light; + text-decoration: none; + } + } + + .everest-forms-entry-actions-meta a { + box-shadow: none; + text-decoration: none; + } + + #major-publishing-actions { + outline: inherit; + + a.button-secondary { + margin-left: 5px; + } + } + } + } + + #evf-entry-nav-buttons { + padding: 5px 10px; + + #evf-next-entry-button { + float: right; + } + } + + #everest-forms-entry-fields { + .inside { + table { + border: none; + + td a:focus { + box-shadow: none; + } + } + + span.list { + display: block; + } + + img.attachment-thumbnail { + height: 150px; + } + } + + .everest-forms-empty-field-toggle { + float: right; + padding: 3px 0 0; + text-decoration: none; + } + } + } +} + +/** + * DB log viewer. + **/ +.wp-list-table.logs { + .log-level { + display: inline; + padding: 0.2em 0.6em 0.3em; + font-size: 80%; + font-weight: bold; + line-height: 1; + color: $color-white; + text-align: center; + white-space: nowrap; + vertical-align: baseline; + border-radius: 0.2em; + + &:empty { + display: none; + } + } + + /** + * Add color to levels + * + * Descending severity: + * emergency, alert -> red + * critical, error -> orange + * warning, notice -> yellow + * info -> blue + * debug -> green + */ + .log-level--emergency, + .log-level--alert { + background-color: #ff4136; + } + .log-level--critical, + .log-level--error { + background-color: #ff851b; + } + .log-level--warning, + .log-level--notice { + color: #222; + background-color: #ffdc00; + } + .log-level--info { + background-color: #0074d9; + } + .log-level--debug { + background-color: #3d9970; + } + + // Adjust log table columns only when table is not collapsed. + @media screen and (min-width: 783px) { + .column-timestamp { + width: 18%; + } + .column-level { + width: 14%; + } + .column-source { + width: 15%; + } + } +} + +#log-viewer-select { + padding: 10px 0 8px; + line-height: 28px; + h2 a { + vertical-align: middle; + } +} + +#log-viewer { + background: $color-white; + border: 1px solid #e5e5e5; + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04); + padding: 5px 20px; + + pre { + font-family: monospace; + white-space: pre-wrap; + word-wrap: break-word; + } +} + +/** + * Tooltips. + **/ +.tips { + cursor: help; + text-decoration: none; +} + +img.tips { + padding: 5px 0 0; +} + +.tooltipster-base { + display: flex; + position: absolute; + pointer-events: none; + + &.tooltipster-ruler { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: hidden; + visibility: hidden; + } + + .tooltipster-box { + border: none; + flex: 1 1 auto; + border-radius: 3px; + background: #333; + margin: 0 !important; + + .tooltipster-content { + color: $color-white; + overflow: auto; + font-size: 0.8em; + max-width: 150px; + max-height: 100%; + text-align: center; + padding: 0.618em 1em; + box-sizing: border-box; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); + + a { + // color: #ff7d20; + color: #967cff; + } + + code { + padding: 1px; + background: #888; + } + } + } + + .tooltipster-arrow { + overflow: hidden; + position: absolute; + + .tooltipster-arrow-uncropped { + position: relative; + + .tooltipster-arrow-border { + top: 0; + left: 0; + width: 0; + height: 0; + position: absolute; + border: 5px solid transparent; + } + + .tooltipster-arrow-background { + display: none; + } + } + } + + &.tooltipster-top, + &.tooltipster-bottom { + .tooltipster-arrow { + width: 10px; + height: 5px; + margin-left: -5px; + } + } + + &.tooltipster-left, + &.tooltipster-right { + .tooltipster-arrow { + top: 0; + width: 5px; + height: 10px; + margin-left: 0; + margin-top: -5px; + } + } + + &.tooltipster-bottom { + .tooltipster-arrow { + top: -5px; + + .tooltipster-arrow-uncropped { + top: -5px; + + .tooltipster-arrow-border { + border-bottom-color: #333; + } + } + } + } + + &.tooltipster-left { + .tooltipster-arrow { + right: -5px; + + .tooltipster-arrow-border { + border-left-color: #333; + } + } + } + + &.tooltipster-right { + .tooltipster-arrow { + left: -5px; + + .tooltipster-arrow-uncropped { + left: -5px; + + .tooltipster-arrow-border { + border-right-color: #333; + } + } + } + } + + &.tooltipster-top { + .tooltipster-arrow { + bottom: -5px; + + .tooltipster-arrow-border { + border-top-color: #333; + } + } + } + + &.tooltipster-fade { + opacity: 0; + transition-property: opacity; + + &.tooltipster-show { + opacity: 1; + } + } + + &.tooltipster-update-rotate { + animation: rotating 600ms; + } +} + +.evf_error_tip { + color: $color-white; + max-width: 20em; + font-size: 0.8em; + line-height: 1.8em; + text-align: center; + border-radius: 3px; + position: absolute; + white-space: normal; + background: #d82223; + margin: 1.5em 1px 0 -1em; + padding: 0.618em 1em; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); + z-index: 9999999; + + code { + padding: 1px; + background: #888; + } + + &::after { + content: ""; + display: block; + border: 8px solid #d82223; + border-right-color: transparent; + border-left-color: transparent; + border-top-color: transparent; + position: absolute; + top: -3px; + left: 50%; + margin: -1em 0 0 -3px; + } +} + +/** + *Date picker. + **/ +img.ui-datepicker-trigger { + vertical-align: middle; + margin-top: -1px; + cursor: pointer; +} + +#ui-datepicker-div { + display: none; +} + +/** + * Blank State. + **/ +.everest-forms-BlankState { + text-align: center; + padding: 5em 0 0; + + .everest-forms-BlankState-icon { + fill: #ddd; + width: 128px; + height: 128px; + margin: 0 0 0.875em; + } + + .everest-forms-BlankState-message { + color: #aaa; + margin: 0 auto 1.5em; + line-height: 1.5em; + font-size: 1.2em; + max-width: 500px; + } + + .everest-forms-BlankState-cta { + font-size: 1.2em; + padding: 0.75em 1.5em; + margin: 0 0.25em; + height: auto; + display: inline-block !important; + } +} + +.evf-pointer { + .evf-pointer-buttons { + .close { + float: left; + margin: 6px 0 0 15px; + } + } +} + +/** + * Select2 elements. + */ +.select2-container { + .select2-selection--multiple { + .select2-selection__rendered { + display: block; + } + + input { + &.select2-search__field { + min-width: 10px; + margin-top: 0 !important; + margin-bottom: 4px !important; + } + } + } + + &.select2-container--focus { + .select2-selection--multiple { + border-color: #5b9dd9; + box-shadow: 0 0 2px rgba(30, 140, 190, 0.8); + outline: 2px solid transparent; + } + } +} + +.select2-drop, +.select2-dropdown { + z-index: 999999 !important; + + .everest-forms-btn { + margin: 8px 4px; + } +} + +.select2-results { + line-height: 1.5em; + + .select2-results__option, + .select2-results__group { + margin: 0; + padding: 8px; + + &:focus { + outline: none; + } + } + + .description { + display: block; + color: #999; + padding-top: 4px; + } +} + +.select2-dropdown { + border-color: #007cba; + + &::after { + position: absolute; + left: 0; + right: 0; + height: 1px; + background: #fff; + content: ""; + } +} + +.select2-dropdown--below { + box-shadow: + 0 0 0 1px #007cba, + 0 2px 1px rgba(0, 0, 0, 0.1); + + &::after { + top: -1px; + } +} + +.select2-dropdown--above { + box-shadow: + 0 0 0 1px #007cba, + 0 -2px 1px rgba(0, 0, 0, 0.1); + + &::after { + bottom: -1px; + } +} +.select2-container--open { + .select2-dropdown--below { + margin-top: -15px; + } +} +.select2-container { + @media only screen and (max-width: 782px) { + font-size: 16px; + } + + &:focus { + outline: none; + } + span.selection { + display: block; + } + .select2-selection__rendered.ui-sortable li { + cursor: move; + } + + .select2-selection { + border-color: #7e8993; + } + + .select2-search__field { + min-width: 150px; + } + + .select2-selection--single { + height: 30px; + border-color: #7e8993; + + @media only screen and (max-width: 782px) { + height: 40px; + } + + &:focus { + outline: none; + } + + .select2-selection__rendered { + line-height: 28px; + padding-right: 24px; + + @media only screen and (max-width: 782px) { + line-height: 38px; + } + + &:hover { + color: #007cba; + } + } + + .select2-selection__arrow { + right: 1px; + height: 28px; + width: 23px; + 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) + no-repeat right 5px top 55%; + background-size: 16px 16px; + + @media only screen and (max-width: 782px) { + height: 38px; + } + + b { + display: none; + } + } + } + + &.select2-container--focus .select2-selection--single, + &.select2-container--open .select2-selection--single, + &.select2-container--open .select2-selection--multiple { + border-color: #007cba; + box-shadow: 0 0 0 1px #007cba; + } + + .selection { + .select2-selection--multiple { + min-height: 36px; + line-height: 1.5; + border-radius: 4px; + border-color: #7e8993; + width: 100%; + + .select2-selection__rendered { + .select2-selection__choice { + background: #ededed; + border-radius: 3px; + gap: 4px; + padding: 6px 10px 6px 8px; + border: 0; + } + } + + li { + margin: 0; + } + + .select2-selection__choice { + padding: 2px 6px; + + .description { + display: none; + } + } + } + } + + .select2-selection__clear { + color: #999; + margin-top: -1px; + z-index: 1; + } + + .select2-search--inline .select2-search__field { + min-height: 28px; + font-family: inherit; + font-size: inherit; + font-weight: inherit; + padding: 0 0 0 3px; + } + + .everest-forms table.form-table .select2-container { + @media only screen and (max-width: 782px) { + min-width: 100% !important; + } + } +} + +/** + * Select2 colors for built-in admin color themes. + */ +.admin-color { + $wp_admin_colors: ( + blue: #096484, + coffee: #c7a589, + ectoplasm: #a3b745, + midnight: #e14d43, + ocean: #9ebaa0, + sunrise: #dd823b, + light: #04a4cc, + ); + + @each $name, $color in $wp_admin_colors { + &-#{$name} { + .select2-dropdown { + border-color: $color; + } + + .select2-dropdown--below { + box-shadow: + 0 0 0 1px $color, + 0 2px 1px rgba(0, 0, 0, 0.1); + } + + .select2-dropdown--above { + box-shadow: + 0 0 0 1px $color, + 0 -2px 1px rgba(0, 0, 0, 0.1); + } + + .select2-selection--single .select2-selection__rendered:hover { + color: $color; + } + + .select2-container.select2-container--focus + .select2-selection--single, + .select2-container.select2-container--open + .select2-selection--single, + .select2-container.select2-container--open + .select2-selection--multiple { + border-color: $color; + box-shadow: 0 0 0 1px $color; + } + + .select2-container--default + .select2-results__option--highlighted[aria-selected], + .select2-container--default + .select2-results__option--highlighted[data-selected] { + background-color: $color; + } + } + } +} + +.everest-forms { + table { + &.form-table { + .select2-container--default { + &.select2-container--focus { + .select2-selection--multiple { + border-color: #5b9dd9; + box-shadow: 0 0 2px rgba(30, 140, 190, 0.8); + outline: 2px solid transparent; + } + } + } + + .select2-container { + min-width: 350px !important; + } + } + } +} + +@media screen and (max-width: 1226px) { + .everest-forms_page_evf-builder { + #everest-forms-builder { + .everest-forms-nav-wrapper { + .evf-forms-nav-right { + width: 269px; + + .evf-shortcode-field { + input { + display: none; + } + + button { + border-radius: 3px; + } + } + } + } + } + } +} + +/** + * Small screen optimisation. + **/ + +/** + * Optimisation for screens 960px and smaller. + **/ +@media only screen and (max-width: 960px) { + .everest-forms_page_evf-builder { + #everest-forms-builder { + .evf-tab-content { + .everest-forms-panel { + .everest-forms-panel-sidebar { + width: 280px; + height: calc(100vh - 122px); + + .evf-registered-buttons { + .evf-registered-item { + width: 46%; + } + } + } + + .everest-forms-panel-sidebar-content { + .everest-forms-panel-content-wrap { + width: calc(100% - 280px); + } + } + } + } + } + } + + .everest-forms { + .everest-forms-integration-content { + .integration-addon-detail { + width: 280px; + } + } + } +} + +@media screen and (max-width: 998px) { + .everest-forms_page_evf-builder { + #everest-forms-builder { + .everest-forms-nav-wrapper { + nav.evf-nav-tab-wrapper { + width: calc(100% - 269px); + } + + .evf-forms-nav-right { + width: 269px; + + .evf-shortcode-field { + input { + display: none; + } + + button { + border-radius: 3px; + } + } + } + } + } + } +} + +/** + * Optimisation for screens 782px and smaller. + **/ +@media screen and (max-width: 782px) { + .everest-forms_page_evf-builder { + .auto-fold { + #wpcontent { + padding-left: 0; + } + } + + .everest-forms { + .everest-forms-overlay { + z-index: 99999; + } + } + + #everest-forms-builder { + width: 100%; + + #everest-forms-builder-form { + width: 100% !important; // Adjust Form builder width + + .evf-tab-content { + .everest-forms-panel-content-wrap { + .everest-forms-panel-content { + height: calc(100vh - 122px); + + &.ps { + height: calc(100vh - 176px); + } + } + + .evf-admin-row { + .evf-admin-grid { + padding: 0; + margin: 0; + } + } + } + + .everest-forms-field-option-row-choices { + ul { + li { + input[type="text"] { + width: calc(100% - 118px); + } + + a { + &.add, + &.remove { + width: 40px; + height: 40px; + } + } + } + } + } + } + } + + .everest-forms-tab-content { + height: calc(100vh - 172px); + } + } + } + + .evf-nav-tab-wrapper { + overflow-x: auto; + } + + .everest-forms_page_evf-settings { + .everest-forms { + .everest-forms-settings { + table { + &.form-table { + th { + padding: 15px 0 15px; + } + } + } + } + } + } + + .everest-forms-builder-setup { + .everest-forms { + #everest-forms-setup-name { + width: auto; + } + + .evf-setup-desc { + a { + width: 200px; + } + } + } + } +} + +/** + * Optimisation for screens 768px. + */ +@media screen and (min-width: 768px) { + .evf-form-col-6 { + flex: 0 0 50%; + max-width: 50%; + } + + .evf-form-col-4 { + flex: 0 0 33.333%; + max-width: 33.333%; + } +} + +/** + * Optimisation for screens 600px and smaller. + */ +@media screen and (max-width: 600px) { + .everest-forms_page_evf-builder, + .everest-forms_page_evf-settings { + .everest-forms { + .evf-nav-tab-wrapper { + a { + &.nav-tab { + margin: 0; + } + } + } + } + } + + .everest-forms-builder-setup { + .everest-forms { + width: 100%; + margin: 20px 0; + + .evf-setup-desc a { + display: block; + margin-bottom: 30px; + text-align: center; + width: 100%; + margin-left: 0; + } + } + } + + .everest-forms_page_evf-builder { + #wpbody-content { + padding-bottom: 0; + } + + #everest-forms-builder { + position: initial; + + #everest-forms-builder-form { + position: relative; + } + + .evf-tab-content { + .everest-forms-panel-content-wrap { + padding: 20px 20px 0; + + .evf-admin-row { + flex-direction: column; + margin: 0 0 20px; + position: relative; + + .evf-admin-grid { + &.evf-grid-1, + &.evf-grid-2, + &.evf-grid-3, + &.evf-grid-4 { + width: auto; + } + } + } + } + } + + .everest-forms-nav-wrapper { + nav.evf-nav-tab-wrapper { + width: calc(100% - 207px); + } + + .evf-forms-nav-right { + width: 207px; + margin-top: 10px; + padding: 9px 17px; + + .evf-shortcode-field { + display: none; + } + } + } + + .evf-tab-content { + .everest-forms-panel { + .everest-forms-panel-sidebar-content { + flex-direction: column; + + .everest-forms-panel-sidebar, + .everest-forms-panel-content-wrap { + width: 100%; + } + + .everest-forms-panel-content-wrap { + padding: 0; + } + } + } + + .evf-choices-list { + li { + input[type="text"] { + width: 84%; + } + } + } + } + } + } + + .everest-forms { + .everest-forms-integration-content { + flex-wrap: wrap; + + .integration-addon-detail { + width: 100%; + margin: 0 20px; + border-bottom: 1px solid #ced4da; + border-right: none; + padding-left: inherit; + } + + .integration-connection-detail { + width: 100%; + } + } + + .everest-forms-integrations-connection { + .everest-forms-integrations { + .integration-header-info { + .integration-detail { + flex-direction: column; + align-items: flex-start; + } + } + + .integration-header-info { + align-items: flex-start; + + .integration-status { + margin-top: 15px; + } + + .integration-detail { + .logo { + margin-bottom: 15px; + } + } + } + } + } + } + + .everest-forms_page_evf-builder { + #everest-forms-builder { + .evf-tab-content { + .everest-forms-panel { + .everest-forms-panel-sidebar { + .evf-registered-buttons { + .evf-registered-item { + width: 48%; + } + } + } + } + } + } + } +} + +@media screen and (max-width: 428px) { + .everest-forms_page_evf-builder { + #everest-forms-builder { + .evf-tab-content { + .everest-forms-panel { + .everest-forms-panel-sidebar { + .evf-registered-buttons { + .evf-registered-item { + width: 46%; + } + } + } + } + } + } + } +} + +/** + * Optimisation for screens 400px and smaller. + */ +@media screen and (max-width: 400px) { + #everest-forms-builder { + .evf-tab-lists li { + a { + padding: 15px; + } + + .dashicons { + font-size: 24px; + } + } + + .evf-tab-content { + .everest-forms-panel { + .everest-forms-panel-sidebar { + .evf-registered-buttons { + .evf-registered-item { + width: 47%; + } + } + } + } + } + } + + .jconfirm.jconfirm-white .jconfirm-box, + .jconfirm.jconfirm-light .jconfirm-box { + width: 90% !important; + } +} +.evf-repeater-fields { + padding: 0 20px 20px; + .everest-forms-field-repeater-fields { + width: calc(100% + 60px) !important; + margin-left: -30px !important; + margin-top: -1px !important; + min-height: 48px; + } + div.evf-admin-grid.evf-repeatable-grid { + padding: 0 10px 10px !important; + } +} + +#elementor-editor-wrapper .everest-icon:before, +.elementor-edit-area .everest-icon:before { + content: "\e902"; + font-family: "EverestForms"; + font-weight: normal; + font-style: normal; + font-display: block; +} + +.everest-forms-field.ui-sortable-helper .evf-field-action { + display: none; +} + +.everest-forms-builder .everest-forms-field.ui-sortable-helper { + padding: 15px 15px 0 15px; + border: 1px solid #cdd0d8; + border-radius: 3px; + + label { + display: block; + font-size: 13px; + font-weight: 600; + margin-bottom: 10px; + + .required { + vertical-align: middle; + padding-left: 6px; + } + } +} + +.everest-forms-builder { + .evf-registered-item.ui-draggable.ui-draggable-handle.ui-draggable-dragging { + font-size: 12px !important; + background-color: #fff; + border: 1px solid #cdd0d8; + color: #6c7680; + + .evf-icon { + padding: 0 8px; + border-radius: 4px; + font-size: 24px; + vertical-align: middle; + } + } +} + +.jconfirm-content-pane { + height: auto !important; + + .evf-shortcut-keyword { + margin-bottom: 18px; + + .evf-shortcut-title { + flex: 3; + } + + li { + display: flex; + align-items: center; + + .evf-key { + display: flex; + flex: 2; + column-gap: 8px; + color: #3498db; + + span { + border: 1px solid #3498db; + background-color: #3498db13; + padding: 4px 0; + width: 40px; + border-radius: 2px; + } + } + } + } +} + +.evf-btn-container { + a { + display: inline-block; + padding: 4px 8px; + border: 1px solid #3498db; + margin-bottom: 8px; + border-radius: 2px; + background-color: #f5fbff; + line-height: 1.8em; + + &:hover { + background-color: #3498db; + color: #fff; + cursor: pointer; + } + } + + .evf-btn-unselect-all { + margin-left: 8px; + } +} + +// Customize Select2 style +.select2-results__option .wrap:before { + content: "\2610"; + width: 25px; + height: 25px; + padding-right: 10px; +} + +.select2-results__option[data-selected="true"] .wrap:before { + content: "\2714"; +} + +.select2-drop, +.select2-dropdown { + z-index: 999999 !important; +} + +.select2-results { + line-height: 1.5em; + + .select2-results__option, + .select2-results__group { + margin: 0; + padding: 8px; + } +} + +.select2-dropdown { + border-color: gray; +} + +.select2-dropdown--below { + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); +} + +.select2-dropdown--above { + box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1); +} + +.select2-container { + .select2-selection__rendered.ui-sortable li { + cursor: move; + } + + .select2-selection { + border-color: gray; + } + + .select2-search__field { + min-width: 20px; + } + + .select2-selection--single { + height: 32px; + + .select2-selection__rendered { + display: block; + line-height: 32px; + padding-right: 24px; + } + + .select2-selection__arrow { + right: 3px; + height: 30px; + } + } + + .select2-selection--multiple { + min-height: 28px; + border-radius: 4px; + line-height: 1.5; + border: 1px solid #ddd !important; + padding-left: 4px; + + li { + margin: 0; + } + + .select2-selection__choice { + padding: 2px 6px; + } + + .select2-selection__rendered { + // display: block; + display: flex; + margin: 0px; + + .select2-selection__choice { + margin: 4px; + line-height: 1.4; + display: flex; + align-items: center; + justify-content: center; + + .select2-selection__choice__remove { + bottom: 0px; + } + } + } + } + + .select2-selection__clear { + color: #999; + margin-top: -1px; + } + + .select2-search--inline { + .select2-search__field { + font-family: inherit; + font-size: inherit; + font-weight: inherit; + padding: 3px 0; + margin: 0; + line-height: 1; + min-height: 26px; + height: 32px; + } + } +} + +.everest-forms-form-template-wrapper { + .everest-forms-form-template { + &[data-filter-template="free"] { + .everest-forms-template-wrap[data-plan="premium"] { + display: none; + } + } + &[data-filter-template="premium"] { + .everest-forms-template-wrap[data-plan="free"] { + display: none; + } + } + } +} + +.everest-forms-panel-field { + &.everest-forms-panel-field-checkbox { + .inline { + padding-left: 0; + } + } +} + +.jconfirm-scrollpane { + .jconfirm-row { + .jconfirm-box { + border-top: 0 !important; + padding: 20px !important; + + div { + &.jconfirm-title-c { + padding-bottom: 6px; + + .jconfirm-title { + line-height: 32px; + + h4 { + margin: 0; + } + } + } + } + + .jconfirm-buttons { + padding: 0 !important; + + button { + &.btn-confirm { + margin: 0; + // background-color: $everestforms; + } + } + } + + .jconfirm-content { + &-pane { + margin-bottom: 6px !important; + } + + .everest_forms_hide_container { + > p { + padding-left: 20px; + padding-right: 20px; + } + + .everest-forms-btn { + background: #8c5aca; + color: $color-white; + font-weight: 500; + transition: all 0.3s ease-in-out; + + &:hover { + background: #a869f6; + } + + &:focus { + box-shadow: none; + } + + &.everest-forms-select-existing-page { + margin-right: 10px; + } + + &.everest-forms-create-new-page { + margin-left: 10px; + } + } + } + + .everest-forms-show-exist-page { + select { + width: 70%; + height: 35px; + padding-left: 10px; + border-color: #d5d5d5; + color: #383838; + + &:focus { + box-shadow: none; + border-color: #8c5aca; + } + } + + .everest-forms-lets-go-btn { + background: #8c5aca; + color: #fff; + font-weight: 500; + border: 1px solid #8c5aca; + padding: 6px 16px; + border-radius: 4px; + vertical-align: middle; + margin-left: 10px; + transition: all 0.3s ease-in-out; + + &:hover { + background: #a869f6; + border-color: #a869f6; + } + } + + .everest-forms-show-container { + display: flex; + align-items: center; + justify-content: center; + gap: 2px; + margin-top: 12px; + font-size: 14px; + text-decoration: underline; + color: #494949; + transition: all 0.3s ease-in-out; + + &:hover { + color: #383838; + } + + &::before { + content: ""; + background-image: url("../images/icons/embed-back-icon.svg"); + background-repeat: no-repeat; + background-position: center; + background-size: 100%; + display: block; + width: 18px; + height: 18px; + margin-top: 2px; + } + } + } + + .everest-forms-select-existing-post-container { + input[type="text"] { + width: 70%; + padding: 3px 12px; + + &:focus { + border-color: #8c5aca; + } + } + } + } + } + } +} + +.select2-container { + box-sizing: border-box; + display: inline-block; + margin: 0; + position: relative; + vertical-align: middle; + width: 350px !important; + + .select2-selection--single { + box-sizing: border-box; + cursor: pointer; + display: block; + height: 28px; + margin: 0 0 -4px; + -ms-user-select: none; + user-select: none; + -webkit-user-select: none; + height: 30px; + border-color: #7e8993; + height: 32px; + + .select2-selection__rendered { + display: block; + padding-left: 8px; + padding-right: 20px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + line-height: 28px; + padding-right: 24px; + display: block; + line-height: 32px; + padding-right: 24px; + + &:hover { + color: #007cba; + } + } + + .select2-selection__clear { + position: relative; + } + + &:focus { + outline: 0; + } + .select2-selection__arrow { + right: 1px; + height: 28px; + width: 23px; + 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) + no-repeat right 5px top 55%; + background-size: 16px 16px; + right: 3px; + height: 30px; + b { + display: none; + } + } + } + + .select2-selection--multiple { + box-sizing: border-box; + cursor: pointer; + display: block; + min-height: 32px; + -ms-user-select: none; + user-select: none; + -webkit-user-select: none; + min-height: 30px; + line-height: 1.5; + border-radius: 4px; + border-color: #7e8993; + min-height: 28px; + border-radius: 4px; + line-height: 1.5; + border: 1px solid #ddd !important; + padding-left: 4px; + + .select2-selection__rendered { + display: inline-block; + overflow: hidden; + padding-left: 8px; + text-overflow: ellipsis; + white-space: nowrap; + display: block; + display: flex; + margin: 0; + + .select2-selection__choice { + margin: 4px; + line-height: 1.4; + display: flex; + align-items: center; + justify-content: center; + + .select2-selection__choice__remove { + bottom: 0; + } + } + } + + input.select2-search__field { + min-width: 10px; + margin-top: 0 !important; + margin-bottom: 4px !important; + } + + li { + margin: 0; + margin: 0; + } + + .select2-selection__choice { + padding: 2px 6px; + padding: 2px 6px; + .description { + display: none; + } + } + } + .select2-search--inline { + float: left; + padding: 0; + .select2-search__field { + box-sizing: border-box; + border: none; + font-size: 100%; + margin: 0; + padding: 0; + min-height: 28px; + font-size: inherit; + font-weight: inherit; + padding: 0 0 0 3px; + font-size: inherit; + font-weight: inherit; + padding: 3px 0; + margin: 0; + line-height: 1; + min-height: 26px; + height: 32px; + + &::-webkit-search-cancel-button { + -webkit-appearance: none; + } + } + } + + &:focus { + outline: 0; + } + + span.selection { + display: block; + } + + .select2-selection__rendered.ui-sortable { + li { + cursor: move; + cursor: move; + } + } + + .select2-selection { + border-color: #7e8993; + border-color: #04a4cc; + } + + .select2-search__field { + min-width: 150px; + min-width: 20px; + } + + .select2-selection__clear { + color: #999; + margin-top: -1px; + z-index: 1; + color: #999; + margin-top: -1px; + } +} + +.select2-container[dir="rtl"] { + .select2-selection--single { + .select2-selection__rendered { + padding-right: 8px; + padding-left: 20px; + } + } +} + +.select2-dropdown { + background-color: #fff; + border: 1px solid #aaa; + border-radius: 4px; + box-sizing: border-box; + display: block; + position: absolute; + left: -100000px; + width: 100%; + z-index: 1051; + z-index: 999999 !important; + border-color: #007cba; + z-index: 999999 !important; + border-color: gray; + + .everest-forms-btn { + margin: 8px 4px; + } + + &::after { + position: absolute; + left: 0; + right: 0; + height: 1px; + background: #fff; + content: ""; + } +} + +.select2-results { + display: block; + line-height: 1.5em; + line-height: 1.5em; + + .select2-results__group { + margin: 0; + padding: 8px; + margin: 0; + padding: 8px; + &:focus { + outline: 0; + } + } + + .select2-results__option { + margin: 0; + padding: 8px; + margin: 0; + padding: 8px; + &:focus { + outline: 0; + } + } + + .description { + display: block; + color: #999; + padding-top: 4px; + } +} + +.select2-results__options { + list-style: none; + margin: 0; + padding: 0; +} + +.select2-results__option { + padding: 6px; + outline: 0; + -ms-user-select: none; + user-select: none; + -webkit-user-select: none; + + .wrap { + &:before { + content: "\2610"; + width: 25px; + height: 25px; + padding-right: 10px; + } + } +} + +.select2-results__option[aria-selected] { + cursor: pointer; +} + +.select2-results__option[data-selected] { + cursor: pointer; +} + +.select2-container--open { + .select2-dropdown { + left: 0; + } + + .select2-dropdown--above { + border-bottom: none; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + } + + .select2-dropdown--below { + border-top: none; + border-top-left-radius: 0; + border-top-right-radius: 0; + margin-top: -15px; + } +} + +.select2-search--dropdown { + display: block; + padding: 4px; + + .select2-search__field { + width: 100%; + box-sizing: border-box; + + &::-webkit-search-cancel-button { + -webkit-appearance: none; + } + } +} + +.select2-search--dropdown.select2-search--hide { + display: none; +} + +.select2-close-mask { + border: 0; + margin: 0; + padding: 0; + display: block; + position: fixed; + left: 0; + top: 0; + min-height: 100%; + min-width: 100%; + height: auto; + width: auto; + opacity: 0; + z-index: 99; + background-color: #fff; +} + +.select2-hidden-accessible { + border: 0 !important; + clip: rect(0 0 0 0) !important; + height: 1px !important; + margin: -1px !important; + overflow: hidden !important; + padding: 0 !important; + position: absolute !important; + width: 1px !important; +} + +.select2-container--default { + .select2-selection--single { + background-color: #fff; + border: 1px solid #aaa; + border-radius: 4px; + + .select2-selection__rendered { + color: #444; + line-height: 28px; + } + + .select2-selection__clear { + cursor: pointer; + float: right; + font-weight: 700; + } + + .select2-selection__placeholder { + color: #999; + } + + .select2-selection__arrow { + height: 26px; + position: absolute; + top: 1px; + right: 1px; + width: 20px; + + b { + border-color: #888 transparent transparent transparent; + border-style: solid; + border-width: 5px 4px 0 4px; + height: 0; + left: 50%; + margin-left: -4px; + margin-top: -2px; + position: absolute; + top: 50%; + width: 0; + } + } + } + + .select2-selection--multiple { + background-color: #fff; + border: 1px solid #aaa; + border-radius: 4px; + cursor: text; + + .select2-selection__rendered { + box-sizing: border-box; + list-style: none; + margin: 0; + padding: 0; + width: 100%; + + li { + list-style: none; + margin: 5px 5px 0 0; + + &::before { + content: ""; + display: none; + } + } + } + + .select2-selection__placeholder { + color: #999; + margin-top: 5px; + float: left; + } + .select2-selection__clear { + cursor: pointer; + float: right; + font-weight: 700; + margin-top: 5px; + margin-right: 10px; + } + .select2-selection__choice { + background-color: #e4e4e4; + border: 1px solid #aaa; + border-radius: 4px; + cursor: default; + float: left; + margin-right: 5px; + margin-top: 5px; + padding: 0 5px; + } + .select2-selection__choice__remove { + color: #999; + cursor: pointer; + display: inline-block; + font-weight: 700; + margin-right: 2px; + &:hover { + color: #333; + } + } + } + .select2-search--dropdown { + .select2-search__field { + border: 1px solid #aaa; + } + } + .select2-search--inline { + .select2-search__field { + background: 0 0; + border: none; + outline: 0; + box-shadow: none; + -webkit-appearance: textfield; + } + } + .select2-results { + > .select2-results__options { + max-height: 200px; + overflow-y: auto; + } + } + .select2-results__option[role="group"] { + padding: 0; + } + .select2-results__option[aria-disabled="true"] { + color: #999; + } + .select2-results__option[aria-selected="true"] { + background-color: #ddd; + } + .select2-results__option[data-selected="true"] { + background-color: #ddd; + } + .select2-results__option { + .select2-results__option { + padding-left: 1em; + .select2-results__group { + padding-left: 0; + } + .select2-results__option { + margin-left: -1em; + padding-left: 2em; + .select2-results__option { + margin-left: -2em; + padding-left: 3em; + .select2-results__option { + margin-left: -3em; + padding-left: 4em; + .select2-results__option { + margin-left: -4em; + padding-left: 5em; + .select2-results__option { + margin-left: -5em; + padding-left: 6em; + } + } + } + } + } + } + } + .select2-results__option--highlighted[aria-selected] { + color: #fff; + background-color: #0073aa; + } + .select2-results__option--highlighted[data-selected] { + color: #fff; + background-color: #0073aa; + } + .select2-results__group { + cursor: default; + display: block; + padding: 6px; + } +} +.select2-container--default[dir="rtl"] { + .select2-selection--single { + .select2-selection__clear { + float: left; + } + .select2-selection__arrow { + left: 1px; + right: auto; + } + } + .select2-selection--multiple { + .select2-search--inline { + float: right; + } + .select2-selection__choice { + float: right; + margin-left: 5px; + margin-right: auto; + } + .select2-selection__placeholder { + float: right; + } + .select2-selection__choice__remove { + margin-left: 2px; + margin-right: auto; + } + } +} +.select2-container--default.select2-container--disabled { + .select2-selection--single { + background-color: #eee; + cursor: default; + .select2-selection__clear { + display: none; + } + } + .select2-selection--multiple { + background-color: #eee; + cursor: default; + } + .select2-selection__choice__remove { + display: none; + } +} +.select2-container--default.select2-container--open { + .select2-selection--single { + .select2-selection__arrow { + b { + border-color: transparent transparent #888 transparent; + border-width: 0 4px 5px 4px; + } + } + } +} +.select2-container--default.select2-container--focus { + .select2-selection--multiple { + border: solid #000 1px; + outline: 0; + } +} +.select2-container--default.select2-container--open.select2-container--above { + .select2-selection--multiple { + border-top-left-radius: 0; + border-top-right-radius: 0; + } + .select2-selection--single { + border-top-left-radius: 0; + border-top-right-radius: 0; + } +} +.select2-container--default.select2-container--open.select2-container--below { + .select2-selection--multiple { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + } + .select2-selection--single { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + } +} +.select2-container--classic { + .select2-selection--single { + background-color: #f7f7f7; + border: 1px solid #aaa; + border-radius: 4px; + outline: 0; + background-image: linear-gradient(to bottom, #fff 50%, #eee 100%); + background-repeat: repeat-x; + &:focus { + border: 1px solid #0073aa; + } + .select2-selection__rendered { + color: #444; + line-height: 28px; + } + .select2-selection__clear { + cursor: pointer; + float: right; + font-weight: 700; + margin-right: 10px; + } + .select2-selection__placeholder { + color: #999; + } + .select2-selection__arrow { + background-color: #ddd; + border: none; + border-left: 1px solid #aaa; + border-top-right-radius: 4px; + border-bottom-right-radius: 4px; + height: 26px; + position: absolute; + top: 1px; + right: 1px; + width: 20px; + background-image: linear-gradient(to bottom, #eee 50%, #ccc 100%); + background-repeat: repeat-x; + b { + border-color: #888 transparent transparent transparent; + border-style: solid; + border-width: 5px 4px 0 4px; + height: 0; + left: 50%; + margin-left: -4px; + margin-top: -2px; + position: absolute; + top: 50%; + width: 0; + } + } + } + .select2-selection--multiple { + background-color: #fff; + border: 1px solid #aaa; + border-radius: 4px; + cursor: text; + outline: 0; + &:focus { + border: 1px solid #0073aa; + } + .select2-selection__rendered { + list-style: none; + margin: 0; + padding: 0 5px; + } + .select2-selection__clear { + display: none; + } + .select2-selection__choice { + background-color: #e4e4e4; + border: 1px solid #aaa; + border-radius: 4px; + cursor: default; + float: left; + margin-right: 5px; + margin-top: 5px; + padding: 0 5px; + } + .select2-selection__choice__remove { + color: #888; + cursor: pointer; + display: inline-block; + font-weight: 700; + margin-right: 2px; + &:hover { + color: #555; + } + } + } + .select2-search--dropdown { + .select2-search__field { + border: 1px solid #aaa; + outline: 0; + } + } + .select2-search--inline { + .select2-search__field { + outline: 0; + box-shadow: none; + } + } + .select2-dropdown { + background-color: #fff; + border: 1px solid transparent; + } + .select2-dropdown--above { + border-bottom: none; + } + .select2-dropdown--below { + border-top: none; + } + .select2-results { + > .select2-results__options { + max-height: 200px; + overflow-y: auto; + } + } + .select2-results__option[role="group"] { + padding: 0; + } + .select2-results__option[aria-disabled="true"] { + color: grey; + } + .select2-results__option--highlighted[aria-selected] { + background-color: #3875d7; + color: #fff; + } + .select2-results__option--highlighted[data-selected] { + background-color: #3875d7; + color: #fff; + } + .select2-results__group { + cursor: default; + display: block; + padding: 6px; + } +} +.select2-container--classic[dir="rtl"] { + .select2-selection--single { + .select2-selection__clear { + float: left; + } + .select2-selection__arrow { + border: none; + border-right: 1px solid #aaa; + border-radius: 0; + border-top-left-radius: 4px; + border-bottom-left-radius: 4px; + left: 1px; + right: auto; + } + } + .select2-selection--multiple { + .select2-selection__choice { + float: right; + margin-left: 5px; + margin-right: auto; + } + .select2-selection__choice__remove { + margin-left: 2px; + margin-right: auto; + } + } +} +.select2-container--classic.select2-container--open { + .select2-selection--single { + border: 1px solid #0073aa; + .select2-selection__arrow { + background: 0 0; + border: none; + b { + border-color: transparent transparent #888 transparent; + border-width: 0 4px 5px 4px; + } + } + } + .select2-selection--multiple { + border: 1px solid #0073aa; + } + .select2-dropdown { + border-color: #0073aa; + } +} +.select2-container--classic.select2-container--open.select2-container--above { + .select2-selection--single { + border-top: none; + border-top-left-radius: 0; + border-top-right-radius: 0; + background-image: linear-gradient(to bottom, #fff 0, #eee 50%); + background-repeat: repeat-x; + } + .select2-selection--multiple { + border-top: none; + border-top-left-radius: 0; + border-top-right-radius: 0; + } +} +.select2-container--classic.select2-container--open.select2-container--below { + .select2-selection--single { + border-bottom: none; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + background-image: linear-gradient(to bottom, #eee 50%, #fff 100%); + background-repeat: repeat-x; + } + .select2-selection--multiple { + border-bottom: none; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + } +} +.evf-akismet { + .evf-akismet-warning { + .evf-akismet-warning-label { + color: #ffcc00; + } + } +} + +// Everest Forms system info settings. +.everest-forms { + position: relative; +} + +.everest-forms-system-info-setting { + margin-top: 40px; + + &-copy { + position: absolute; + top: 18px; + right: 24px; + padding: 8px 16px; + border-radius: 4px; + border: 0; + font-size: 14px; + line-height: 22px; + font-weight: 500; + cursor: pointer; + } + + table { + width: 100%; + border-collapse: collapse; + + th, + td { + padding: 10px; + border: 1px solid #ddd; + text-align: left; + font-size: 14px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + + th { + background: #f2f2f2; + font-weight: 600; + } + + tr { + &:nth-child(even) { + background: #f9f9f9; + } + + &:hover { + background: #f2f2f2; + } + + th { + &[colspan="2"] { + background: #8c3eeb; + color: #fff; + font-size: 15px; + line-height: 23px; + font-weight: 500; + letter-spacing: 0.2px; + } + } + } + } +} +// Image upload button delete icon +.everest-forms-panel-field-image { + .everest-forms-custom-image-container { + .everest-forms-custom-image-delete { + display: inline-flex; + position: relative; + + i { + display: none; + } + + &:hover { + &::before { + content: ""; + background: #000; + position: absolute; + width: 100%; + height: 100%; + opacity: 0.6; + } + + i { + position: absolute; + display: contents; + + &:hover { + &::before, + &::after { + transform: translate(-50%, -50%) scale(1.1); + } + } + + &::before { + content: ""; + background: #d52626; + width: 42px; + height: 42px; + position: absolute; + border-radius: 50%; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + + &::after { + content: "\e906"; + position: absolute; + font-size: 22px; + color: #fff; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + } + } + } + } +} +#everest-forms-builder { + .everest-forms-options { + padding-left: 20px; + } + + .evf-tab-content { + .evf-quiz-section { + .enable-quiz-head { + background: #f8f9fa; + margin-left: -20px; + margin-top: -20px; + margin-right: -20px; + padding: 20px 20px 0; + border-bottom: 1px solid #e0e3e6; + + label { + font-size: 14px; + } + } + + .evf-quiz-reporting { + .everest-forms-panel-field-radio { + .row { + display: flex; + align-items: center; + margin-bottom: 10px; + + input { + margin: 0 4px 0 0; + } + + label { + margin-bottom: 0; + } + } + } + } + + .evf-quiz-settings { + padding-left: 20px; + + .everest-forms-overall-feedback { + max-width: 800px; + border: 1px solid transparent; + + &.feedback-enabled { + margin-top: 5px; + margin-left: -20px; + margin-bottom: 20px; + padding: 0 20px 20px; + border-radius: 4px; + border: 1px solid $color_gray-lighten; + } + + > div > label { + padding: 0 10px; + margin: 0 0 10px -10px; + background: $color-white; + display: inline-block; + transform: translateY(-50%); + } + + .everest-forms-panel-field { + margin-bottom: 0; + } + + .everest-forms-options { + padding-left: 0; + } + + .overall-feedback-option { + .evf-form-group { + padding: 20px; + position: relative; + margin-bottom: 20px; + border-radius: 4px; + border: 1px solid $color_gray-lighten; + background-color: adjust-color( + $color_gray-light-skin, + $saturation: +1%, + $lightness: +1% + ); + + input { + &.score_from { + pointer-events: none; + background-color: $color_gray-light-skin; + } + } + + .evf-disabled { + cursor: not-allowed; + + input { + pointer-events: none; + background-color: $color_gray-light-skin; + } + } + + .feedback-label-group { + flex: 1; + display: flex; + margin-bottom: 15px; + + .feedback-input-group { + flex: 1; + margin-right: 15px; + + label { + margin-bottom: 6px; + } + + .feedback-input-value { + display: flex; + align-items: center; + position: relative; + + input { + padding-right: 30px; + } + + span { + width: 30px; + height: 30px; + display: flex; + align-items: center; + justify-content: center; + position: absolute; + right: 0; + background: $color_gray-more-lighten; + border: 1px solid + $color-gray-lighten; + border-radius: 0 4px 4px 0; + } + } + + &:last-child { + margin-right: 0; + } + } + } + + .remove_feedback { + cursor: pointer; + position: absolute; + top: 3px; + right: 3px; + color: $color_gray-base; + + &:hover { + color: $red; + } + } + } + + .add_feedback { + display: block; + text-align: right; + margin-left: auto; + } + } + } + } + } + + // Likert-table and Scale rating table + table { + &.everest-forms-likert-table, + &.everest-froms-likert-field-preview, + &.everest-forms-scale-rating-table { + input { + display: none; + } + + label { + margin-bottom: 0; + } + } + + // Likert-table + &.everest-forms-likert-table, + &.everest-froms-likert-field-preview { + background: $color-white; + width: 100%; + overflow: hidden; + margin-bottom: 5px; + border: 1px solid $color_gray-lighten; + + input, + select { + border-color: $color_gray-lighten; + } + + label { + &::before { + height: 16px; + width: 16px; + content: ""; + border: 1px solid $color_gray-lighten; + display: block; + margin: 0 auto; + } + } + + input[type="radio"] { + + label { + &::before { + border-radius: 50%; + } + } + } + + select { + height: 20px; + width: 70px; + opacity: 0.6; + font-size: 12px; + } + + th, + td { + padding: 10px; + height: 42px; + word-break: break-word; + } + + th { + font-size: 12px; + font-weight: 400; + text-align: center; + } + + thead { + th { + background: $color_gray-light-skin; + border-bottom: 1px solid $color_gray-lighten; + } + } + + tbody { + tr { + text-align: left; + + th { + text-align: left; + } + + td { + text-align: center; + + &:last-child { + border-right: none; + } + } + + &:nth-child(even) { + th, + td { + background: $color_gray-light-skin; + } + } + } + } + } + + // Scale rating table + &.everest-forms-scale-rating-table { + width: 100%; + table-layout: fixed; + + thead { + tr { + th { + font-size: 12px; + font-weight: 400; + padding-bottom: 10px; + + .lowest-rating { + float: left; + } + + .highest-rating { + float: right; + } + } + } + } + + tbody { + tr { + td { + border: 1px solid $color_gray-lighten; + height: 40px; + border-right: none; + background: $color_gray-light-skin; + text-align: center; + + &:last-child { + border-right: 1px solid $color_gray-lighten; + } + } + } + } + } + } + } +} + +.evf-survey-choices { + &[data-choice-type="drop_down_choices"] { + input[type="text"] { + width: 74%; + } + } +} + +// Quiz +.evf-correct-answers { + li { + margin-bottom: 10px; + } +} + +/** + * Analytic Table Dashboard + */ +.evf-survey-loader { + display: block; + padding: 70px; + background: $color-white; + box-shadow: 0 1px 5px rgba(51, 56, 64, 0.1); + + .evf-loading.evf-loading-active { + margin: 0 auto; + float: none; + display: block; + } +} + +.everest-forms-single-survey-container { + border-top: 1px solid $color_gray-lighten; + margin: 20px 0; + + .everest-forms-survey-block { + margin-right: 0; + margin-top: 25px; + } + + .survey-block-chart-content { + .survey-block-chart-overview { + max-height: 329px; + } + } + + .everest-forms-survey-summary { + max-height: 455px; + overflow-x: hidden; + overflow-y: auto; + } +} + +.full-survey-entries-header { + padding: 20px 0; + margin-bottom: 35px; + border-bottom: 1px solid $color_gray-lighten; + + select { + height: 36px; + padding: 0 10px; + font-size: 16px; + font-weight: 600; + border-radius: 3px; + } + + .everest-forms-btn { + vertical-align: middle; + } +} + +.everest-forms-survey-block { + padding: 20px; + background: $color-white; + margin-right: 20px; + margin-bottom: 30px; + border-radius: 8px; + box-shadow: 0 1px 5px rgba(51, 56, 64, 0.1); + position: relative; + + .everest-forms-survey-header { + margin-top: 0; + + .everest-forms-survey-selection { + label { + top: -35px; + position: absolute; + padding: 5px 10px; + border-radius: 3px; + background: $color-white; + box-shadow: 0 2px 2px rgba(159, 175, 199, 0.6); + } + } + } + + &.evf-empty-data { + display: flex; + align-items: center; + + .evf-icon-circle { + padding: 20px; + background: transparentize($color_gray-lighten, 0.75); + display: inline-flex; + border-radius: 50%; + margin-right: 20px; + + svg { + height: 64px; + width: 64px; + fill: $color_gray-base; + } + } + } +} + +.everest-forms-survey-header { + display: flex; + align-items: center; + justify-content: space-between; + margin: 35px 0 20px; + + .everest-forms-survey-selection { + display: flex; + align-items: center; + position: relative; + + .form-header-name { + margin-right: 15px; + } + + .survey-type-select { + position: relative; + margin-right: 15px; + + label { + left: 0; + right: 0; + top: -22px; + position: absolute; + text-align: center; + font-style: italic; + } + + select { + &.survey-type { + margin: 0; + height: 36px; + padding: 0 5px; + font-size: 14px; + min-width: 170px; + border-radius: 3px; + font-weight: normal; + } + } + } + + .evf-analytic-button { + margin-left: 15px; + } + + .survey-type { + margin: 10px 0 0; + font-size: 16px; + box-shadow: none; + font-weight: 600; + } + } + + .evf-analytic-action-nav { + ul { + margin: 0; + display: flex; + + li { + margin-bottom: 0; + margin-right: 15px; + + &:last-child { + margin-right: 0; + } + } + } + } +} + +.box-wrap { + background: $color-white; + display: flex; + justify-content: space-between; + border: 1px solid $color_gray-lighten; + border-radius: 8px; +} + +.survey-block-average-overview { + display: flex; + flex-wrap: wrap; + + .box-wrap { + flex: 1; + align-items: center; + margin: 0 10px 20px; + + &:first-child { + margin-left: 0; + } + + &:last-child { + margin-right: 0; + } + } + + .response-detail { + color: $color_gray-light; + display: flex; + flex-direction: column; + font-size: 16px; + padding: 20px; + + strong { + font-size: 36px; + line-height: 1; + margin-bottom: 5px; + color: $color_gray-dark; + } + } + + .icon-thumbnail { + padding: 20px; + display: flex; + border-left: 1px solid $color_gray-lighten; + + svg { + height: 48px; + width: 48px; + fill: $everestforms; + border-radius: 4px; + background: transparentize($everestforms, 0.85); + padding: 10px; + } + } +} + +.survey-block-chart-content { + width: 60%; + padding: 0 20px; + border-right: 1px solid $color_gray-lighten; + + .chart-tab-action { + padding: 15px 0; + text-align: right; + border-bottom: 1px solid $color_gray-lighten; + + button { + width: 35px; + height: 35px; + border: none; + line-height: 1; + cursor: pointer; + margin-left: 10px; + border-radius: 4px; + background: $color_gray-more-lighten; + transition: all 0.25s ease 0s; + + &.current-tab-active, + &:hover { + color: $color-white; + background: $everestforms; + + svg { + fill: $color-white; + } + } + + svg { + width: 20px; + height: 20px; + fill: $color_gray-normal; + transition: all 0.25s ease 0s; + } + } + } + + .survey-block-chart-overview { + height: 370px; + padding: 50px 0; + background: $color-white; + } +} + +.everest-forms-survey-summary { + flex: 1; + padding: 20px; + overflow: auto; + + table { + width: 100%; + border-spacing: 0; + border-radius: 4px; + border: 1px solid $color_gray-lighten; + + th, + td { + padding: 10px; + } + + thead { + th { + background: $color_gray-light-skin; + border-bottom: 1px solid $color_gray-lighten; + + &:first-child { + text-align: left; + border-radius: 4px 0 0 0; + } + + &:last-child { + text-align: right; + border-radius: 0 4px 0 0; + } + } + } + + tbody { + tr { + &:nth-child(even) { + th, + td { + background: $color_gray-light-skin; + } + } + + td { + &:last-child { + text-align: right; + } + } + } + } + + &.evf-likert-chart-table { + th, + td { + text-align: center; + } + + thead { + th { + &:last-child { + text-align: center; + } + } + } + + tbody { + tr { + td { + &:last-child { + text-align: center; + } + } + } + } + } + } + + .summary-chart-wrapper { + width: 100%; + border-spacing: 0; + border-radius: 4px; + border: 1px solid $color_gray-lighten; + + .summary-chart-header { + background: $color_gray-light-skin; + border-bottom: 1px solid $color_gray-lighten; + border-radius: 4px 4px 0 0; + margin: 0; + padding: 15px 10px; + font-size: 14px; + } + + .summary-chart-body { + display: flex; + flex-wrap: wrap; + + .survey-chart-row { + flex: 1; + padding: 15px 5px; + position: relative; + text-align: center; + + &:first-child { + flex: 100%; + border-bottom: 1px solid $color_gray-lighten; + padding: 30px; + + .survey-chart-column { + &:last-child { + font-size: 22px; + color: $everestforms; + margin-top: 10px; + } + } + } + + svg { + width: 200px !important; + margin: 0 auto; + } + + .progressbar-text { + font-size: 28px; + font-weight: 600; + position: absolute; + } + + .survey-chart-column { + margin: 5px 0; + font-size: 14px; + font-weight: 600; + } + } + } + } + + /** + * Star Rating Table + **/ + .approx-rating-result { + padding: 20px; + margin: 10px 0; + + .approx-rating-label { + font-size: 48px; + line-height: 1; + margin-bottom: 10px; + } + + .total-reviews { + font-size: 16px; + font-weight: 600; + color: $color_gray-base; + } + } + + .summary-chart-rating { + margin: 0 20px; + padding: 20px 0; + border-top: 1px solid $color_gray-lighten; + + .survey-chart-row { + margin-bottom: 15px; + + .survey-chart-column { + display: flex; + justify-content: space-between; + + &:first-child { + margin-bottom: 5px; + } + + .rating-progress { + flex: 1; + height: 5px; + display: flex; + overflow: hidden; + background-color: $color_gray-lighten; + border-radius: 3px; + + .progress-bar { + display: flex; + flex-direction: column; + justify-content: center; + color: $color-white; + text-align: center; + white-space: nowrap; + background-color: $everestforms; + transition: width 0.6s ease; + } + } + } + } + } + + &::-webkit-scrollbar { + width: 8px; + } + + &::-webkit-scrollbar-track { + background: $color_gray-more-lighten; + } + + &::-webkit-scrollbar-thumb { + background: transparentize($color_gray-normal, 0.5); + border-radius: 4px; + } + + &::-webkit-scrollbar-thumb:hover { + background: transparentize($color_gray-normal, 0.25); + } +} + +/** + * quiz entry + */ +#everest-forms-entry-fields:not(.postbox) { + .correct_answer { + background-color: rgba(0, 255, 43, 0.1); + padding: 7px; + } + + .wrong_answer { + background-color: rgba(255, 0, 0, 0.1); + padding: 7px; + } + + table { + tbody { + th { + display: flex; + justify-content: space-between; + } + + tr { + td { + span { + margin-bottom: 7px; + + &:last-child { + margin-bottom: 0; + } + } + } + } + } + } +} + +/** + * Yes/No field. + */ +.everest-forms-field { + .yes-no-preview { + display: flex; + column-gap: 24px; + + &.text-only { + input { + text-align: center; + width: 80px; + padding: 8px 0; + border: none; + outline: 1px solid; + + &:nth-child(1) { + outline-color: #008000; + background-color: #eeffee; + } + + &:nth-child(2) { + outline-color: #fa5252; + background-color: #fff1f1; + } + } + } + + &.icon-text { + .yes-no-icon { + display: inline-flex; + column-gap: 16px; + align-items: center; + } + } + } +} + +//General settings +.everest-forms-settings { + display: flex; + background: #f1f1f1; + min-height: 100vh; + + .everest-forms-settings-container { + flex: 1; + padding: 20px; + background: #ffffff; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); + + .everest-forms-options-header { + &--top { + h3 { + font-size: 24px; + margin-bottom: 10px; + } + } + } + + .everest-forms-card { + background-color: #f1f1f1; + border-radius: 5px; + padding: 20px; + margin-bottom: 20px; + + .everest-forms-global-settings { + display: flex; + align-items: center; + margin-bottom: 10px; + + label { + flex: 1; + font-weight: bold; + } + + &--field { + flex: 2; + } + .evf-restapi-key { + width: 530px !important; + } + } + } + + .submit { + text-align: right; + + .everest-forms-btn { + padding: 10px 20px; + font-size: 16px; + border-radius: 5px; + cursor: pointer; + background-color: #6c63ff; + color: #fff; + border: none; + + &:hover { + background-color: #5b52e6; + } + } + } + } +} + +// Everest Forms Global Settings Design ReVamp CSS +#wpcontent { + #wpbody-content { + padding-bottom: 25px; + } +} + +.everest-forms_page_evf-settings { + .everest-forms { + padding: 20px; + overflow: hidden; + } +} +.everest-forms { + .everest-forms-settings { + padding: 0 !important; + gap: 24px; + background: transparent; + + &-wrapper { + box-shadow: 0px 6px 26px 0px rgba(10, 10, 10, 0.08); + background: #ffffff; + flex: 1; + display: flex; + } + + &-main { + &:has(#message) { + .everest-forms-toggle-wrapper { + top: 76px; + } + } + } + + .everest-forms-settings-container { + #message { + border: 1px solid #e6e6e6; + border-left-width: 4px; + border-left-color: #00a32a; + box-shadow: unset; + margin-top: 0; + margin-bottom: 20px; + } + } + + .everest-forms-header { + display: flex; + flex-direction: column; + background: #fafafc; + border-right: 1px solid #ededed; + padding: 32px 0 20px; + width: 300px; + max-width: 100%; + transition: all 0.3s; + + &--top { + text-align: center; + padding-bottom: 30px; + border-bottom: 1px solid #ededed; + + &-logo { + img { + max-height: 70px; + } + } + } + + &--nav { + height: 100%; + + .evf-nav-tab-wrapper { + display: flex; + flex-direction: column; + gap: 1px; + background: transparent; + position: relative; + height: 100%; + overflow: unset !important; + + .evf-nav__link { + width: 100%; + display: flex; + padding: 16px 20px; + align-items: center; + gap: 16px; + border-bottom: 1px solid #ededed; + position: relative; + transition: all 0.3s ease-in-out; + + &::before { + content: ""; + background: #7545bb; + width: 4px; + height: 100%; + position: absolute; + top: 0; + left: 0; + opacity: 0; + transition: all 0.3s ease-in-out; + } + + &::after { + content: ""; + background: #fff; + width: 8px; + height: 100%; + position: absolute; + top: 0; + right: -4px; + opacity: 0; + transition: all 0.3s ease-in-out; + } + + &-icon { + display: flex; + align-items: center; + justify-content: center; + + svg { + width: 20px; + height: 20px; + + path { + fill: #4e4e4e; + transition: all 0.3s ease-in-out; + } + } + } + + &-label { + display: flex; + align-items: center; + width: 100%; + + > p { + width: 100%; + margin: 0; + font-size: 15px; + font-weight: 500; + line-height: 21px; + color: #4e4e4e; + transition: all 0.3s ease-in-out; + } + + svg { + width: 20px; + height: 20px; + } + } + + &:hover, + &.nav-tab-active { + background: #ffffff; + + &::before { + opacity: 1; + } + + .evf-nav__link { + &-icon { + svg { + path { + fill: #7545bb; + } + } + } + + &-label { + > p { + color: #7545bb; + } + + svg { + path { + stroke: #7545bb; + } + } + } + } + } + + &.nav-tab-active { + background: #ffffff; + + &::before, + &::after { + opacity: 1; + } + } + } + + #evf-settings-collapse { + margin: 0; + padding: 16px 20px; + background: transparent; + border: 1px solid transparent; + cursor: pointer; + transition: all 0.3s ease-in-out; + + &::before, + &::after { + content: none; + } + + .evf-nav__link-label { + line-height: 21px; + } + + .evf-nav-icon { + display: flex; + align-items: center; + justify-content: center; + + img { + width: 20px; + height: 20px; + transition: all 0.3s ease-in-out; + } + } + + &:hover { + background: #7545bb; + color: #ffffff; + + .evf-nav-icon { + img { + filter: brightness(0) saturate(100%) + invert(100%) sepia(0%) saturate(7487%) + hue-rotate(137deg) brightness(89%) + contrast(114%); + } + } + } + } + + .ps__rail { + &-x { + display: none; + } + } + } + } + + &.collapsed { + width: 60px; + + .everest-forms-header--top { + &-logo { + img { + margin-left: 16px; + max-height: 50px; + } + } + } + + .everest-forms-header--nav { + .evf-nav-tab-wrapper { + .evf-nav__link { + &-label { + opacity: 0; + } + } + #evf-settings-collapse { + .evf-nav-icon { + img { + transform: rotate(180deg); + } + } + } + } + } + } + } - #ui-datepicker-div { - display: none; - } + .everest-forms-settings-container { + padding: 32px 20px 52px 32px; + box-shadow: none; - /** - * Blank State. - **/ - .everest-forms-BlankState { - text-align: center; - padding: 5em 0 0; - - .everest-forms-BlankState-icon { - fill: #ddd; - width: 128px; - height: 128px; - margin: 0 0 0.875em; - } - - .everest-forms-BlankState-message { - color: #aaa; - margin: 0 auto 1.5em; - line-height: 1.5em; - font-size: 1.2em; - max-width: 500px; - } - - .everest-forms-BlankState-cta { - font-size: 1.2em; - padding: 0.75em 1.5em; - margin: 0 0.25em; - height: auto; - display: inline-block !important; - } - } - - .evf-pointer { - .evf-pointer-buttons { - .close { - float: left; - margin: 6px 0 0 15px; - } - } - } - - /** - * Select2 elements. - */ - .select2-container { - .select2-selection--multiple { - .select2-selection__rendered { - display: block; - } - - input { - &.select2-search__field { - min-width: 10px; - margin-top: 0 !important; - margin-bottom: 4px !important; - } - } - } - - &.select2-container--focus { - .select2-selection--multiple { - border-color: #5b9dd9; - box-shadow: 0 0 2px rgba(30, 140, 190, 0.8); - outline: 2px solid transparent; - } - } - } - - .select2-drop, - .select2-dropdown { - z-index: 999999 !important; - - .everest-forms-btn { - margin: 8px 4px; - } - } - - .select2-results { - line-height: 1.5em; - - .select2-results__option, - .select2-results__group { - margin: 0; - padding: 8px; - - &:focus { - outline: none; - } - } - - .description { - display: block; - color: #999; - padding-top: 4px; - } - } - - .select2-dropdown { - border-color: #007cba; - - &::after { - position: absolute; - left: 0; - right: 0; - height: 1px; - background: #fff; - content: ""; - } - } - - .select2-dropdown--below { - box-shadow: - 0 0 0 1px #007cba, - 0 2px 1px rgba(0, 0, 0, 0.1); - - &::after { - top: -1px; - } - } - - .select2-dropdown--above { - box-shadow: - 0 0 0 1px #007cba, - 0 -2px 1px rgba(0, 0, 0, 0.1); - - &::after { - bottom: -1px; - } - } - .select2-container--open { - .select2-dropdown--below { - margin-top: -15px; - } - } - .select2-container { - @media only screen and (max-width: 782px) { - font-size: 16px; - } - - &:focus { - outline: none; - } - span.selection { - display: block; - } - .select2-selection__rendered.ui-sortable li { - cursor: move; - } - - .select2-selection { - border-color: #7e8993; - } - - .select2-search__field { - min-width: 150px; - } - - .select2-selection--single { - height: 30px; - border-color: #7e8993; - - @media only screen and (max-width: 782px) { - height: 40px; - } - - &:focus { - outline: none; - } - - .select2-selection__rendered { - line-height: 28px; - padding-right: 24px; - - @media only screen and (max-width: 782px) { - line-height: 38px; - } - - &:hover { - color: #007cba; - } - } - - .select2-selection__arrow { - right: 1px; - height: 28px; - width: 23px; - 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) - no-repeat right 5px top 55%; - background-size: 16px 16px; - - @media only screen and (max-width: 782px) { - height: 38px; - } - - b { - display: none; - } - } - } - - &.select2-container--focus .select2-selection--single, - &.select2-container--open .select2-selection--single, - &.select2-container--open .select2-selection--multiple { - border-color: #007cba; - box-shadow: 0 0 0 1px #007cba; - } - - .selection { - .select2-selection--multiple { - min-height: 36px; - line-height: 1.5; - border-radius: 4px; - border-color: #7e8993; - width: 100%; - - .select2-selection__rendered { - .select2-selection__choice { - background: #ededed; - border-radius: 3px; - gap: 4px; - padding: 6px 10px 6px 8px; - border: 0; - } - } - - li { - margin: 0; - } - - .select2-selection__choice { - padding: 2px 6px; - - .description { - display: none; - } - } - } - } - - .select2-selection__clear { - color: #999; - margin-top: -1px; - z-index: 1; - } - - .select2-search--inline .select2-search__field { - min-height: 28px; - font-family: inherit; - font-size: inherit; - font-weight: inherit; - padding: 0 0 0 3px; - } - - .everest-forms table.form-table .select2-container { - @media only screen and (max-width: 782px) { - min-width: 100% !important; - } - } - } - - /** - * Select2 colors for built-in admin color themes. - */ - .admin-color { - $wp_admin_colors: ( - blue: #096484, - coffee: #c7a589, - ectoplasm: #a3b745, - midnight: #e14d43, - ocean: #9ebaa0, - sunrise: #dd823b, - light: #04a4cc, - ); - - @each $name, $color in $wp_admin_colors { - &-#{$name} { - .select2-dropdown { - border-color: $color; - } - - .select2-dropdown--below { - box-shadow: - 0 0 0 1px $color, - 0 2px 1px rgba(0, 0, 0, 0.1); - } - - .select2-dropdown--above { - box-shadow: - 0 0 0 1px $color, - 0 -2px 1px rgba(0, 0, 0, 0.1); - } - - .select2-selection--single .select2-selection__rendered:hover { - color: $color; - } - - .select2-container.select2-container--focus - .select2-selection--single, - .select2-container.select2-container--open - .select2-selection--single, - .select2-container.select2-container--open - .select2-selection--multiple { - border-color: $color; - box-shadow: 0 0 0 1px $color; - } - - .select2-container--default - .select2-results__option--highlighted[aria-selected], - .select2-container--default - .select2-results__option--highlighted[data-selected] { - background-color: $color; - } - } - } - } - - .everest-forms { - table { - &.form-table { - .select2-container--default { - &.select2-container--focus { - .select2-selection--multiple { - border-color: #5b9dd9; - box-shadow: 0 0 2px rgba(30, 140, 190, 0.8); - outline: 2px solid transparent; - } - } - } - - .select2-container { - min-width: 350px !important; - } - } - } - } - - @media screen and (max-width: 1226px) { - .everest-forms_page_evf-builder { - #everest-forms-builder { - .everest-forms-nav-wrapper { - .evf-forms-nav-right { - width: 269px; - - .evf-shortcode-field { - input { - display: none; - } - - button { - border-radius: 3px; - } - } - } - } - } - } - } - - /** - * Small screen optimisation. - **/ + .everest-forms-settings-main { + position: relative; - /** - * Optimisation for screens 960px and smaller. - **/ - @media only screen and (max-width: 960px) { - .everest-forms_page_evf-builder { - #everest-forms-builder { - .evf-tab-content { - .everest-forms-panel { - .everest-forms-panel-sidebar { - width: 280px; - height: calc(100vh - 122px); - - .evf-registered-buttons { - .evf-registered-item { - width: 46%; - } - } - } - - .everest-forms-panel-sidebar-content { - .everest-forms-panel-content-wrap { - width: calc(100% - 280px); - } - } - } - } - } - } - - .everest-forms { - .everest-forms-integration-content { - .integration-addon-detail { - width: 280px; - } - } - } - } - - @media screen and (max-width: 998px) { - .everest-forms_page_evf-builder { - #everest-forms-builder { - .everest-forms-nav-wrapper { - nav.evf-nav-tab-wrapper { - width: calc(100% - 269px); - } - - .evf-forms-nav-right { - width: 269px; - - .evf-shortcode-field { - input { - display: none; - } - - button { - border-radius: 3px; - } - } - } - } - } - } - } - - /** - * Optimisation for screens 782px and smaller. - **/ - @media screen and (max-width: 782px) { - .everest-forms_page_evf-builder { - .auto-fold { - #wpcontent { - padding-left: 0; - } - } - - .everest-forms { - .everest-forms-overlay { - z-index: 99999; - } - } - - #everest-forms-builder { - width: 100%; - - #everest-forms-builder-form { - width: 100% !important; // Adjust Form builder width - - .evf-tab-content { - .everest-forms-panel-content-wrap { - .everest-forms-panel-content { - height: calc(100vh - 122px); - - &.ps { - height: calc(100vh - 176px); - } - } - - .evf-admin-row { - .evf-admin-grid { - padding: 0; - margin: 0; - } - } - } - - .everest-forms-field-option-row-choices { - ul { - li { - input[type="text"] { - width: calc(100% - 118px); - } - - a { - &.add, - &.remove { - width: 40px; - height: 40px; - } - } - } - } - } - } - } - - .everest-forms-tab-content { - height: calc(100vh - 172px); - } - } - } - - .evf-nav-tab-wrapper { - overflow-x: auto; - } - - .everest-forms_page_evf-settings { - .everest-forms { - .everest-forms-settings { - table { - &.form-table { - th { - padding: 15px 0 15px; - } - } - } - } - } - } - - .everest-forms-builder-setup { - .everest-forms { - #everest-forms-setup-name { - width: auto; - } - - .evf-setup-desc { - a { - width: 200px; - } - } - } - } - } - - /** - * Optimisation for screens 768px. - */ - @media screen and (min-width: 768px) { - .evf-form-col-6 { - flex: 0 0 50%; - max-width: 50%; - } - - .evf-form-col-4 { - flex: 0 0 33.333%; - max-width: 33.333%; - } - } - - /** - * Optimisation for screens 600px and smaller. - */ - @media screen and (max-width: 600px) { - .everest-forms_page_evf-builder, - .everest-forms_page_evf-settings { - .everest-forms { - .evf-nav-tab-wrapper { - a { - &.nav-tab { - margin: 0; - } - } - } - } - } - - .everest-forms-builder-setup { - .everest-forms { - width: 100%; - margin: 20px 0; - - .evf-setup-desc a { - display: block; - margin-bottom: 30px; - text-align: center; - width: 100%; - margin-left: 0; - } - } - } - - .everest-forms_page_evf-builder { - #wpbody-content { - padding-bottom: 0; - } - - #everest-forms-builder { - position: initial; - - #everest-forms-builder-form { - position: relative; - } - - .evf-tab-content { - .everest-forms-panel-content-wrap { - padding: 20px 20px 0; - - .evf-admin-row { - flex-direction: column; - margin: 0 0 20px; - position: relative; - - .evf-admin-grid { - &.evf-grid-1, - &.evf-grid-2, - &.evf-grid-3, - &.evf-grid-4 { - width: auto; - } - } - } - } - } - - .everest-forms-nav-wrapper { - nav.evf-nav-tab-wrapper { - width: calc(100% - 207px); - } - - .evf-forms-nav-right { - width: 207px; - margin-top: 10px; - padding: 9px 17px; - - .evf-shortcode-field { - display: none; - } - } - } - - .evf-tab-content { - .everest-forms-panel { - .everest-forms-panel-sidebar-content { - flex-direction: column; - - .everest-forms-panel-sidebar, - .everest-forms-panel-content-wrap { - width: 100%; - } - - .everest-forms-panel-content-wrap { - padding: 0; - } - } - } - - .evf-choices-list { - li { - input[type="text"] { - width: 84%; - } - } - } - } - } - } - - .everest-forms { - .everest-forms-integration-content { - flex-wrap: wrap; - - .integration-addon-detail { - width: 100%; - margin: 0 20px; - border-bottom: 1px solid #ced4da; - border-right: none; - padding-left: inherit; - } - - .integration-connection-detail { - width: 100%; - } - } - - .everest-forms-integrations-connection { - .everest-forms-integrations { - .integration-header-info { - .integration-detail { - flex-direction: column; - align-items: flex-start; - } - } - - .integration-header-info { - align-items: flex-start; - - .integration-status { - margin-top: 15px; - } - - .integration-detail { - .logo { - margin-bottom: 15px; - } - } - } - } - } - } - - .everest-forms_page_evf-builder { - #everest-forms-builder { - .evf-tab-content { - .everest-forms-panel { - .everest-forms-panel-sidebar { - .evf-registered-buttons { - .evf-registered-item { - width: 48%; - } - } - } - } - } - } - } - } - - @media screen and (max-width: 428px) { - .everest-forms_page_evf-builder { - #everest-forms-builder { - .evf-tab-content { - .everest-forms-panel { - .everest-forms-panel-sidebar { - .evf-registered-buttons { - .evf-registered-item { - width: 46%; - } - } - } - } - } - } - } - } - - /** - * Optimisation for screens 400px and smaller. - */ - @media screen and (max-width: 400px) { - #everest-forms-builder { - .evf-tab-lists li { - a { - padding: 15px; - } - - .dashicons { - font-size: 24px; - } - } - - .evf-tab-content { - .everest-forms-panel { - .everest-forms-panel-sidebar { - .evf-registered-buttons { - .evf-registered-item { - width: 47%; - } - } - } - } - } - } - - .jconfirm.jconfirm-white .jconfirm-box, - .jconfirm.jconfirm-light .jconfirm-box { - width: 90% !important; - } - } - .evf-repeater-fields { - padding: 0 20px 20px; - .everest-forms-field-repeater-fields { - width: calc(100% + 60px) !important; - margin-left: -30px !important; - margin-top: -1px !important; - min-height: 48px; - } - div.evf-admin-grid.evf-repeatable-grid { - padding: 0 10px 10px !important; - } - } - - #elementor-editor-wrapper .everest-icon:before, - .elementor-edit-area .everest-icon:before { - content: "\e902"; - font-family: "EverestForms"; - font-weight: normal; - font-style: normal; - font-display: block; - } - - .everest-forms-field.ui-sortable-helper .evf-field-action { - display: none; - } - - .everest-forms-builder .everest-forms-field.ui-sortable-helper { - padding: 15px 15px 0 15px; - border: 1px solid #cdd0d8; - border-radius: 3px; - - label { - display: block; - font-size: 13px; - font-weight: 600; - margin-bottom: 10px; - - .required { - vertical-align: middle; - padding-left: 6px; - } - } - } - - .everest-forms-builder { - .evf-registered-item.ui-draggable.ui-draggable-handle.ui-draggable-dragging { - font-size: 12px !important; - background-color: #fff; - border: 1px solid #cdd0d8; - color: #6c7680; - - .evf-icon { - padding: 0 8px; - border-radius: 4px; - font-size: 24px; - vertical-align: middle; - } - } - } - - .jconfirm-content-pane { - height: auto !important; - - .evf-shortcut-keyword { - margin-bottom: 18px; - - .evf-shortcut-title { - flex: 3; - } - - li { - display: flex; - align-items: center; - - .evf-key { - display: flex; - flex: 2; - column-gap: 8px; - color: #3498db; - - span { - border: 1px solid #3498db; - background-color: #3498db13; - padding: 4px 0; - width: 40px; - border-radius: 2px; - } - } - } - } - } - - .evf-btn-container { - a { - display: inline-block; - padding: 4px 8px; - border: 1px solid #3498db; - margin-bottom: 8px; - border-radius: 2px; - background-color: #f5fbff; - line-height: 1.8em; - - &:hover { - background-color: #3498db; - color: #fff; - cursor: pointer; - } - } - - .evf-btn-unselect-all { - margin-left: 8px; - } - } - - // Customize Select2 style - .select2-results__option .wrap:before { - content: "\2610"; - width: 25px; - height: 25px; - padding-right: 10px; - } - - .select2-results__option[data-selected="true"] .wrap:before { - content: "\2714"; - } - - .select2-drop, - .select2-dropdown { - z-index: 999999 !important; - } - - .select2-results { - line-height: 1.5em; - - .select2-results__option, - .select2-results__group { - margin: 0; - padding: 8px; - } - } - - .select2-dropdown { - border-color: gray; - } - - .select2-dropdown--below { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); - } - - .select2-dropdown--above { - box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1); - } - - .select2-container { - .select2-selection__rendered.ui-sortable li { - cursor: move; - } - - .select2-selection { - border-color: gray; - } - - .select2-search__field { - min-width: 20px; - } - - .select2-selection--single { - height: 32px; - - .select2-selection__rendered { - display: block; - line-height: 32px; - padding-right: 24px; - } - - .select2-selection__arrow { - right: 3px; - height: 30px; - } - } - - .select2-selection--multiple { - min-height: 28px; - border-radius: 4px; - line-height: 1.5; - border: 1px solid #ddd !important; - padding-left: 4px; - - li { - margin: 0; - } - - .select2-selection__choice { - padding: 2px 6px; - } - - .select2-selection__rendered { - // display: block; - display: flex; - margin: 0px; - - .select2-selection__choice { - margin: 4px; - line-height: 1.4; - display: flex; - align-items: center; - justify-content: center; - - .select2-selection__choice__remove { - bottom: 0px; - } - } - } - } - - .select2-selection__clear { - color: #999; - margin-top: -1px; - } - - .select2-search--inline { - .select2-search__field { - font-family: inherit; - font-size: inherit; - font-weight: inherit; - padding: 3px 0; - margin: 0; - line-height: 1; - min-height: 26px; - height: 32px; - } - } - } - - .everest-forms-form-template-wrapper { - .everest-forms-form-template { - &[data-filter-template="free"] { - .everest-forms-template-wrap[data-plan="premium"] { - display: none; - } - } - &[data-filter-template="premium"] { - .everest-forms-template-wrap[data-plan="free"] { - display: none; - } - } - } - } - - .everest-forms-panel-field { - &.everest-forms-panel-field-checkbox { - .inline { - padding-left: 0; - } - } - } - - .jconfirm-scrollpane { - .jconfirm-row { - .jconfirm-box { - border-top: 0 !important; - padding: 20px !important; - - div { - &.jconfirm-title-c { - padding-bottom: 6px; - - .jconfirm-title { - line-height: 32px; - - h4 { - margin: 0; - } - } - } - } - - .jconfirm-buttons { - padding: 0 !important; - - button { - &.btn-confirm { - margin: 0; - // background-color: $everestforms; - } - } - } - - .jconfirm-content { - &-pane { - margin-bottom: 6px !important; - } - - .everest_forms_hide_container { - > p { - padding-left: 20px; - padding-right: 20px; - } - - .everest-forms-btn { - background: #8c5aca; - color: $color-white; - font-weight: 500; - transition: all 0.3s ease-in-out; - - &:hover { - background: #a869f6; - } - - &:focus { - box-shadow: none; - } - - &.everest-forms-select-existing-page { - margin-right: 10px; - } - - &.everest-forms-create-new-page { - margin-left: 10px; - } - } - } - - .everest-forms-show-exist-page { - select { - width: 70%; - height: 35px; - padding-left: 10px; - border-color: #d5d5d5; - color: #383838; - - &:focus { - box-shadow: none; - border-color: #8c5aca; - } - } - - .everest-forms-lets-go-btn { - background: #8c5aca; - color: #fff; - font-weight: 500; - border: 1px solid #8c5aca; - padding: 6px 16px; - border-radius: 4px; - vertical-align: middle; - margin-left: 10px; - transition: all 0.3s ease-in-out; - - &:hover { - background: #a869f6; - border-color: #a869f6; - } - } - - .everest-forms-show-container { - display: flex; - align-items: center; - justify-content: center; - gap: 2px; - margin-top: 12px; - font-size: 14px; - text-decoration: underline; - color: #494949; - transition: all 0.3s ease-in-out; - - &:hover { - color: #383838; - } - - &::before { - content: ""; - background-image: url("../images/icons/embed-back-icon.svg"); - background-repeat: no-repeat; - background-position: center; - background-size: 100%; - display: block; - width: 18px; - height: 18px; - margin-top: 2px; - } - } - } - - .everest-forms-select-existing-post-container { - input[type="text"] { - width: 70%; - padding: 3px 12px; - - &:focus { - border-color: #8c5aca; - } - } - } - } - } - } - } - - .select2-container { - box-sizing: border-box; - display: inline-block; - margin: 0; - position: relative; - vertical-align: middle; - width: 350px !important; - - .select2-selection--single { - box-sizing: border-box; - cursor: pointer; - display: block; - height: 28px; - margin: 0 0 -4px; - -ms-user-select: none; - user-select: none; - -webkit-user-select: none; - height: 30px; - border-color: #7e8993; - height: 32px; - - .select2-selection__rendered { - display: block; - padding-left: 8px; - padding-right: 20px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - line-height: 28px; - padding-right: 24px; - display: block; - line-height: 32px; - padding-right: 24px; - - &:hover { - color: #007cba; - } - } - - .select2-selection__clear { - position: relative; - } - - &:focus { - outline: 0; - } - .select2-selection__arrow { - right: 1px; - height: 28px; - width: 23px; - 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) - no-repeat right 5px top 55%; - background-size: 16px 16px; - right: 3px; - height: 30px; - b { - display: none; - } - } - } - - .select2-selection--multiple { - box-sizing: border-box; - cursor: pointer; - display: block; - min-height: 32px; - -ms-user-select: none; - user-select: none; - -webkit-user-select: none; - min-height: 30px; - line-height: 1.5; - border-radius: 4px; - border-color: #7e8993; - min-height: 28px; - border-radius: 4px; - line-height: 1.5; - border: 1px solid #ddd !important; - padding-left: 4px; - - .select2-selection__rendered { - display: inline-block; - overflow: hidden; - padding-left: 8px; - text-overflow: ellipsis; - white-space: nowrap; - display: block; - display: flex; - margin: 0; - - .select2-selection__choice { - margin: 4px; - line-height: 1.4; - display: flex; - align-items: center; - justify-content: center; - - .select2-selection__choice__remove { - bottom: 0; - } - } - } - - input.select2-search__field { - min-width: 10px; - margin-top: 0 !important; - margin-bottom: 4px !important; - } - - li { - margin: 0; - margin: 0; - } - - .select2-selection__choice { - padding: 2px 6px; - padding: 2px 6px; - .description { - display: none; - } - } - } - .select2-search--inline { - float: left; - padding: 0; - .select2-search__field { - box-sizing: border-box; - border: none; - font-size: 100%; - margin: 0; - padding: 0; - min-height: 28px; - font-size: inherit; - font-weight: inherit; - padding: 0 0 0 3px; - font-size: inherit; - font-weight: inherit; - padding: 3px 0; - margin: 0; - line-height: 1; - min-height: 26px; - height: 32px; - - &::-webkit-search-cancel-button { - -webkit-appearance: none; - } - } - } - - &:focus { - outline: 0; - } - - span.selection { - display: block; - } - - .select2-selection__rendered.ui-sortable { - li { - cursor: move; - cursor: move; - } - } - - .select2-selection { - border-color: #7e8993; - border-color: #04a4cc; - } - - .select2-search__field { - min-width: 150px; - min-width: 20px; - } - - .select2-selection__clear { - color: #999; - margin-top: -1px; - z-index: 1; - color: #999; - margin-top: -1px; - } - } - - .select2-container[dir="rtl"] { - .select2-selection--single { - .select2-selection__rendered { - padding-right: 8px; - padding-left: 20px; - } - } - } - - .select2-dropdown { - background-color: #fff; - border: 1px solid #aaa; - border-radius: 4px; - box-sizing: border-box; - display: block; - position: absolute; - left: -100000px; - width: 100%; - z-index: 1051; - z-index: 999999 !important; - border-color: #007cba; - z-index: 999999 !important; - border-color: gray; - - .everest-forms-btn { - margin: 8px 4px; - } - - &::after { - position: absolute; - left: 0; - right: 0; - height: 1px; - background: #fff; - content: ""; - } - } - - .select2-results { - display: block; - line-height: 1.5em; - line-height: 1.5em; - - .select2-results__group { - margin: 0; - padding: 8px; - margin: 0; - padding: 8px; - &:focus { - outline: 0; - } - } - - .select2-results__option { - margin: 0; - padding: 8px; - margin: 0; - padding: 8px; - &:focus { - outline: 0; - } - } - - .description { - display: block; - color: #999; - padding-top: 4px; - } - } - - .select2-results__options { - list-style: none; - margin: 0; - padding: 0; - } - - .select2-results__option { - padding: 6px; - outline: 0; - -ms-user-select: none; - user-select: none; - -webkit-user-select: none; - - .wrap { - &:before { - content: "\2610"; - width: 25px; - height: 25px; - padding-right: 10px; - } - } - } - - .select2-results__option[aria-selected] { - cursor: pointer; - } - - .select2-results__option[data-selected] { - cursor: pointer; - } - - .select2-container--open { - .select2-dropdown { - left: 0; - } - - .select2-dropdown--above { - border-bottom: none; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; - } - - .select2-dropdown--below { - border-top: none; - border-top-left-radius: 0; - border-top-right-radius: 0; - margin-top: -15px; - } - } - - .select2-search--dropdown { - display: block; - padding: 4px; - - .select2-search__field { - width: 100%; - box-sizing: border-box; - - &::-webkit-search-cancel-button { - -webkit-appearance: none; - } - } - } - - .select2-search--dropdown.select2-search--hide { - display: none; - } - - .select2-close-mask { - border: 0; - margin: 0; - padding: 0; - display: block; - position: fixed; - left: 0; - top: 0; - min-height: 100%; - min-width: 100%; - height: auto; - width: auto; - opacity: 0; - z-index: 99; - background-color: #fff; - } - - .select2-hidden-accessible { - border: 0 !important; - clip: rect(0 0 0 0) !important; - height: 1px !important; - margin: -1px !important; - overflow: hidden !important; - padding: 0 !important; - position: absolute !important; - width: 1px !important; - } - - .select2-container--default { - .select2-selection--single { - background-color: #fff; - border: 1px solid #aaa; - border-radius: 4px; - - .select2-selection__rendered { - color: #444; - line-height: 28px; - } - - .select2-selection__clear { - cursor: pointer; - float: right; - font-weight: 700; - } - - .select2-selection__placeholder { - color: #999; - } - - .select2-selection__arrow { - height: 26px; - position: absolute; - top: 1px; - right: 1px; - width: 20px; - - b { - border-color: #888 transparent transparent transparent; - border-style: solid; - border-width: 5px 4px 0 4px; - height: 0; - left: 50%; - margin-left: -4px; - margin-top: -2px; - position: absolute; - top: 50%; - width: 0; - } - } - } - - .select2-selection--multiple { - background-color: #fff; - border: 1px solid #aaa; - border-radius: 4px; - cursor: text; - - .select2-selection__rendered { - box-sizing: border-box; - list-style: none; - margin: 0; - padding: 0; - width: 100%; - - li { - list-style: none; - margin: 5px 5px 0 0; - - &::before { - content: ""; - display: none; - } - } - } - - .select2-selection__placeholder { - color: #999; - margin-top: 5px; - float: left; - } - .select2-selection__clear { - cursor: pointer; - float: right; - font-weight: 700; - margin-top: 5px; - margin-right: 10px; - } - .select2-selection__choice { - background-color: #e4e4e4; - border: 1px solid #aaa; - border-radius: 4px; - cursor: default; - float: left; - margin-right: 5px; - margin-top: 5px; - padding: 0 5px; - } - .select2-selection__choice__remove { - color: #999; - cursor: pointer; - display: inline-block; - font-weight: 700; - margin-right: 2px; - &:hover { - color: #333; - } - } - } - .select2-search--dropdown { - .select2-search__field { - border: 1px solid #aaa; - } - } - .select2-search--inline { - .select2-search__field { - background: 0 0; - border: none; - outline: 0; - box-shadow: none; - -webkit-appearance: textfield; - } - } - .select2-results { - > .select2-results__options { - max-height: 200px; - overflow-y: auto; - } - } - .select2-results__option[role="group"] { - padding: 0; - } - .select2-results__option[aria-disabled="true"] { - color: #999; - } - .select2-results__option[aria-selected="true"] { - background-color: #ddd; - } - .select2-results__option[data-selected="true"] { - background-color: #ddd; - } - .select2-results__option { - .select2-results__option { - padding-left: 1em; - .select2-results__group { - padding-left: 0; - } - .select2-results__option { - margin-left: -1em; - padding-left: 2em; - .select2-results__option { - margin-left: -2em; - padding-left: 3em; - .select2-results__option { - margin-left: -3em; - padding-left: 4em; - .select2-results__option { - margin-left: -4em; - padding-left: 5em; - .select2-results__option { - margin-left: -5em; - padding-left: 6em; - } - } - } - } - } - } - } - .select2-results__option--highlighted[aria-selected] { - color: #fff; - background-color: #0073aa; - } - .select2-results__option--highlighted[data-selected] { - color: #fff; - background-color: #0073aa; - } - .select2-results__group { - cursor: default; - display: block; - padding: 6px; - } - } - .select2-container--default[dir="rtl"] { - .select2-selection--single { - .select2-selection__clear { - float: left; - } - .select2-selection__arrow { - left: 1px; - right: auto; - } - } - .select2-selection--multiple { - .select2-search--inline { - float: right; - } - .select2-selection__choice { - float: right; - margin-left: 5px; - margin-right: auto; - } - .select2-selection__placeholder { - float: right; - } - .select2-selection__choice__remove { - margin-left: 2px; - margin-right: auto; - } - } - } - .select2-container--default.select2-container--disabled { - .select2-selection--single { - background-color: #eee; - cursor: default; - .select2-selection__clear { - display: none; - } - } - .select2-selection--multiple { - background-color: #eee; - cursor: default; - } - .select2-selection__choice__remove { - display: none; - } - } - .select2-container--default.select2-container--open { - .select2-selection--single { - .select2-selection__arrow { - b { - border-color: transparent transparent #888 transparent; - border-width: 0 4px 5px 4px; - } - } - } - } - .select2-container--default.select2-container--focus { - .select2-selection--multiple { - border: solid #000 1px; - outline: 0; - } - } - .select2-container--default.select2-container--open.select2-container--above { - .select2-selection--multiple { - border-top-left-radius: 0; - border-top-right-radius: 0; - } - .select2-selection--single { - border-top-left-radius: 0; - border-top-right-radius: 0; - } - } - .select2-container--default.select2-container--open.select2-container--below { - .select2-selection--multiple { - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; - } - .select2-selection--single { - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; - } - } - .select2-container--classic { - .select2-selection--single { - background-color: #f7f7f7; - border: 1px solid #aaa; - border-radius: 4px; - outline: 0; - background-image: linear-gradient(to bottom, #fff 50%, #eee 100%); - background-repeat: repeat-x; - &:focus { - border: 1px solid #0073aa; - } - .select2-selection__rendered { - color: #444; - line-height: 28px; - } - .select2-selection__clear { - cursor: pointer; - float: right; - font-weight: 700; - margin-right: 10px; - } - .select2-selection__placeholder { - color: #999; - } - .select2-selection__arrow { - background-color: #ddd; - border: none; - border-left: 1px solid #aaa; - border-top-right-radius: 4px; - border-bottom-right-radius: 4px; - height: 26px; - position: absolute; - top: 1px; - right: 1px; - width: 20px; - background-image: linear-gradient(to bottom, #eee 50%, #ccc 100%); - background-repeat: repeat-x; - b { - border-color: #888 transparent transparent transparent; - border-style: solid; - border-width: 5px 4px 0 4px; - height: 0; - left: 50%; - margin-left: -4px; - margin-top: -2px; - position: absolute; - top: 50%; - width: 0; - } - } - } - .select2-selection--multiple { - background-color: #fff; - border: 1px solid #aaa; - border-radius: 4px; - cursor: text; - outline: 0; - &:focus { - border: 1px solid #0073aa; - } - .select2-selection__rendered { - list-style: none; - margin: 0; - padding: 0 5px; - } - .select2-selection__clear { - display: none; - } - .select2-selection__choice { - background-color: #e4e4e4; - border: 1px solid #aaa; - border-radius: 4px; - cursor: default; - float: left; - margin-right: 5px; - margin-top: 5px; - padding: 0 5px; - } - .select2-selection__choice__remove { - color: #888; - cursor: pointer; - display: inline-block; - font-weight: 700; - margin-right: 2px; - &:hover { - color: #555; - } - } - } - .select2-search--dropdown { - .select2-search__field { - border: 1px solid #aaa; - outline: 0; - } - } - .select2-search--inline { - .select2-search__field { - outline: 0; - box-shadow: none; - } - } - .select2-dropdown { - background-color: #fff; - border: 1px solid transparent; - } - .select2-dropdown--above { - border-bottom: none; - } - .select2-dropdown--below { - border-top: none; - } - .select2-results { - > .select2-results__options { - max-height: 200px; - overflow-y: auto; - } - } - .select2-results__option[role="group"] { - padding: 0; - } - .select2-results__option[aria-disabled="true"] { - color: grey; - } - .select2-results__option--highlighted[aria-selected] { - background-color: #3875d7; - color: #fff; - } - .select2-results__option--highlighted[data-selected] { - background-color: #3875d7; - color: #fff; - } - .select2-results__group { - cursor: default; - display: block; - padding: 6px; - } - } - .select2-container--classic[dir="rtl"] { - .select2-selection--single { - .select2-selection__clear { - float: left; - } - .select2-selection__arrow { - border: none; - border-right: 1px solid #aaa; - border-radius: 0; - border-top-left-radius: 4px; - border-bottom-left-radius: 4px; - left: 1px; - right: auto; - } - } - .select2-selection--multiple { - .select2-selection__choice { - float: right; - margin-left: 5px; - margin-right: auto; - } - .select2-selection__choice__remove { - margin-left: 2px; - margin-right: auto; - } - } - } - .select2-container--classic.select2-container--open { - .select2-selection--single { - border: 1px solid #0073aa; - .select2-selection__arrow { - background: 0 0; - border: none; - b { - border-color: transparent transparent #888 transparent; - border-width: 0 4px 5px 4px; - } - } - } - .select2-selection--multiple { - border: 1px solid #0073aa; - } - .select2-dropdown { - border-color: #0073aa; - } - } - .select2-container--classic.select2-container--open.select2-container--above { - .select2-selection--single { - border-top: none; - border-top-left-radius: 0; - border-top-right-radius: 0; - background-image: linear-gradient(to bottom, #fff 0, #eee 50%); - background-repeat: repeat-x; - } - .select2-selection--multiple { - border-top: none; - border-top-left-radius: 0; - border-top-right-radius: 0; - } - } - .select2-container--classic.select2-container--open.select2-container--below { - .select2-selection--single { - border-bottom: none; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; - background-image: linear-gradient(to bottom, #eee 50%, #fff 100%); - background-repeat: repeat-x; - } - .select2-selection--multiple { - border-bottom: none; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; - } - } - .evf-akismet { - .evf-akismet-warning { - .evf-akismet-warning-label { - color: #ffcc00; - } - } - } - - // Everest Forms system info settings. - .everest-forms { - position: relative; - } - - .everest-forms-system-info-setting { - margin-top: 40px; - - &-copy { - position: absolute; - top: 18px; - right: 24px; - padding: 8px 16px; - border-radius: 4px; - border: 0; - font-size: 14px; - line-height: 22px; - font-weight: 500; - cursor: pointer; - } - - table { - width: 100%; - border-collapse: collapse; - - th, - td { - padding: 10px; - border: 1px solid #ddd; - text-align: left; - font-size: 14px; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } - - th { - background: #f2f2f2; - font-weight: 600; - } - - tr { - &:nth-child(even) { - background: #f9f9f9; - } - - &:hover { - background: #f2f2f2; - } - - th { - &[colspan="2"] { - background: #8c3eeb; - color: #fff; - font-size: 15px; - line-height: 23px; - font-weight: 500; - letter-spacing: 0.2px; - } - } - } - } - } - // Image upload button delete icon - .everest-forms-panel-field-image { - .everest-forms-custom-image-container { - .everest-forms-custom-image-delete { - display: inline-flex; - position: relative; - - i { - display: none; - } - - &:hover { - &::before { - content: ""; - background: #000; - position: absolute; - width: 100%; - height: 100%; - opacity: 0.6; - } - - i { - position: absolute; - display: contents; - - &:hover { - &::before, - &::after { - transform: translate(-50%, -50%) scale(1.1); - } - } - - &::before { - content: ""; - background: #d52626; - width: 42px; - height: 42px; - position: absolute; - border-radius: 50%; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - } - - &::after { - content: "\e906"; - position: absolute; - font-size: 22px; - color: #fff; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - } - } - } - } - } - } - #everest-forms-builder { - .everest-forms-options { - padding-left: 20px; - } - - .evf-tab-content { - .evf-quiz-section { - .enable-quiz-head { - background: #f8f9fa; - margin-left: -20px; - margin-top: -20px; - margin-right: -20px; - padding: 20px 20px 0; - border-bottom: 1px solid #e0e3e6; - - label { - font-size: 14px; - } - } - - .evf-quiz-reporting { - .everest-forms-panel-field-radio { - .row { - display: flex; - align-items: center; - margin-bottom: 10px; - - input { - margin: 0 4px 0 0; - } - - label { - margin-bottom: 0; - } - } - } - } - - .evf-quiz-settings { - padding-left: 20px; - - .everest-forms-overall-feedback { - max-width: 800px; - border: 1px solid transparent; - - &.feedback-enabled { - margin-top: 5px; - margin-left: -20px; - margin-bottom: 20px; - padding: 0 20px 20px; - border-radius: 4px; - border: 1px solid $color_gray-lighten; - } - - > div > label { - padding: 0 10px; - margin: 0 0 10px -10px; - background: $color-white; - display: inline-block; - transform: translateY(-50%); - } - - .everest-forms-panel-field { - margin-bottom: 0; - } - - .everest-forms-options { - padding-left: 0; - } - - .overall-feedback-option { - .evf-form-group { - padding: 20px; - position: relative; - margin-bottom: 20px; - border-radius: 4px; - border: 1px solid $color_gray-lighten; - background-color: adjust-color( - $color_gray-light-skin, - $saturation: +1%, - $lightness: +1% - ); - - input { - &.score_from { - pointer-events: none; - background-color: $color_gray-light-skin; - } - } - - .evf-disabled { - cursor: not-allowed; - - input { - pointer-events: none; - background-color: $color_gray-light-skin; - } - } - - .feedback-label-group { - flex: 1; - display: flex; - margin-bottom: 15px; - - .feedback-input-group { - flex: 1; - margin-right: 15px; - - label { - margin-bottom: 6px; - } - - .feedback-input-value { - display: flex; - align-items: center; - position: relative; - - input { - padding-right: 30px; - } - - span { - width: 30px; - height: 30px; - display: flex; - align-items: center; - justify-content: center; - position: absolute; - right: 0; - background: $color_gray-more-lighten; - border: 1px solid - $color-gray-lighten; - border-radius: 0 4px 4px 0; - } - } - - &:last-child { - margin-right: 0; - } - } - } - - .remove_feedback { - cursor: pointer; - position: absolute; - top: 3px; - right: 3px; - color: $color_gray-base; - - &:hover { - color: $red; - } - } - } - - .add_feedback { - display: block; - text-align: right; - margin-left: auto; - } - } - } - } - } - - // Likert-table and Scale rating table - table { - &.everest-forms-likert-table, - &.everest-froms-likert-field-preview, - &.everest-forms-scale-rating-table { - input { - display: none; - } - - label { - margin-bottom: 0; - } - } - - // Likert-table - &.everest-forms-likert-table, - &.everest-froms-likert-field-preview { - background: $color-white; - width: 100%; - overflow: hidden; - margin-bottom: 5px; - border: 1px solid $color_gray-lighten; - - input, - select { - border-color: $color_gray-lighten; - } - - label { - &::before { - height: 16px; - width: 16px; - content: ""; - border: 1px solid $color_gray-lighten; - display: block; - margin: 0 auto; - } - } - - input[type="radio"] { - + label { - &::before { - border-radius: 50%; - } - } - } - - select { - height: 20px; - width: 70px; - opacity: 0.6; - font-size: 12px; - } - - th, - td { - padding: 10px; - height: 42px; - word-break: break-word; - } - - th { - font-size: 12px; - font-weight: 400; - text-align: center; - } - - thead { - th { - background: $color_gray-light-skin; - border-bottom: 1px solid $color_gray-lighten; - } - } - - tbody { - tr { - text-align: left; - - th { - text-align: left; - } - - td { - text-align: center; - - &:last-child { - border-right: none; - } - } - - &:nth-child(even) { - th, - td { - background: $color_gray-light-skin; - } - } - } - } - } - - // Scale rating table - &.everest-forms-scale-rating-table { - width: 100%; - table-layout: fixed; - - thead { - tr { - th { - font-size: 12px; - font-weight: 400; - padding-bottom: 10px; - - .lowest-rating { - float: left; - } - - .highest-rating { - float: right; - } - } - } - } - - tbody { - tr { - td { - border: 1px solid $color_gray-lighten; - height: 40px; - border-right: none; - background: $color_gray-light-skin; - text-align: center; - - &:last-child { - border-right: 1px solid $color_gray-lighten; - } - } - } - } - } - } - } - } - - .evf-survey-choices { - &[data-choice-type="drop_down_choices"] { - input[type="text"] { - width: 74%; - } - } - } - - // Quiz - .evf-correct-answers { - li { - margin-bottom: 10px; - } - } - - /** - * Analytic Table Dashboard - */ - .evf-survey-loader { - display: block; - padding: 70px; - background: $color-white; - box-shadow: 0 1px 5px rgba(51, 56, 64, 0.1); - - .evf-loading.evf-loading-active { - margin: 0 auto; - float: none; - display: block; - } - } - - .everest-forms-single-survey-container { - border-top: 1px solid $color_gray-lighten; - margin: 20px 0; - - .everest-forms-survey-block { - margin-right: 0; - margin-top: 25px; - } - - .survey-block-chart-content { - .survey-block-chart-overview { - max-height: 329px; - } - } - - .everest-forms-survey-summary { - max-height: 455px; - overflow-x: hidden; - overflow-y: auto; - } - } - - .full-survey-entries-header { - padding: 20px 0; - margin-bottom: 35px; - border-bottom: 1px solid $color_gray-lighten; - - select { - height: 36px; - padding: 0 10px; - font-size: 16px; - font-weight: 600; - border-radius: 3px; - } - - .everest-forms-btn { - vertical-align: middle; - } - } - - .everest-forms-survey-block { - padding: 20px; - background: $color-white; - margin-right: 20px; - margin-bottom: 30px; - border-radius: 8px; - box-shadow: 0 1px 5px rgba(51, 56, 64, 0.1); - position: relative; - - .everest-forms-survey-header { - margin-top: 0; - - .everest-forms-survey-selection { - label { - top: -35px; - position: absolute; - padding: 5px 10px; - border-radius: 3px; - background: $color-white; - box-shadow: 0 2px 2px rgba(159, 175, 199, 0.6); - } - } - } - - &.evf-empty-data { - display: flex; - align-items: center; - - .evf-icon-circle { - padding: 20px; - background: transparentize($color_gray-lighten, 0.75); - display: inline-flex; - border-radius: 50%; - margin-right: 20px; - - svg { - height: 64px; - width: 64px; - fill: $color_gray-base; - } - } - } - } - - .everest-forms-survey-header { - display: flex; - align-items: center; - justify-content: space-between; - margin: 35px 0 20px; - - .everest-forms-survey-selection { - display: flex; - align-items: center; - position: relative; - - .form-header-name { - margin-right: 15px; - } - - .survey-type-select { - position: relative; - margin-right: 15px; - - label { - left: 0; - right: 0; - top: -22px; - position: absolute; - text-align: center; - font-style: italic; - } - - select { - &.survey-type { - margin: 0; - height: 36px; - padding: 0 5px; - font-size: 14px; - min-width: 170px; - border-radius: 3px; - font-weight: normal; - } - } - } - - .evf-analytic-button { - margin-left: 15px; - } - - .survey-type { - margin: 10px 0 0; - font-size: 16px; - box-shadow: none; - font-weight: 600; - } - } - - .evf-analytic-action-nav { - ul { - margin: 0; - display: flex; - - li { - margin-bottom: 0; - margin-right: 15px; - - &:last-child { - margin-right: 0; - } - } - } - } - } - - .box-wrap { - background: $color-white; - display: flex; - justify-content: space-between; - border: 1px solid $color_gray-lighten; - border-radius: 8px; - } - - .survey-block-average-overview { - display: flex; - flex-wrap: wrap; - - .box-wrap { - flex: 1; - align-items: center; - margin: 0 10px 20px; - - &:first-child { - margin-left: 0; - } - - &:last-child { - margin-right: 0; - } - } - - .response-detail { - color: $color_gray-light; - display: flex; - flex-direction: column; - font-size: 16px; - padding: 20px; - - strong { - font-size: 36px; - line-height: 1; - margin-bottom: 5px; - color: $color_gray-dark; - } - } - - .icon-thumbnail { - padding: 20px; - display: flex; - border-left: 1px solid $color_gray-lighten; - - svg { - height: 48px; - width: 48px; - fill: $everestforms; - border-radius: 4px; - background: transparentize($everestforms, 0.85); - padding: 10px; - } - } - } - - .survey-block-chart-content { - width: 60%; - padding: 0 20px; - border-right: 1px solid $color_gray-lighten; - - .chart-tab-action { - padding: 15px 0; - text-align: right; - border-bottom: 1px solid $color_gray-lighten; - - button { - width: 35px; - height: 35px; - border: none; - line-height: 1; - cursor: pointer; - margin-left: 10px; - border-radius: 4px; - background: $color_gray-more-lighten; - transition: all 0.25s ease 0s; - - &.current-tab-active, - &:hover { - color: $color-white; - background: $everestforms; - - svg { - fill: $color-white; - } - } - - svg { - width: 20px; - height: 20px; - fill: $color_gray-normal; - transition: all 0.25s ease 0s; - } - } - } - - .survey-block-chart-overview { - height: 370px; - padding: 50px 0; - background: $color-white; - } - } - - .everest-forms-survey-summary { - flex: 1; - padding: 20px; - overflow: auto; - - table { - width: 100%; - border-spacing: 0; - border-radius: 4px; - border: 1px solid $color_gray-lighten; - - th, - td { - padding: 10px; - } - - thead { - th { - background: $color_gray-light-skin; - border-bottom: 1px solid $color_gray-lighten; - - &:first-child { - text-align: left; - border-radius: 4px 0 0 0; - } - - &:last-child { - text-align: right; - border-radius: 0 4px 0 0; - } - } - } - - tbody { - tr { - &:nth-child(even) { - th, - td { - background: $color_gray-light-skin; - } - } - - td { - &:last-child { - text-align: right; - } - } - } - } - - &.evf-likert-chart-table { - th, - td { - text-align: center; - } - - thead { - th { - &:last-child { - text-align: center; - } - } - } - - tbody { - tr { - td { - &:last-child { - text-align: center; - } - } - } - } - } - } - - .summary-chart-wrapper { - width: 100%; - border-spacing: 0; - border-radius: 4px; - border: 1px solid $color_gray-lighten; - - .summary-chart-header { - background: $color_gray-light-skin; - border-bottom: 1px solid $color_gray-lighten; - border-radius: 4px 4px 0 0; - margin: 0; - padding: 15px 10px; - font-size: 14px; - } - - .summary-chart-body { - display: flex; - flex-wrap: wrap; - - .survey-chart-row { - flex: 1; - padding: 15px 5px; - position: relative; - text-align: center; - - &:first-child { - flex: 100%; - border-bottom: 1px solid $color_gray-lighten; - padding: 30px; - - .survey-chart-column { - &:last-child { - font-size: 22px; - color: $everestforms; - margin-top: 10px; - } - } - } - - svg { - width: 200px !important; - margin: 0 auto; - } - - .progressbar-text { - font-size: 28px; - font-weight: 600; - position: absolute; - } - - .survey-chart-column { - margin: 5px 0; - font-size: 14px; - font-weight: 600; - } - } - } - } - - /** - * Star Rating Table - **/ - .approx-rating-result { - padding: 20px; - margin: 10px 0; - - .approx-rating-label { - font-size: 48px; - line-height: 1; - margin-bottom: 10px; - } - - .total-reviews { - font-size: 16px; - font-weight: 600; - color: $color_gray-base; - } - } - - .summary-chart-rating { - margin: 0 20px; - padding: 20px 0; - border-top: 1px solid $color_gray-lighten; - - .survey-chart-row { - margin-bottom: 15px; - - .survey-chart-column { - display: flex; - justify-content: space-between; - - &:first-child { - margin-bottom: 5px; - } - - .rating-progress { - flex: 1; - height: 5px; - display: flex; - overflow: hidden; - background-color: $color_gray-lighten; - border-radius: 3px; - - .progress-bar { - display: flex; - flex-direction: column; - justify-content: center; - color: $color-white; - text-align: center; - white-space: nowrap; - background-color: $everestforms; - transition: width 0.6s ease; - } - } - } - } - } - - &::-webkit-scrollbar { - width: 8px; - } - - &::-webkit-scrollbar-track { - background: $color_gray-more-lighten; - } - - &::-webkit-scrollbar-thumb { - background: transparentize($color_gray-normal, 0.5); - border-radius: 4px; - } - - &::-webkit-scrollbar-thumb:hover { - background: transparentize($color_gray-normal, 0.25); - } - } - - /** - * quiz entry - */ - #everest-forms-entry-fields:not(.postbox) { - .correct_answer { - background-color: rgba(0, 255, 43, 0.1); - padding: 7px; - } - - .wrong_answer { - background-color: rgba(255, 0, 0, 0.1); - padding: 7px; - } - - table { - tbody { - th { - display: flex; - justify-content: space-between; - } - - tr { - td { - span { - margin-bottom: 7px; - - &:last-child { - margin-bottom: 0; - } - } - } - } - } - } - } - - /** - * Yes/No field. - */ - .everest-forms-field { - .yes-no-preview { - display: flex; - column-gap: 24px; - - &.text-only { - input { - text-align: center; - width: 80px; - padding: 8px 0; - border: none; - outline: 1px solid; - - &:nth-child(1) { - outline-color: #008000; - background-color: #eeffee; - } - - &:nth-child(2) { - outline-color: #fa5252; - background-color: #fff1f1; - } - } - } - - &.icon-text { - .yes-no-icon { - display: inline-flex; - column-gap: 16px; - align-items: center; - } - } - } - } - - //General settings - .everest-forms-settings { - display: flex; - background: #f1f1f1; - min-height: 100vh; - - .everest-forms-settings-container { - flex: 1; - padding: 20px; - background: #ffffff; - box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); - - .everest-forms-options-header { - &--top { - h3 { - font-size: 24px; - margin-bottom: 10px; - } - } - } - - .everest-forms-card { - background-color: #f1f1f1; - border-radius: 5px; - padding: 20px; - margin-bottom: 20px; - - .everest-forms-global-settings { - display: flex; - align-items: center; - margin-bottom: 10px; - - label { - flex: 1; - font-weight: bold; - } - - &--field { - flex: 2; - } - - } - } - - .submit { - text-align: right; - - .everest-forms-btn { - padding: 10px 20px; - font-size: 16px; - border-radius: 5px; - cursor: pointer; - background-color: #6c63ff; - color: #fff; - border: none; - - &:hover { - background-color: #5b52e6; - } - } - } - } - } - - - // Everest Forms Global Settings Design ReVamp CSS - #wpcontent { - #wpbody-content { - padding-bottom: 25px; - } - } - - .everest-forms_page_evf-settings { - .everest-forms { - padding: 20px; - overflow: hidden; - } - } - .everest-forms { - .everest-forms-settings { - padding: 0 !important; - gap: 24px; - background: transparent; - - &-wrapper { - box-shadow: 0px 6px 26px 0px rgba(10, 10, 10, .08); - background: #ffffff; - flex: 1; + .everest-forms-toggle-wrapper { + position: absolute; + right: 0; + top: 6px; display: flex; - } + align-items: center; + gap: 6px; + + .evf-toggle-section { + .everest-forms-toggle-form { + margin: 0; + } + } - &-main { - &:has(#message) { - .everest-forms-toggle-wrapper { - top: 76px; + .everest-forms-toggle-text { + font-size: 14px; + line-height: 24px; + color: #383838; + font-weight: 500; } } - } + } - .everest-forms-settings-container { - #message { - border: 1px solid #e6e6e6; - border-left-width: 4px; - border-left-color: #00a32a; - box-shadow: unset; - margin-top: 0; - margin-bottom: 20px; + .everest-forms-options-header { + margin-bottom: 32px; + + &--top { + display: flex; + align-items: center; + padding-bottom: 24px; + border-bottom: 1px solid #eee8f7; + + .evf-forms-options-header-header--top-icon { + display: flex; + align-items: center; + justify-content: center; + width: 40px; + height: 40px; + border-radius: 4px; + background: #eee8f7; + margin-right: 16px; + + svg { + width: 20px; + height: 20px; + + path { + fill: #7545bb; + } + } + } + + h3 { + margin: 0; + color: #383838; + font-size: 24px; + font-weight: 600; + line-height: 34px; } } + } - .everest-forms-header { - display: flex; - flex-direction: column; - background: #FAFAFC; - border-right: 1px solid #EDEDED; - padding: 32px 0 20px; - width: 300px; - max-width: 100%; - transition: all .3s; - - &--top { - text-align: center; - padding-bottom: 30px; - border-bottom: 1px solid #ededed; - - &-logo { - img { - max-height: 70px; - } - } - } - - &--nav { - height: 100%; - - .evf-nav-tab-wrapper { - display: flex; - flex-direction: column; - gap: 1px; - background: transparent; - position: relative; - height: 100%; - overflow: unset !important; - - .evf-nav__link { - width: 100%; - display: flex; - padding: 16px 20px; - align-items: center; - gap: 16px; - border-bottom: 1px solid #EDEDED; - position: relative; - transition: all .3s ease-in-out; - - &::before { - content: ""; - background: #7545BB; - width: 4px; - height: 100%; - position: absolute; - top: 0; - left: 0; - opacity: 0; - transition: all .3s ease-in-out; - } + .everest-forms-card { + padding: 0; + background: transparent; + border: 0; + display: flex; + flex-direction: column; + gap: 24px; + margin-bottom: 40px; + + .everest-forms-global-settings { + margin-bottom: 0; + + &:has(label[for="everest_forms_email_template"]), + &:has(label[for="everest_forms_pdf_template"]) { + align-items: flex-start; + } - &::after { - content: ""; - background: #fff; - width: 8px; - height: 100%; - position: absolute; - top: 0; - right: -4px; - opacity: 0; - transition: all .3s ease-in-out; - } - - &-icon { - display: flex; - align-items: center; - justify-content: center; - - svg { - width: 20px; - height: 20px; - - path { - fill: #4e4e4e; - transition: all .3s ease-in-out; - } - } - } - - &-label { + > label { + color: #383838; + font-size: 15px; + font-weight: 500; + line-height: 26px; + width: 300px; + flex: unset; + display: flex; + align-items: center; + gap: 8px; + + .everest-forms-help-tip { + width: 18px; + height: 18px; + + &::after { + color: #999999; + } + } + } + + &--field { + flex: 1; + + &.forminp-input_test_button { + @media screen and (max-width: 782px) { display: flex; - align-items: center; - width: 100%; + flex-direction: column; + gap: 12px; - > p { - width: 100%; - margin: 0; - font-size: 15px; - font-weight: 500; - line-height: 21px; - color: #4e4e4e; - transition: all .3s ease-in-out; - } + input[type="email"] { + width: 100%; + margin-right: 0 !important; + } - svg { - width: 20px; - height: 20px; - } - } - - &:hover, - &.nav-tab-active { - background: #ffffff; - - &::before { - opacity: 1; - } - - .evf-nav__link { - &-icon { - svg { - path { - fill: #7545BB; - } - } - } - - &-label { - > p { - color: #7545BB; - } - - svg { - path { - stroke: #7545BB; - } - } - } - } - } - - &.nav-tab-active { - background: #ffffff; + .button.everest_forms_send_email_test { + margin-bottom: 0; + width: max-content; + } + } + } - &::before, - &::after { - opacity: 1; - } - } - } - - #evf-settings-collapse { - margin: 0; - padding: 16px 20px; - background: transparent; - border: 1px solid transparent; - cursor: pointer; - transition: all .3s ease-in-out; - - &::before, - &::after { - content: none; - } - - .evf-nav__link-label { - line-height: 21px; - } - - .evf-nav-icon { - display: flex; - align-items: center; - justify-content: center; - - img { - width: 20px; - height: 20px; - transition: all .3s ease-in-out; - } - } - - &:hover { - background: #7545BB; - color: #ffffff; - - .evf-nav-icon { - img { - filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7487%) hue-rotate(137deg) brightness(89%) contrast(114%); - } - } - } - } - - .ps__rail { - &-x { - display: none; + fieldset { + > label { + font-size: 14px; + line-height: 22px; + font-weight: 400; + + strong { + font-weight: 600; } - } - } - } - - &.collapsed { - width: 60px; - - .everest-forms-header--top { - &-logo { - img { - margin-left: 16px; - max-height: 50px; - } - } - } - - .everest-forms-header--nav { - .evf-nav-tab-wrapper { - .evf-nav__link { - &-label { - opacity: 0; + + a { + color: #7545bb; + text-decoration: underline; + + &:focus { + box-shadow: none; + outline: none; } } - #evf-settings-collapse { - .evf-nav-icon { - img { - transform: rotate(180deg); - } - } - } - } - } - } - } - - .everest-forms-settings-container { - padding: 32px 20px 52px 32px; - box-shadow: none; - - .everest-forms-settings-main { - position: relative; + } + } - .everest-forms-toggle-wrapper { - position: absolute; - right: 0; - top: 6px; - display: flex; - align-items: center; - gap: 6px; + &.forminp-radio { + .everest-forms-recaptcha-type { + margin: 0; + display: flex; + align-items: center; + gap: 24px; - .evf-toggle-section { - .everest-forms-toggle-form { - margin: 0; + li { + margin-bottom: 0; + + > label { + display: flex; + align-items: center; + gap: 6px; + font-size: 14px; + line-height: 24px; + font-weight: 400; + color: #383838; + } } } + } - .everest-forms-toggle-text { - font-size: 14px; - line-height: 24px; + &.forminp-text, + &.forminp-number, + &.forminp-email, + &.forminp-color { + input { + height: 36px; + border-radius: 4px; + width: 100%; + background: #ffffff; + border-color: #e1e1e1; + padding-left: 12px; + padding-right: 12px; color: #383838; - font-weight: 500; + + &:focus { + border-color: #7545bb; + outline: none; + box-shadow: none; + } } } - } - .everest-forms-options-header { - margin-bottom: 32px; - - &--top { - display: flex; - align-items: center; - padding-bottom: 24px; - border-bottom: 1px solid #eee8f7; + &.forminp-select { + .select2-container { + width: 100% !important; + } - .evf-forms-options-header-header--top-icon { - display: flex; - align-items: center; - justify-content: center; - width: 40px; - height: 40px; - border-radius: 4px; - background: #EEE8F7; - margin-right: 16px; + .select2-selection { + height: 36px; + margin-bottom: 0; + border-color: #e1e1e1; - svg { - width: 20px; - height: 20px; + &__rendered { + padding-left: 12px; + padding-right: 12px; + line-height: 34px; + } - path { - fill: #7545BB; - } + &__arrow { + height: 34px; } } - h3 { - margin: 0; - color: #383838; - font-size: 24px; - font-weight: 600; - line-height: 34px; - } - } - } - - .everest-forms-card { - padding: 0; - background: transparent; - border: 0; - display: flex; - flex-direction: column; - gap: 24px; - margin-bottom: 40px; - - .everest-forms-global-settings { - margin-bottom: 0; - - &:has(label[for="everest_forms_email_template"]), - &:has(label[for="everest_forms_pdf_template"]) { - align-items: flex-start; - } - - > label { - color: #383838; - font-size: 15px; - font-weight: 500; - line-height: 26px; - width: 300px; - flex: unset; - display: flex; - align-items: center; - gap: 8px; - - .everest-forms-help-tip { - width: 18px; - height: 18px; - - &::after { - color: #999999; - } - } - } - - &--field { - flex: 1; - - &.forminp-input_test_button { - @media screen and (max-width: 782px) { - display: flex; - flex-direction: column; - gap: 12px; + .select2-container--focus, + .select2-container--open { + .select2-selection { + border-color: #7545bb; + box-shadow: none; + } + } + } - input[type="email"] { - width: 100%; - margin-right: 0 !important; - } + &.forminp-radio-image { + fieldset { + ul { + display: flex; + align-items: center; + gap: 20px; + margin-top: 0; + margin-bottom: 16px; - .button.everest_forms_send_email_test { - margin-bottom: 0; - width: max-content; - } - } - } - - - - fieldset { - > label { - font-size: 14px; - line-height: 22px; - font-weight: 400; - - strong { - font-weight: 600; - } - - a { - color: #7545BB; - text-decoration: underline; - - &:focus { - box-shadow: none; - outline: none; - } - } - } - } - - &.forminp-radio { - .everest-forms-recaptcha-type { - margin: 0; - display: flex; - align-items: center; - gap: 24px; - - li { - margin-bottom: 0; - - > label { - display: flex; - align-items: center; - gap: 6px; - font-size: 14px; - line-height: 24px; - font-weight: 400; - color: #383838; - } - } - } - } - - &.forminp-text, - &.forminp-number, - &.forminp-email, - &.forminp-color { - input { - height: 36px; - border-radius: 4px; - width: 100%; - background: #ffffff; - border-color: #e1e1e1; - padding-left: 12px; - padding-right: 12px; - color: #383838; - - &:focus { - border-color: #7545BB; - outline: none; - box-shadow: none; - } - } - } - - &.forminp-select { - .select2-container { - width: 100% !important; - } - - .select2-selection { - height: 36px; - margin-bottom: 0; - border-color: #e1e1e1; - - &__rendered { - padding-left: 12px; - padding-right: 12px; - line-height: 34px; - } - - &__arrow { - height: 34px; - } - } - - .select2-container--focus, - .select2-container--open { - .select2-selection { - border-color: #7545BB; - box-shadow: none; - } - } - } - - &.forminp-radio-image { - fieldset { - ul { - display: flex; - align-items: center; - gap: 20px; - margin-top: 0; - margin-bottom: 16px; - - li { - margin-bottom: 0; - - input { - display: none; - - &:checked ~ label { - border: 1px solid #7545BB; - } - } - - label { - display: flex; - flex-direction: column; - border: 1px solid #e1e1e1; - padding: 8px; - border-radius: 6px; - gap: 12px; - font-weight: 500; - cursor: pointer; - - img { - border: 1px solid #eee8f7; - border-radius: 4px; - } - } - } - } - - .description { - margin: 0; - font-size: 14px; - line-height: 20px; - } - - } - - } - - &.forminp-link { - .everest_forms_send_email_test { - border-radius: 4px; - border: 1px solid #e1e1e1; - background: #F6F7F7; - padding: 4px 12px; - color: #383838; - font-weight: 500; - display: flex; - align-items: center; - justify-content: center; - gap: 6px; - width: max-content; - - &::after { - content: ""; - background-image: url("../images/icons/send-icon.svg"); - background-repeat: no-repeat; - background-size: 100%; - background-position: center; - width: 14px; - height: 14px; - } - } - } - - &.forminp-multiselect { - .select2-container { - width: 100% !important; - - .select2-selection { - &.select2-selection--multiple { - height: 38px; - padding: 5px; - } - - &__rendered { - display: block; - } - - &__choice { - flex-direction: row-reverse; - padding: 4px 8px 4px 10px; - margin: 0; - margin-right: 4px; - } - } - } - } - - &.forminp-textarea { - textarea { - width: 100%; - border-color: #E1E1E1; - padding: 8px 12px; - } - } - - &.forminp-select { - select { - width: 100%; - height: 36px; - border-color: #e1e1e1; - padding-left: 12px; - padding-right: 12px; - - &:focus { - border-color: #7545BB; - outline: none; - box-shadow: none; - } - } - } - - &.forminp-color { - position: relative; - - .colorpickpreview { - width: 26px; - height: 26px; - border-radius: 3px; - position: absolute; - top: 5px; - left: 6px; - border: 1px solid #E9E9E9; - } - - input { - padding-left: 36px; - } - } - - &.forminp-image { - .evf-button { - border-radius: 4px; - border: 1px solid #e1e1e1; - background: #F6F7F7; - display: flex; - padding: 10px 12px 10px 10px; - justify-content: center; - align-items: center; - gap: 8px; - color: #383838; - font-size: 14px; - font-weight: 400; - line-height: 14px; - gap: 6px; - - &::before { - content: ""; - background-image: url("../images/icons/upload-icon.svg"); - background-repeat: no-repeat; - background-size: 100%; - background-position: center; - width: 14px; - height: 14px; - } - } - .everest-forms-custom-image-delete , .evf-image-container { - - object-fit: cover; - display: inline-flex; - position: relative; - border-radius: 8px; - height: 100px; - width: auto; - overflow: hidden; - object-fit: cover; - object-position: center; - margin:auto; - display: inline-flex; - position: relative; - justify-content: center; - cursor: pointer; - user-select: none; + li { + margin-bottom: 0; - i { + input { display: none; - } - &:hover { - &::before { - content: ""; - background: #000; - position: absolute; - width: 100%; - height: 100%; - opacity: 0.6; + &:checked ~ label { + border: 1px solid #7545bb; } + } - i { - position: absolute; - display: contents; - - &:hover { - &::before, - &::after { - transform: translate(-50%, -50%) scale(1.1); - } - } - - &::before { - content: ""; - background: #d52626; - width: 42px; - height: 42px; - position: absolute; - border-radius: 50%; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - } - - &::after { - content: "\e907"; - position: absolute; - font-size: 22px; - color: #fff; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - } + label { + display: flex; + flex-direction: column; + border: 1px solid #e1e1e1; + padding: 8px; + border-radius: 6px; + gap: 12px; + font-weight: 500; + cursor: pointer; + + img { + border: 1px solid #eee8f7; + border-radius: 4px; } } + } + } - } - } - } - } - } - - > p { - margin: 0; - font-size: 14px; - line-height: 24px; - margin-bottom: 20px; - } - } - - &-premium { - &-sidebar { - width: 300px; - max-width: 100%; - padding: 18px 10px 26px 10px; - transition: all .3s; + .description { + margin: 0; + font-size: 14px; + line-height: 20px; + } + } + } - h2 { - color: #222222; - font-size: 18px; - font-weight: 600; - line-height: 140%; - margin: 0; - padding-bottom: 16px; - margin-bottom: 20px; - border-bottom: 1px solid #EEE8F7; + &.forminp-link { + .everest_forms_send_email_test { + border-radius: 4px; + border: 1px solid #e1e1e1; + background: #f6f7f7; + padding: 4px 12px; + color: #383838; + font-weight: 500; + display: flex; + align-items: center; + justify-content: center; + gap: 6px; + width: max-content; + + &::after { + content: ""; + background-image: url("../images/icons/send-icon.svg"); + background-repeat: no-repeat; + background-size: 100%; + background-position: center; + width: 14px; + height: 14px; + } + } } - p { - margin: 0; - color: #383838; - font-size: 15px; - font-style: normal; - font-weight: 400; - line-height: 24px; + &.forminp-multiselect { + .select2-container { + width: 100% !important; + + .select2-selection { + &.select2-selection--multiple { + height: 38px; + padding: 5px; + } + + &__rendered { + display: block; + } + + &__choice { + flex-direction: row-reverse; + padding: 4px 8px 4px 10px; + margin: 0; + margin-right: 4px; + } + } + } } - h3 { - color: #383838; - font-size: 16px; - font-weight: 600; - line-height: 24px; - margin-top: 20px; - margin-bottom: 12px; + &.forminp-textarea { + textarea { + width: 100%; + border-color: #e1e1e1; + padding: 8px 12px; + } } - ul { - margin: 0; - margin-bottom: 16px; - display: flex; - flex-direction: column; - gap: 12px; + &.forminp-select { + select { + width: 100%; + height: 36px; + border-color: #e1e1e1; + padding-left: 12px; + padding-right: 12px; + + &:focus { + border-color: #7545bb; + outline: none; + box-shadow: none; + } + } + } - li { + &.forminp-color { + position: relative; + + .colorpickpreview { + width: 26px; + height: 26px; + border-radius: 3px; + position: absolute; + top: 5px; + left: 6px; + border: 1px solid #e9e9e9; + } + + input { + padding-left: 36px; + } + } + + &.forminp-image { + .evf-button { + border-radius: 4px; + border: 1px solid #e1e1e1; + background: #f6f7f7; + display: flex; + padding: 10px 12px 10px 10px; + justify-content: center; + align-items: center; + gap: 8px; color: #383838; - font-size: 15px; + font-size: 14px; font-weight: 400; - line-height: 23px; - margin-bottom: 0; - padding-left: 26px; - position: relative; + line-height: 14px; + gap: 6px; &::before { content: ""; - background-image: url("../images/icons/premium-list-check-icon.svg"); + background-image: url("../images/icons/upload-icon.svg"); background-repeat: no-repeat; - background-position: center; background-size: 100%; - width: 18px; - height: 18px; - position: absolute; - left: 0; - top: 2px; + background-position: center; + width: 14px; + height: 14px; } } - } + .everest-forms-custom-image-delete, + .evf-image-container { + object-fit: cover; + display: inline-flex; + position: relative; + border-radius: 8px; + height: 100px; + width: auto; + overflow: hidden; + object-fit: cover; + object-position: center; + margin: auto; + display: inline-flex; + position: relative; + justify-content: center; + cursor: pointer; + user-select: none; - a { - border-radius: 3px; - border: 1px solid #7545BB; - background: #7545BB; - padding: 10px 16px; - display: block; - color: #ffffff; - font-size: 14px; - font-style: normal; - font-weight: 500; - line-height: 24px; - text-decoration: none; - letter-spacing: .05px; - width: max-content; - margin: 20px 0; - transition: all .3s; + i { + display: none; + } - &:hover { - background: #9159e3; - border-color: #9159e3; + &:hover { + &::before { + content: ""; + background: #000; + position: absolute; + width: 100%; + height: 100%; + opacity: 0.6; + } + + i { + position: absolute; + display: contents; + + &:hover { + &::before, + &::after { + transform: translate(-50%, -50%) + scale(1.1); + } + } + + &::before { + content: ""; + background: #d52626; + width: 42px; + height: 42px; + position: absolute; + border-radius: 50%; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + + &::after { + content: "\e907"; + position: absolute; + font-size: 22px; + color: #fff; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + } + } } } + } + } + } + + > p { + margin: 0; + font-size: 14px; + line-height: 24px; + margin-bottom: 20px; + } + } + + &-premium { + &-sidebar { + width: 300px; + max-width: 100%; + padding: 18px 10px 26px 10px; + transition: all 0.3s; + + h2 { + color: #222222; + font-size: 18px; + font-weight: 600; + line-height: 140%; + margin: 0; + padding-bottom: 16px; + margin-bottom: 20px; + border-bottom: 1px solid #eee8f7; + } + + p { + margin: 0; + color: #383838; + font-size: 15px; + font-style: normal; + font-weight: 400; + line-height: 24px; + } + + h3 { + color: #383838; + font-size: 16px; + font-weight: 600; + line-height: 24px; + margin-top: 20px; + margin-bottom: 12px; + } - &.everest-forms-hidden { - margin-right: -325px; - display: unset; + ul { + margin: 0; + margin-bottom: 16px; + display: flex; + flex-direction: column; + gap: 12px; + + li { + color: #383838; + font-size: 15px; + font-weight: 400; + line-height: 23px; + margin-bottom: 0; + padding-left: 26px; + position: relative; + + &::before { + content: ""; + background-image: url("../images/icons/premium-list-check-icon.svg"); + background-repeat: no-repeat; + background-position: center; + background-size: 100%; + width: 18px; + height: 18px; + position: absolute; + left: 0; + top: 2px; } } - } - - .submit { - margin: 0; - padding: 0; - text-align: left; + } - .everest-forms-btn { - border-radius: 4px; - background: #7545BB; - padding: 8px 16px; - color: #ffffff; - font-size: 14px; - font-weight: 500; - line-height: 22px; - transition: all .3s ease-in-out; + a { + border-radius: 3px; + border: 1px solid #7545bb; + background: #7545bb; + padding: 10px 16px; + display: block; + color: #ffffff; + font-size: 14px; + font-style: normal; + font-weight: 500; + line-height: 24px; + text-decoration: none; + letter-spacing: 0.05px; + width: max-content; + margin: 20px 0; + transition: all 0.3s; + + &:hover { + background: #9159e3; + border-color: #9159e3; + } + } - &:hover { - background: #9159e3; - } - } - } - } - } + &.everest-forms-hidden { + margin-right: -325px; + display: unset; + } + } + } + .submit { + margin: 0; + padding: 0; + text-align: left; + + .everest-forms-btn { + border-radius: 4px; + background: #7545bb; + padding: 8px 16px; + color: #ffffff; + font-size: 14px; + font-weight: 500; + line-height: 22px; + transition: all 0.3s ease-in-out; + + &:hover { + background: #9159e3; + } + } + } + } +} - everest-forms-field-option-row-rating-icon { +everest-forms-field-option-row-rating-icon { .everest-forms-rating-icon-container { display: flex; flex-wrap: wrap; diff --git a/assets/js/admin/admin.js b/assets/js/admin/admin.js index 21036e627..6de6710cb 100644 --- a/assets/js/admin/admin.js +++ b/assets/js/admin/admin.js @@ -561,8 +561,47 @@ } }); }); - - + //Rest api settings. + if($('#everest_forms_enable_restapi').is(":checked")){ + $(document).find('.evf-restapi-key-wrapper').show(); + }else { + $(document).find('.evf-restapi-key-wrapper').hide(); + } + $('#everest_forms_enable_restapi').on('click', function(e){ + const {checked} = e.target; + if(checked) { + $(document).find('.evf-restapi-key-wrapper').show(); + }else { + $(document).find('.evf-restapi-key-wrapper').hide(); + } + }); + $('#everest_forms_restapi_keys').on('click', function(e){ + evfClearClipboard(); + evfSetClipboard( $( this ).val(), $( this ) ); + e.preventDefault(); + }).on('aftercopy', function() { + $( this ).tooltipster( 'content', $( this ).attr( 'data-copied' ) ).trigger( 'mouseenter' ).on( 'mouseleave', function() { + var $this = $( this ); + + setTimeout( function() { + $this.tooltipster( 'content', $this.attr( 'data-tip' ) ); + }, 5000 ); + } ); + }); + $('.everest-forms-generate-api-key, .everest-forms-regenerate-api-key').on('click', function(){ + let data = { + action: "everest_forms_generate_restapi_key", + security: everest_forms_admin_generate_restapi_key.ajax_restapi_key_nonce, + }; + $.ajax({ + url: everest_forms_admin_generate_restapi_key.ajax_url, + type: "post", + data:data, + success:(res)=>{ + $(document).find('#everest_forms_restapi_keys').val(res.data); + } + }) + }); diff --git a/includes/RestApi/class-evf-rest-api.php b/includes/RestApi/class-evf-rest-api.php index 9a9b43108..fbb5506f2 100644 --- a/includes/RestApi/class-evf-rest-api.php +++ b/includes/RestApi/class-evf-rest-api.php @@ -33,9 +33,12 @@ class EVF_REST_API { * @since 2.0.8.1 */ public static function init() { + // For Internal. include __DIR__ . '/controllers/version1/class-evf-modules.php'; include __DIR__ . '/controllers/version1/class-evf-changelog.php'; include __DIR__ . '/controllers/version1/class-evf-gutenberg-blocks.php'; + // For external. + include __DIR__ . '/controllers/version1/class-evf-entry-submission.php'; add_action( 'rest_api_init', array( __CLASS__, 'register_rest_routes' ) ); } @@ -90,6 +93,7 @@ protected static function get_v1_rest_classes() { 'modules' => 'EVF_Modules', 'changelog' => 'EVF_Changelog', 'gutenberg-blocks' => 'EVF_Gutenberg_Blocks', + 'entry-submission' => 'EVF_Entry_Submission', ); } } diff --git a/includes/RestApi/controllers/version1/class-evf-entry-submission.php b/includes/RestApi/controllers/version1/class-evf-entry-submission.php new file mode 100644 index 000000000..01deb448d --- /dev/null +++ b/includes/RestApi/controllers/version1/class-evf-entry-submission.php @@ -0,0 +1,292 @@ +namespace, + '/' . $this->rest_base . '/save', + array( + 'methods' => 'POST', + 'callback' => array( $this, 'save_entry' ), + 'permission_callback' => array( $this, 'check_permissions' ), + ) + ); + } + /** + * Save the entry. + * + * @since xx.xx.xx + * @param WP_REST_Request $request Full data about the request. + */ + public function save_entry( $request ) { + global $wpdb; + + $entry = $request->get_params(); + if ( empty( $entry['form_fields'] ) ) { + return new \WP_REST_Response( + array( + 'message' => esc_html__( 'No entry data found!', 'everest-forms' ), + 'data' => $entry, + ), + 400 + ); + } + + $form_id = isset( $entry['id'] ) ? absint( $entry['id'] ) : 0; + + if ( empty( $form_id ) ) { + return new \WP_REST_Response( + array( + 'message' => esc_html__( 'Form id is missing!', 'everest-forms' ), + 'data' => $entry, + ), + 400 + ); + } + + $form = evf()->form->get( $form_id ); + + if ( empty( $form ) ) { + return new \WP_REST_Response( + array( + 'message' => esc_html__( 'Form is not found!', 'everest-forms' ), + 'data' => $entry, + ), + 400 + ); + } + + $form_data = apply_filters( 'everest_forms_process_before_form_data', evf_decode( $form->post_content ), $entry ); + + if ( isset( $form_data['form_enabled'] ) && ! $form_data['form_enabled'] ) { + return new \WP_REST_Response( + array( + 'message' => esc_html__( 'Form is disalbed!', 'everest-forms' ), + 'data' => $entry, + ), + 400 + ); + } + + if ( empty( $form_data['form_fields'] ) ) { + return new \WP_REST_Response( + array( + 'message' => esc_html__( 'Form is empty!', 'everest-forms' ), + 'data' => $entry, + ), + 400 + ); + } + + if ( isset( $form_data['settings']['disabled_entries'] ) && '1' === $form_data['settings']['disabled_entries'] ) { + return new \WP_REST_Response( + array( + 'message' => esc_html__( 'Save entris is enable! Please disable to save the entry.', 'everest-forms' ), + 'data' => $entry, + ), + 400 + ); + } + + $errors = array(); + $form_fields = array(); + $entry = apply_filters( 'everest_forms_process_before_save_entry', $entry, $form_data ); + + $form_data['entry'] = $entry; + + foreach ( $entry['form_fields'] as $field_id => $field_value ) { + if ( array_key_exists( $field_id, $form_data['form_fields'] ) ) { + $field_type = $form_data['form_fields'][ $field_id ]['type']; + if ( 'signature' === $field_type ) { + $field_submit = isset( $field_value['signature_image'] ) ? $field_value['signature_image'] : ''; + } + + $exclude = array( 'title', 'html', 'captcha', 'image-upload', 'file-upload', 'divider', 'reset', 'recaptcha', 'hcaptcha', 'turnstile' ); + + if ( ! in_array( $field_type, $exclude, true ) ) { + $form_fields[ $field_id ] = array( + 'name' => sanitize_text_field( $form_data['form_fields'][ $field_id ]['label'] ), + 'value' => $field_value, + 'id' => $field_id, + 'type' => $field_type, + 'meta_key' => $form_data['form_fields'][ $field_id ]['meta-key'], + ); + + if ( 'checkbox' === $field_type ) { + $form_fields[ $field_id ]['value'] = array( + 'name' => sanitize_text_field( $form_data['form_fields'][ $field_id ]['label'] ), + 'type' => $field_type, + 'label' => $field_value, + ); + $form_fields[ $field_id ]['value_raw'] = $field_value; + } + + if ( 'likert' === $field_type ) { + $likert_rows = $form_data['form_fields'][ $field_id ]['likert_rows']; + $likert_columns = $form_data['form_fields'][ $field_id ]['likert_columns']; + $combined_value = ''; + foreach ( $field_value as $key => $value ) { + if ( array_key_exists( $key, $likert_rows ) ) { + + $combined_value .= "$likert_rows[$key]:\n"; + } + if ( array_key_exists( $key, $likert_columns ) ) { + + $combined_value .= "$likert_columns[$key]:\n"; + } + } + $form_fields[ $field_id ]['value'] = $combined_value; + $form_fields[ $field_id ]['value_raw'] = $field_value; + } + if ( 'wysiwyg' === $field_type ) { + $form_fields[ $field_id ]['value'] = wp_strip_all_tags( $field_value ); + $form_fields[ $field_id ]['value_raw'] = $field_value; + + } + + if ( 'address' === $field_type ) { + $form_fields[ $field_id ]['value'] = implode( " \n ", $field_value ); + } + + if ( 'country' === $field_type ) { + $form_fields[ $field_id ]['value'] = array( + 'type' => $field_type, + 'country_code' => $field_value, + ); + } + } + } + } + // Validate fields. + foreach ( $form_data['form_fields'] as $field ) { + $field_id = $field['id']; + $field_type = $field['type']; + + $field_value = isset( $entry['form_fields'][ $field_id ] ) ? $entry['form_fields'][ $field_id ] : ''; + do_action( "everest_forms_process_validate_{$field_type}", $field_id, $field_value, $form_data, $field_type ); + + } + + $errors = isset( evf()->task->errors[ $form_data['id'] ] ) ? evf()->task->errors[ $form_data['id'] ] : array(); + + if ( ! empty( $errors ) ) { + return new \WP_REST_Response( + array( + 'message' => esc_html__( 'Error found!!', 'everest-forms' ), + 'errors' => $errors, + ), + 400 + ); + } + + $task_instance = new EVF_Form_Task(); + $entry_id = $task_instance->entry_save( $form_fields, $entry, $form_data['id'], $form_data ); + /** + * Allow to send the email after save entry using rest api. + * + * @since xx.xx.xx + * + * @param boolean $allow The allow value. + */ + if ( $entry_id && apply_filters( 'everest_forms_allow_send_email_after_restapi_save_entry', false ) ) { + $task_instance->entry_email( $form_fields, $entry, $form_data, $entry_id, 'entry' ); + } + + return new \WP_REST_Response( + array( + 'entry_id' => $entry_id, + ), + 200 + ); + } + + /** + * Check if a given request has access to update a setting + * + * @param WP_REST_Request $request Full data about the request. + * @return WP_Error|bool + */ + public function check_permissions( $request ) { + $enable_rest_api = get_option( 'everest_forms_enable_restapi', false ); + + if ( ! evf_string_to_bool( $enable_rest_api ) ) { + return new \WP_Error( + 'unauthorized', + esc_html__( 'Contact your administrator to enable REST API access', 'everest-forms' ), + array( 'status' => 401 ) + ); + } + + $api_key = get_option( 'everest_forms_restapi_keys', '' ); + + if ( '' === $api_key ) { + return new \WP_Error( + 'unauthorized', + esc_html__( 'Contact your administrator to generate the api key.', 'everest-forms' ), + array( 'status' => 401 ) + ); + } + + $headers = $request->get_headers(); + + if ( ! isset( $headers['api_key'] ) ) { + return new \WP_Error( + 'unauthorized', + esc_html__( 'Missing api key!', 'everest-forms' ), + array( 'status' => 401 ) + ); + } + + if ( ! isset( $headers['api_key'][0] ) || empty( $headers['api_key'][0] ) ) { + return new \WP_Error( + 'unauthorized', + esc_html__( 'Empty api key!', 'everest-forms' ), + array( 'status' => 401 ) + ); + } + + if ( $headers['api_key'][0] === $api_key ) { + return true; + } + + return new \WP_Error( + 'unauthorized', + esc_html__( 'Unauthorized api key.', 'everest-forms' ), + array( 'status' => 401 ) + ); + } +} diff --git a/includes/admin/class-evf-admin-assets.php b/includes/admin/class-evf-admin-assets.php index a3524bf41..039a333dc 100644 --- a/includes/admin/class-evf-admin-assets.php +++ b/includes/admin/class-evf-admin-assets.php @@ -72,7 +72,7 @@ public function admin_scripts() { $suffix = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ? '' : '.min'; // Register scripts. - wp_register_script( 'everest-forms-admin', evf()->plugin_url() . '/assets/js/admin/admin' . $suffix . '.js', array( 'jquery', 'jquery-blockui', 'jquery-ui-sortable', 'jquery-ui-widget', 'jquery-ui-core', 'tooltipster', 'wp-color-picker', 'perfect-scrollbar' ), EVF_VERSION, true ); + wp_register_script( 'everest-forms-admin', evf()->plugin_url() . '/assets/js/admin/admin' . $suffix . '.js', array( 'jquery', 'jquery-blockui', 'jquery-ui-sortable', 'jquery-ui-widget', 'jquery-ui-core', 'tooltipster', 'wp-color-picker', 'perfect-scrollbar', 'evf-clipboard' ), EVF_VERSION, true ); wp_register_script( 'everest-forms-extensions', evf()->plugin_url() . '/assets/js/admin/extensions' . $suffix . '.js', array( 'jquery', 'updates', 'wp-i18n' ), EVF_VERSION, true ); wp_register_script( 'everest-forms-email-admin', evf()->plugin_url() . '/assets/js/admin/evf-admin-email' . $suffix . '.js', array( 'jquery', 'jquery-blockui', 'jquery-ui-sortable', 'jquery-ui-widget', 'jquery-ui-core', 'tooltipster', 'wp-color-picker', 'perfect-scrollbar' ), EVF_VERSION, true ); wp_register_script( 'everest-forms-editor', evf()->plugin_url() . '/assets/js/admin/editor' . $suffix . '.js', array( 'jquery' ), EVF_VERSION, true ); @@ -303,6 +303,15 @@ public function admin_scripts() { ) ); + wp_localize_script( + 'everest-forms-admin', + 'everest_forms_admin_generate_restapi_key', + array( + 'ajax_restapi_key_nonce' => wp_create_nonce( 'process-restapi-api-ajax-nonce' ), + 'ajax_url' => admin_url( 'admin-ajax.php', 'relative' ), + ) + ); + wp_localize_script( 'everest-forms-admin', 'everest_forms_admin_form_migrator', diff --git a/includes/admin/class-evf-admin-settings.php b/includes/admin/class-evf-admin-settings.php index c5f6b690c..7adf695c9 100644 --- a/includes/admin/class-evf-admin-settings.php +++ b/includes/admin/class-evf-admin-settings.php @@ -870,6 +870,39 @@ class=" +
+ +
+ + +
+ generate'; + } else { + echo ''; + } + ?> +
+
+
+ 'no', 'desc_tip' => true, ), + array( + 'title' => esc_html__( 'Enable RestApi', 'everest-forms' ), + 'desc' => __( 'Allow the other to use the rest api.', 'everest-forms' ), + 'id' => 'everest_forms_enable_restapi', + 'type' => 'toggle', + 'default' => 'no', + 'desc_tip' => true, + ), + array( + 'title' => esc_html__( 'RestApi Key', 'everest-forms' ), + 'desc' => __( 'List of api key.These are used to authenticate the request.', 'everest-forms' ), + 'id' => 'everest_forms_restapi_keys', + 'type' => 'restapi_key', + 'default' => '', + 'desc_tip' => true, + 'css' => 'width=500px !important;', + 'class' => 'evf-restapi-key', + ), array( 'type' => 'sectionend', 'id' => 'misc_options', diff --git a/includes/class-evf-ajax.php b/includes/class-evf-ajax.php index d84deedd2..ca2d617ce 100644 --- a/includes/class-evf-ajax.php +++ b/includes/class-evf-ajax.php @@ -132,6 +132,7 @@ public static function add_ajax_events() { 'send_routine_report_test_email' => false, 'map_csv' => false, 'import_entries' => false, + 'generate_restapi_key' => false, ); foreach ( $ajax_events as $ajax_event => $nopriv ) { @@ -1669,6 +1670,24 @@ public static function import_entries() { ); } } + /** + * Generate the restapi key + * + * @since xx.xx.xx + */ + public static function generate_restapi_key() { + try { + check_ajax_referer( 'process-restapi-api-ajax-nonce', 'security' ); + $key = generate_api_key(); + wp_send_json_success( $key ); + } catch ( Exception $e ) { + wp_send_json_error( + array( + 'message' => $e->getMessage(), + ) + ); + } + } } EVF_AJAX::init(); diff --git a/includes/class-evf-form-task.php b/includes/class-evf-form-task.php index 0249ad1f1..43de6617e 100644 --- a/includes/class-evf-form-task.php +++ b/includes/class-evf-form-task.php @@ -1025,7 +1025,7 @@ public function entry_save( $fields, $entry, $form_id, $form_data = array() ) { $entry_id = false; $status = isset( $entry['evf_spam_status'] ) ? $entry['evf_spam_status'] : 'publish'; $admin_approval_entries = get_option( 'everest_forms_admin_approval_entries_enable', 'no' ); - $settings = $this->form_data['settings']; + $settings = isset( $form_data['settings'] ) ? $form_data['settings'] : array(); $evf_form_admin_approval_entries = isset( $settings['enable_admin_approval_entries'] ) ? $settings['enable_admin_approval_entries'] : '0'; if ( 'yes' === $admin_approval_entries && '1' === $evf_form_admin_approval_entries ) { diff --git a/includes/evf-core-functions.php b/includes/evf-core-functions.php index 4beefa4b1..e7f07e85a 100644 --- a/includes/evf-core-functions.php +++ b/includes/evf-core-functions.php @@ -5604,7 +5604,17 @@ function evf_get_next_key_array( $arr, $key ) { return isset( $next_key ) ? $next_key : '' ; } +/** + * Function to generate the api key base on the string. + * + * @since xx.xx.xx + * @param $string The string value. + */ +function generate_api_key( $string = 'evf_restapi', $length = 32 ) { + $key = bin2hex( random_bytes( $length ) ); + return $key; +} add_action( 'wp_mail_failed', 'evf_email_send_failed_handler', 1 );