{% macro render_pkgtile(package, show_author) -%}
	<li class="packagetile flex-fill"><a href="{{ package.getDetailsURL() }}"
		style="background-image: url({{ package.getThumbnailURL() or '/static/placeholder.png' }});">
		<div class="packagegridscrub"></div>
		<div class="packagegridinfo">
			<h3>
				{{ package.title }}

				{% if show_author %}
					by {{ package.author.display_name }}
				{% endif %}
			</h3>

			<p>
				{{ package.shortDesc }}
			</p>


			{% if not package.license.is_foss and not package.media_license.is_foss and package.type != package.type.TXP  %}
				<p style="color:#f33;">
					<b>Warning:</b> Non-free code and media.
				</p>
			{% elif not package.license.is_foss and package.type != package.type.TXP %}
				<p style="color:#f33;">
					<b>Warning:</b> Non-free code.
				</p>
			{% elif not package.media_license.is_foss %}
				<p style="color:#f33;">
					<b>Warning:</b> Non-free media.
				</p>
			{% endif %}
		</div>
	</a></li>
{% endmacro %}

{% macro render_pkggrid(packages, show_author=True) -%}
	<ul class="d-flex p-0 flex-row flex-wrap justify-content-start align-content-start ">
		{% for p in packages %}
			{{ render_pkgtile(p, show_author) }}
		{% else %}
			<li><i>No packages available</i></ul>
		{% endfor %}
		{% set amt=packages|length %}
		{% if amt > 4 %}
			{% set amt=4 %}
		{% endif %}
		{% for i in range(amt) %}
			<li class="packagetile flex-fill"></li>
		{% endfor %}
	</ul>
{% endmacro %}