{# ========================================================================== #}
{# :: Imports #}
{# ========================================================================== #}
{% import "components/icon.njk" as icon %}
{% import "components/action.njk" as action %}

{# ========================================================================== #}
{# :: Default #}
{# ========================================================================== #}
{% macro default(classes, data) %}

	<div class="bp-c-download-thumb bp-js-download-thumb {{classes}}">
		<div
			class="bp-c-download-thumb__image"
			style="background-image: url('{{data.item.preview}}')"
		>

			<div class="bp-c-download-thumb__overlay"></div>

			{{action.default("bp-c-download-thumb__fullscreen bp-c-action--white", {
				iconBefore: "fullscreen",
				text: "View image",
				overlay: {
					id: data.overlayId,
					type: "open"
				}
			})}}
		</div>

		<div class="bp-c-download-thumb__info">
			<p class="bp-c-download-thumb__name">{{data.item.name}}</p>

			<a class="bp-c-download-thumb__action" href="{{data.item.path}}">
				{{icon.default("", { name: "download" })}}
			</a>
		</div>
	</div>

{% endmacro %}