👌 IMPROVE: Updated admin settings

Author: robertdevore

admin/clwc-admin-settings.php

@@ -273,6 +273,14 @@ function clwc_wysiwyg_field( $args ) {
     wp_editor( wp_kses_post( $args['value'] ), $args['name'], [ 'textarea_name' => esc_attr( $args['name'] ) ] );
 }
 
+/**
+ * Render image upload field.
+ *
+ * @param array $args Field arguments.
+ * 
+ * @since  2.0.0
+ * @return void
+ */
 /**
  * Render image upload field.
  *
@@ -282,39 +290,42 @@ function clwc_wysiwyg_field( $args ) {
  * @return void
  */
 function clwc_image_upload_field( $args ) {
-    $image_id = intval( $args['value'] );
+    $image_id  = intval( $args['value'] );
     $image_url = $image_id ? wp_get_attachment_url( $image_id ) : '';
 
+    echo '<div class="clwc-image-upload-wrapper" style="display: flex; flex-direction: column; align-items: center; background: #fff; padding: 15px; border: 1px solid #ddd; border-radius: 5px; max-width: 200px;">';
+
     // Hidden field to store the image ID.
     printf(
         '<input type="hidden" name="%1$s" value="%2$s" class="clwc-image-id" />',
         esc_attr( $args['name'] ),
         esc_attr( $image_id )
     );
 
-    // Image preview (only displayed if an image is set).
+    // Image preview (displayed only if an image is set).
     if ( $image_url ) {
         printf(
-            '<img src="%s" style="max-width:150px;display:block;margin-top:10px;" class="clwc-image-preview" />',
+            '<img src="%s" style="max-width:150px; margin-bottom: 10px;" class="clwc-image-preview" />',
             esc_url( $image_url )
         );
     } else {
-        // Placeholder (or hidden image preview if no image is set).
-        echo '<img src="" style="max-width:150px;display:none;margin-top:10px;" class="clwc-image-preview" />';
+        echo '<img src="" style="max-width:150px; display:none; margin-bottom: 10px;" class="clwc-image-preview" />';
     }
 
     // Button to open media uploader.
     printf(
-        '<button type="button" class="button clwc-upload-image-button">%s</button>',
+        '<button type="button" class="button clwc-upload-image-button" style="margin: 5px 0;">%s</button>',
         esc_html__( 'Upload Image', 'customer-loyalty-for-woocommerce' )
     );
 
     // Button to remove image.
     printf(
-        '<button type="button" class="button clwc-remove-image-button" style="display:%s;">%s</button>',
+        '<button type="button" class="button clwc-remove-image-button" style="display:%s; margin: 5px 0;">%s</button>',
         $image_url ? 'inline-block' : 'none',
         esc_html__( 'Remove Image', 'customer-loyalty-for-woocommerce' )
     );
+
+    echo '</div>';
 }
 
 /**