add canny link for new field

weDevsOfficial · Jan 2, 2025 · 579dba6 · 579dba6
1 parent 5139424
commit 579dba6
Show file tree

Hide file tree

Showing 8 changed files with 62 additions and 8 deletions.
diff --git a/admin/form-builder/assets/js/components/form-fields-v4-1/index.js b/admin/form-builder/assets/js/components/form-fields-v4-1/index.js
@@ -41,7 +41,7 @@ Vue.component('form-fields-v4-1', {
             });
 
             buttons.draggable({
-                connectToSortable: '#form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
+                connectToSortable: '#form-preview-stage, #form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
                 helper: 'clone',
                 revert: 'invalid',
                 cancel: '.button-faded',
@@ -119,7 +119,7 @@ Vue.component('form-fields-v4-1', {
                 });
 
                 buttons.draggable({
-                    connectToSortable: '#form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
+                    connectToSortable: '#form-preview-stage, #form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
                     helper: 'clone',
                     revert: 'invalid',
                     cancel: '.button-faded',

diff --git a/admin/form-builder/assets/js/components/form-fields-v4-1/template.php b/admin/form-builder/assets/js/components/form-fields-v4-1/template.php
@@ -108,5 +108,20 @@ class="wpuf-shrink-0 wpuf-mr-2">
                 </div>
             </div>
         </template>
+
+        <div class="wpuf-mt-12 wpuf-p-6 wpuf-rounded-lg wpuf-shadow-md wpuf-text-center">
+            <h2 class="wpuf-text-slate-600 wpuf-text-xl wpuf-font-bold wpuf-mb-4">
+                <?php esc_html_e( 'Got an idea for a new field?', 'wp-user-frontend' ); ?>
+            </h2>
+            <p class="wpuf-text-slate-600 wpuf-mb-6">
+                <?php esc_html_e( 'We\'d love to hear it!', 'wp-user-frontend' ); ?>
+            </p>
+            <a
+                class="wpuf-btn-primary"
+               target="_blank"
+                href="<?php echo esc_url( 'https://wpuf.canny.io/ideas' ); ?>">
+                <?php esc_html_e( 'Share Your Idea', 'wp-user-frontend' ); ?>
+            </a>
+        </div>
     </div>
 </div>
diff --git a/admin/form-builder/assets/js/components/form-fields/index.js b/admin/form-builder/assets/js/components/form-fields/index.js
@@ -23,7 +23,7 @@ Vue.component('form-fields', {
     mounted: function () {
         // bind jquery ui draggable
         $(this.$el).find('.panel-form-field-buttons .button').draggable({
-            connectToSortable: '#form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
+            connectToSortable: '#form-preview-stage, #form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
             helper: 'clone',
             revert: 'invalid',
             cancel: '.button-faded',

diff --git a/assets/css/admin/form-builder.css b/assets/css/admin/form-builder.css
@@ -2120,6 +2120,14 @@ input.wpuf-tab:checked + .wpuf-tab-content,
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
+.wpuf-btn-primary:focus {
+  --tw-text-opacity: 1;
+  color: rgb(255 255 255 / var(--tw-text-opacity));
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
 .wpuf-btn-secondary {
   border-radius: 0.375rem;
   border-width: 1px;
@@ -3710,6 +3718,11 @@ input.wpuf-tab:checked + .wpuf-tab-content,
   line-height: 1.25rem;
 }
 
+.wpuf-text-xl {
+  font-size: 1.25rem;
+  line-height: 1.75rem;
+}
+
 .wpuf-text-xs {
   font-size: 0.75rem;
   line-height: 1rem;
@@ -3844,6 +3857,11 @@ input.wpuf-tab:checked + .wpuf-tab-content,
   color: rgb(185 28 28 / var(--tw-text-opacity));
 }
 
+.wpuf-text-slate-600 {
+  --tw-text-opacity: 1;
+  color: rgb(71 85 105 / var(--tw-text-opacity));
+}
+
 .wpuf-text-slate-700 {
   --tw-text-opacity: 1;
   color: rgb(51 65 85 / var(--tw-text-opacity));
@@ -3906,6 +3924,12 @@ input.wpuf-tab:checked + .wpuf-tab-content,
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
+.wpuf-shadow-md {
+  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
 .wpuf-shadow-none {
   --tw-shadow: 0 0 #0000;
   --tw-shadow-colored: 0 0 #0000;

diff --git a/assets/js-templates/form-components.php b/assets/js-templates/form-components.php
@@ -1155,6 +1155,21 @@ class="wpuf-shrink-0 wpuf-mr-2">
                 </div>
             </div>
         </template>
+
+        <div class="wpuf-mt-12 wpuf-p-6 wpuf-rounded-lg wpuf-shadow-md wpuf-text-center">
+            <h2 class="wpuf-text-slate-600 wpuf-text-xl wpuf-font-bold wpuf-mb-4">
+                <?php esc_html_e( 'Got an idea for a new field?', 'wp-user-frontend' ); ?>
+            </h2>
+            <p class="wpuf-text-slate-600 wpuf-mb-6">
+                <?php esc_html_e( 'We\'d love to hear it!', 'wp-user-frontend' ); ?>
+            </p>
+            <a
+                class="wpuf-btn-primary"
+               target="_blank"
+                href="<?php echo esc_url( 'https://wpuf.canny.io/ideas' ); ?>">
+                <?php esc_html_e( 'Share Your Idea', 'wp-user-frontend' ); ?>
+            </a>
+        </div>
     </div>
 </div>
 </script>

diff --git a/assets/js/wpuf-form-builder-components.js b/assets/js/wpuf-form-builder-components.js
@@ -1489,7 +1489,7 @@ Vue.component('form-fields', {
     mounted: function () {
         // bind jquery ui draggable
         $(this.$el).find('.panel-form-field-buttons .button').draggable({
-            connectToSortable: '#form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
+            connectToSortable: '#form-preview-stage, #form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
             helper: 'clone',
             revert: 'invalid',
             cancel: '.button-faded',
@@ -1588,7 +1588,7 @@ Vue.component('form-fields-v4-1', {
             });
 
             buttons.draggable({
-                connectToSortable: '#form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
+                connectToSortable: '#form-preview-stage, #form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
                 helper: 'clone',
                 revert: 'invalid',
                 cancel: '.button-faded',
@@ -1666,7 +1666,7 @@ Vue.component('form-fields-v4-1', {
                 });
 
                 buttons.draggable({
-                    connectToSortable: '#form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
+                    connectToSortable: '#form-preview-stage, #form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
                     helper: 'clone',
                     revert: 'invalid',
                     cancel: '.button-faded',

diff --git a/assets/js/wpuf-form-builder-wpuf-forms.js b/assets/js/wpuf-form-builder-wpuf-forms.js
@@ -119,7 +119,7 @@
                     });
 
                     buttons.draggable({
-                        connectToSortable: '#form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
+                        connectToSortable: '#form-preview-stage, #form-preview-stage .wpuf-form, .wpuf-column-inner-fields .wpuf-column-fields-sortable-list',
                         helper: 'clone',
                         revert: 'invalid',
                         cancel: '.button-faded',

diff --git a/src/css/admin/form-builder.css b/src/css/admin/form-builder.css
@@ -4,7 +4,7 @@
 
 @layer components {
     .wpuf-btn-primary {
-        @apply wpuf-rounded-md wpuf-bg-green-800 wpuf-text-white hover:wpuf-bg-green-700 hover:wpuf-text-white wpuf-px-3.5 wpuf-py-2 wpuf-text-sm wpuf-font-semibold;
+        @apply wpuf-rounded-md wpuf-bg-green-800 wpuf-text-white wpuf-px-3.5 wpuf-py-2 wpuf-text-sm wpuf-font-semibold hover:wpuf-bg-green-700 hover:wpuf-text-white focus:wpuf-text-white focus:wpuf-shadow-none;
     }
 
     .wpuf-btn-secondary {