diff --git a/app/views/admin/products_v3/_table.html.haml b/app/views/admin/products_v3/_table.html.haml index 4ad0d5663e..c508972722 100644 --- a/app/views/admin/products_v3/_table.html.haml +++ b/app/views/admin/products_v3/_table.html.haml @@ -49,10 +49,13 @@ %tbody.relaxed{ 'data-record-id': product_form.object.id } %tr %td.with-image - .image-field - = image_tag product.image&.url(:mini) || Spree::Image.default_image_url(:mini), width: 40, height: 40 - - if product.image.present? - = link_to t('admin.products_page.image.edit'), edit_admin_product_image_path(product, product.image), class: "button secondary mini", "data-controller": "modal", "data-reflex": "click->products#edit_image", "data-current-id": product.id + - if product.image.present? + %a.image-field{ href: edit_admin_product_image_path(product, product.image), data: { controller: "modal", reflex: "click->products#edit_image", "current-id": product.id} } + = image_tag product.image&.url(:mini), width: 40, height: 40 + .button.secondary.mini= t('admin.products_page.image.edit') + - else + .image-field + = image_tag Spree::Image.default_image_url(:mini), width: 40, height: 40 %td.field.align-left.header = product_form.hidden_field :id = product_form.text_field :name, 'aria-label': t('admin.products_page.columns.name') diff --git a/app/webpacker/css/admin/products_v3.scss b/app/webpacker/css/admin/products_v3.scss index c03f8ee016..6316027db0 100644 --- a/app/webpacker/css/admin/products_v3.scss +++ b/app/webpacker/css/admin/products_v3.scss @@ -88,10 +88,6 @@ height: 100%; } } - - .image-field .button { - display: block; - } } th, @@ -379,7 +375,7 @@ } } - .image-field { + a.image-field { position: relative; img { @@ -388,10 +384,18 @@ } .button { - display: none; // to be shown on tr:hover + display: none; // to be shown on hover position: absolute; bottom: 0; left: 0; } + + &:hover, + &:focus { + .button.secondary { + display: block; + background-color: $color-btn-secondary-hover-bg; + } + } } }