Lucid One - Variant Image Thumbnail

Lucid One - Variant Image Thumbnail

<!-- PRODUCT IMAGES (TABLET & DESKTOP) -->
<div class="span6{% unless settings.show_breadcrumb %} top-m{% endunless %} hidden-phone">
	<ul class="thumbnails">
		<!-- FEATURED IMAGE -->
		{% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}
		<li class="span12">
			<a class="thumbnail featured-image" data-image-id="{{ featured_image.id }}" href="#" title="{{ product.title }}">
				<img src="{{ featured_image | img_url: 'large' }}" alt="{% if featured_image.alt %}{{ featured_image.alt | escape }}{% else %}{{ product.title | escape }}{% endif %}" />
			</a>
		</li>
		<!-- PRODUCT IMAGE THUMBS -->
		{% for image in product.images %}
		{% if forloop.length > 0 %}
		<li class="span3{% cycle 'product-thumbs': ' no-left-margin', '', '', '' %}">
			<a href="{{ image | product_img_url: '1024x1024' }}" class="thumbnail fancybox" id="{{ image.id }}" rel="gallery" title="{{ product.title }}">
				<img src="{{ image | product_img_url: 'small' }}" alt="{% if product.image.alt %}{{ product.image.alt | escape }}{% else %}{{ product.title | escape }}{% endif %}" />
			</a>
		</li>
		{% endif %}
		{% endfor %}
	</ul>
</div>