fix

app/design/frontend/Joshine/breeze/etc/view.xml

@@ -97,7 +97,7 @@
 
 
             <image id="swatch_image" type="swatch_image">
             <image id="swatch_image" type="swatch_image">
                 <width>40</width>
                 <width>40</width>
-                <height>50</height>
+                <height>40</height>
             </image>
             </image>
 
 
             <!-- These lists use category_page_grid fallback. Not need to declare srcset for them -->
             <!-- These lists use category_page_grid fallback. Not need to declare srcset for them -->

app/design/frontend/Joshine/breeze/web/css/_custom.less

@@ -1657,10 +1657,10 @@ button.action.submit.primary {
   }
   }
 
 
 }
 }
-.swatch-option.color, .swatch-option.text, .swatch-option.image{
-  width: 40px !important;
-  height: 40px !important;
-}
+//.swatch-option.color, .swatch-option.text, .swatch-option.image{
+//  width: 40px !important;
+//  height: 40px !important;
+//}
 
 
 //色块强制大小
 //色块强制大小
 #product-options-wrapper .swatch-option.image{
 #product-options-wrapper .swatch-option.image{

app/design/frontend/Joshine/breeze/web/js/breeze/components/swatch-renderer.js

@@ -306,8 +306,8 @@
                 isInProductView = false;
                 isInProductView = false;
 
 
             productId = this.element.parents('.product-item-info')
             productId = this.element.parents('.product-item-info')
-                    .find('.price-box.price-final_price')
-                    .attr('data-product-id');
+                .find('.price-box.price-final_price')
+                .attr('data-product-id');
 
 
             if (!productId) {
             if (!productId) {
                 // Check individual product.
                 // Check individual product.
@@ -368,16 +368,16 @@
                 // Create new control
                 // Create new control
                 container.append(
                 container.append(
                     '<div class="' + classes.attributeClass + ' ' + item.code + '" ' +
                     '<div class="' + classes.attributeClass + ' ' + item.code + '" ' +
-                         'data-attribute-code="' + item.code + '" ' +
-                         'data-attribute-id="' + item.id + '">' +
-                        label +
-                        '<div aria-activedescendant="" ' +
-                             'aria-invalid="false" ' +
-                             'aria-required="true" ' +
-                             'role="listbox" ' + listLabel +
-                             'class="' + classes.attributeOptionsWrapper + ' clearfix">' +
-                            options + select +
-                        '</div>' + input +
+                    'data-attribute-code="' + item.code + '" ' +
+                    'data-attribute-id="' + item.id + '">' +
+                    label +
+                    '<div aria-activedescendant="" ' +
+                    'aria-invalid="false" ' +
+                    'aria-required="true" ' +
+                    'role="listbox" ' + listLabel +
+                    'class="' + classes.attributeOptionsWrapper + ' clearfix">' +
+                    options + select +
+                    '</div>' + input +
                     '</div>'
                     '</div>'
                 );
                 );
 
 
@@ -509,7 +509,8 @@
                 } else if (type === 2) {
                 } else if (type === 2) {
                     // Image
                     // Image
                     html += '<div class="' + optionClass + ' image" ' + attr +
                     html += '<div class="' + optionClass + ' image" ' + attr +
-                        ' style="background: url(' + value + ') no-repeat center; background-size: initial;' + '">' + '' +
+                        ' style="background: url(' + value + ') no-repeat center; background-size: initial;width:' +
+                        swatchImageWidth + 'px; height:' + swatchImageHeight + 'px">' + '' +
                         '</div>';
                         '</div>';
                 } else if (type === 3) {
                 } else if (type === 3) {
                     // Clear
                     // Clear
@@ -624,8 +625,8 @@
          */
          */
         _loadMedia: function () {
         _loadMedia: function () {
             var $main = this.inProductList ?
             var $main = this.inProductList ?
-                    this.element.parents('.product-item-info') :
-                    this.element.parents('.column.main'),
+                this.element.parents('.product-item-info') :
+                this.element.parents('.column.main'),
                 images;
                 images;
 
 
             if (this.options.useAjax) {
             if (this.options.useAjax) {
@@ -749,7 +750,7 @@
          */
          */
         _toggleCheckedAttributes: function ($this, $wrapper) {
         _toggleCheckedAttributes: function ($this, $wrapper) {
             $wrapper.attr('aria-activedescendant', $this.attr('id'))
             $wrapper.attr('aria-activedescendant', $this.attr('id'))
-                    .find('.' + this.options.classes.optionClass).attr('aria-checked', false);
+                .find('.' + this.options.classes.optionClass).attr('aria-checked', false);
             $this.attr('aria-checked', true);
             $this.attr('aria-checked', true);
         },
         },