Shopify Collection thumbnail:hover image swap

product-grid-item.liquid

<a href="{{ product.url | within: collection }}">
  {% assign imgSize = 'medium' %}
  {% assign canSwap = false %}
  {% if product.images.size > 1 %}
    {% assign canSwap = true %}
    {% assign swapImg = product.images[1] %}
    {% assign swapImgSrc = swapImg.src | product_img_url: imgSize %}
    {% assign swapImgAlt = swapImg.alt | escape %}
  {% endif %}
  <img{% if canSwap %} class="has-swap"{% endif %} src="{{ product.featured_image.src | product_img_url: imgSize }}" alt="{{ product.featured_image.alt | escape }}">
  {% if canSwap %}
    <img class="swap" src="{{ swapImgSrc }}" alt="{{ swapImgAlt }}">
  {% endif %}
</a>

swap-image.scss

a{
  .swap{ display:none;}
  &:hover{
    .has-swap { display:none;}
    .swap{ display:block;}
  }
}