From aa9f072a5073f9a699e670db0631086b2519852d Mon Sep 17 00:00:00 2001
From: Sapayth Hossain <sapayth@users.noreply.github.com>
Date: Mon, 25 Nov 2024 17:41:06 +0600
Subject: [PATCH] icon for featured image

---
 .../assets/js/components/builder-stage/template.php    |  2 +-
 .../js/components/form-featured_image/template.php     |  6 +++++-
 assets/css/admin/form-builder.css                      | 10 ++++++++++
 assets/js-templates/form-components.php                |  8 ++++++--
 4 files changed, 22 insertions(+), 4 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
index 3e77ad7c..4471b0c4 100644
--- a/admin/form-builder/assets/js/components/builder-stage/template.php
+++ b/admin/form-builder/assets/js/components/builder-stage/template.php
@@ -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 wpuf-flex wpuf-justify-around">
                 <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">
diff --git a/admin/form-builder/assets/js/components/form-featured_image/template.php b/admin/form-builder/assets/js/components/form-featured_image/template.php
index 81c8d7ab..9785cd68 100644
--- a/admin/form-builder/assets/js/components/form-featured_image/template.php
+++ b/admin/form-builder/assets/js/components/form-featured_image/template.php
@@ -1,11 +1,15 @@
 <div class="wpuf-fields">
     <div :id="'wpuf-img_label-' + field.id + '-upload-container'">
         <div class="wpuf-attachment-upload-filelist" data-type="file" data-required="yes">
-            <a :class="builder_class_names('upload_btn')" href="#">
+            <a class="wpuf-inline-flex wpuf-items-center wpuf-gap-x-1.5"
+               :class="builder_class_names('upload_btn')" href="#">
                 <template v-if="field.button_label === ''">
                     <?php _e( 'Select Image', 'wp-user-frontend' ); ?>
                 </template>
                 <template v-else>
+                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="wpuf-size-5">
+                        <path stroke-linecap="round" stroke-linejoin="round" d="m2.25 15.75 5.159-5.159a2.25 2.25 0 0 1 3.182 0l5.159 5.159m-1.5-1.5 1.409-1.409a2.25 2.25 0 0 1 3.182 0l2.909 2.909m-18 3.75h16.5a1.5 1.5 0 0 0 1.5-1.5V6a1.5 1.5 0 0 0-1.5-1.5H3.75A1.5 1.5 0 0 0 2.25 6v12a1.5 1.5 0 0 0 1.5 1.5Zm10.5-11.25h.008v.008h-.008V8.25Zm.375 0a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Z" />
+                    </svg>
                     {{ field.button_label }}
                 </template>
             </a>
diff --git a/assets/css/admin/form-builder.css b/assets/css/admin/form-builder.css
index a9168a8f..80c3c0bb 100644
--- a/assets/css/admin/form-builder.css
+++ b/assets/css/admin/form-builder.css
@@ -2157,6 +2157,11 @@ html {
   height: 1rem;
 }
 
+.wpuf-size-5 {
+  width: 1.25rem;
+  height: 1.25rem;
+}
+
 .wpuf-h-0 {
   height: 0px;
 }
@@ -2532,6 +2537,11 @@ html {
   gap: 1rem;
 }
 
+.wpuf-gap-x-1\.5 {
+  -moz-column-gap: 0.375rem;
+       column-gap: 0.375rem;
+}
+
 .wpuf-gap-x-2 {
   -moz-column-gap: 0.5rem;
        column-gap: 0.5rem;
diff --git a/assets/js-templates/form-components.php b/assets/js-templates/form-components.php
index 4d8a3e31..d07d6e17 100644
--- a/assets/js-templates/form-components.php
+++ b/assets/js-templates/form-components.php
@@ -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 wpuf-flex wpuf-justify-around">
                 <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">
@@ -761,11 +761,15 @@ class="wpuf-block wpuf-w-full wpuf-min-w-full wpuf-rounded-md wpuf-py-1.5 wpuf-t
 <div class="wpuf-fields">
     <div :id="'wpuf-img_label-' + field.id + '-upload-container'">
         <div class="wpuf-attachment-upload-filelist" data-type="file" data-required="yes">
-            <a :class="builder_class_names('upload_btn')" href="#">
+            <a class="wpuf-inline-flex wpuf-items-center wpuf-gap-x-1.5 "
+               :class="builder_class_names('upload_btn')" href="#">
                 <template v-if="field.button_label === ''">
                     <?php _e( 'Select Image', 'wp-user-frontend' ); ?>
                 </template>
                 <template v-else>
+                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="wpuf-size-5">
+                        <path stroke-linecap="round" stroke-linejoin="round" d="m2.25 15.75 5.159-5.159a2.25 2.25 0 0 1 3.182 0l5.159 5.159m-1.5-1.5 1.409-1.409a2.25 2.25 0 0 1 3.182 0l2.909 2.909m-18 3.75h16.5a1.5 1.5 0 0 0 1.5-1.5V6a1.5 1.5 0 0 0-1.5-1.5H3.75A1.5 1.5 0 0 0 2.25 6v12a1.5 1.5 0 0 0 1.5 1.5Zm10.5-11.25h.008v.008h-.008V8.25Zm.375 0a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Z" />
+                    </svg>
                     {{ field.button_label }}
                 </template>
             </a>