fix action buttons move action

weDevsOfficial · Nov 25, 2024 · aa1c0d8 · aa1c0d8
1 parent 4443867
commit aa1c0d8
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 10 deletions.
diff --git a/admin/form-builder/assets/js/components/builder-stage/template.php b/admin/form-builder/assets/js/components/builder-stage/template.php
@@ -3,8 +3,8 @@
         <?php _e( 'Add fields by dragging the fields from the right sidebar to this area.', 'wp-user-frontend' ); ?>
     </h4>
     <ul
-        :class="['wpuf-form', 'sortable-list', 'form-label-' + label_type]"
-        class="wpuf-py-8">
+        :class="['form-label-' + label_type]"
+        class="wpuf-form sortable-list wpuf-py-8">
         <li
             v-for="(field, index) in form_fields"
             :key="field.id"
@@ -51,7 +51,7 @@ class="wpuf-text-gray-700 wpuf-text-base"><strong>{{ get_field_name( field.templ
                 :field="field">
             </component>
             <div
-                class="control-buttons wpuf-opacity-0 group-hover:wpuf-opacity-100 wpuf-rounded-b-lg wpuf-bg-green-600 wpuf-flex wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
+                class="control-buttons wpuf-opacity-0 group-hover:wpuf-opacity-100 wpuf-rounded-b-lg !wpuf-bg-green-600 wpuf-flex wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
                 <div class="wpuf-flex wpuf-justify-around wpuf-text-green-200">
                     <template v-if="!is_failed_to_validate(field.template)">
                             <span :class="action_button_classes">
@@ -130,7 +130,7 @@ class="wpuf-flex wpuf-bg-gray-50 wpuf-p-4 wpuf-rounded-t-md wpuf-border-transpar
                     <strong><?php esc_html_e( 'value', 'wp-user-frontend' ); ?></strong>: {{ field.meta_value }}
                 </div>
                 <div
-                    class="control-buttons wpuf-opacity-0 group-hover:wpuf-opacity-100 wpuf-rounded-b-lg wpuf-bg-green-600  wpuf-flex wpuf-justify-around wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
+                    class="control-buttons wpuf-opacity-0 group-hover:wpuf-opacity-100 wpuf-rounded-b-lg !wpuf-bg-green-600 wpuf-flex wpuf-justify-around wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
                     <div class="wpuf-flex wpuf-items-center wpuf-text-green-200">
                         <template v-if="!is_failed_to_validate(field.template)">
                                 <span

diff --git a/admin/form-builder/assets/js/components/form-column_field/template.php b/admin/form-builder/assets/js/components/form-column_field/template.php
@@ -56,7 +56,7 @@ class="wpuf-text-gray-700 wpuf-text-base"><strong>{{ get_field_name( field.templ
                         </div>
                     </div>
                     <div
-                        class="control-buttons wpuf-opacity-0 group-hover/column-inner:wpuf-opacity-100 wpuf-rounded-b-lg wpuf-bg-green-600 wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
+                        class="wpuf-column-field-control-buttons wpuf-opacity-0 group-hover/column-inner:wpuf-opacity-100 wpuf-rounded-b-lg wpuf-bg-green-600 wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
                         <div class="wpuf-items-center wpuf-text-green-200 wpuf-flex wpuf-justify-evenly wpuf-p-1">
                             <template v-if="!is_failed_to_validate(field.template)">
                             <span :class="action_button_classes">

diff --git a/assets/css/admin/form-builder.css b/assets/css/admin/form-builder.css
@@ -2749,6 +2749,11 @@ html {
   border-color: transparent;
 }
 
+.\!wpuf-bg-green-600 {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(22 163 74 / var(--tw-bg-opacity)) !important;
+}
+
 .wpuf-bg-amber-500 {
   --tw-bg-opacity: 1;
   background-color: rgb(245 158 11 / var(--tw-bg-opacity));

diff --git a/assets/js-templates/form-components.php b/assets/js-templates/form-components.php
@@ -4,8 +4,8 @@
         <?php _e( 'Add fields by dragging the fields from the right sidebar to this area.', 'wp-user-frontend' ); ?>
     </h4>
     <ul
-        :class="['wpuf-form', 'sortable-list', 'form-label-' + label_type]"
-        class="wpuf-py-8">
+        :class="['form-label-' + label_type]"
+        class="wpuf-form sortable-list wpuf-py-8">
         <li
             v-for="(field, index) in form_fields"
             :key="field.id"
@@ -52,7 +52,7 @@ class="wpuf-text-gray-700 wpuf-text-base"><strong>{{ get_field_name( field.templ
                 :field="field">
             </component>
             <div
-                class="control-buttons wpuf-opacity-0 group-hover:wpuf-opacity-100 wpuf-rounded-b-lg wpuf-bg-green-600 wpuf-flex wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
+                class="control-buttons wpuf-opacity-0 group-hover:wpuf-opacity-100 wpuf-rounded-b-lg !wpuf-bg-green-600 wpuf-flex wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
                 <div class="wpuf-flex wpuf-justify-around wpuf-text-green-200">
                     <template v-if="!is_failed_to_validate(field.template)">
                             <span :class="action_button_classes">
@@ -131,7 +131,7 @@ class="wpuf-flex wpuf-bg-gray-50 wpuf-p-4 wpuf-rounded-t-md wpuf-border-transpar
                     <strong><?php esc_html_e( 'value', 'wp-user-frontend' ); ?></strong>: {{ field.meta_value }}
                 </div>
                 <div
-                    class="control-buttons wpuf-opacity-0 group-hover:wpuf-opacity-100 wpuf-rounded-b-lg wpuf-bg-green-600  wpuf-flex wpuf-justify-around wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
+                    class="control-buttons wpuf-opacity-0 group-hover:wpuf-opacity-100 wpuf-rounded-b-lg !wpuf-bg-green-600 wpuf-flex wpuf-justify-around wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
                     <div class="wpuf-flex wpuf-items-center wpuf-text-green-200">
                         <template v-if="!is_failed_to_validate(field.template)">
                                 <span
@@ -646,7 +646,7 @@ class="wpuf-text-gray-700 wpuf-text-base"><strong>{{ get_field_name( field.templ
                         </div>
                     </div>
                     <div
-                        class="control-buttons wpuf-opacity-0 group-hover/column-inner:wpuf-opacity-100 wpuf-rounded-b-lg wpuf-bg-green-600 wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
+                        class="wpuf-column-field-control-buttons wpuf-opacity-0 group-hover/column-inner:wpuf-opacity-100 wpuf-rounded-b-lg wpuf-bg-green-600 wpuf-items-center wpuf-transition wpuf-duration-150 wpuf-ease-out">
                         <div class="wpuf-items-center wpuf-text-green-200 wpuf-flex wpuf-justify-evenly wpuf-p-1">
                             <template v-if="!is_failed_to_validate(field.template)">
                             <span :class="action_button_classes">