{% extends widget.get_base_template %}

{% load thumbnail %}

{% block content %}
<ul class="horizontal" style="overflow:auto;">
{% for category_file in widget.category.files %}
{% with category_file.file as file %}
	<li>
		{% if file.type == 'image' %}
		{% thumbnail file.file widget.image_geom as image %}
		<a href="{{ image.url }}" rel="{{ widget.fe_identifier }}">
		{% thumbnail file.file widget.thumb_geom crop="center" as thumb %}
		<img src="{{ thumb.url }}" alt="" />
		{% endthumbnail %}
		</a>
		{% endthumbnail %}
		{% endif %}
	</li>
{% endwith %}
{% endfor %}
</ul>
<script type="text/javascript">
$(document).ready(function() {
	$("a[rel='{{ widget.fe_identifier }}']").colorbox();
});
</script>
{% endblock %}
