{% if not S_HIDE_HEADERS %}{% INCLUDE 'overall_header.html' %}{% endif %}
{% INCLUDE 'parts/content_type.html' %}

{% INCLUDECSS '@blitze_content/assets/view/tiles/content_tiles.min.css' %}
{% INCLUDEJS '@blitze_content/vendor/jquery-ias/jquery-ias.min.js' %}
{% INCLUDEJS '@blitze_content/vendor/imagesloaded/imagesloaded.pkgd.min.js' %}
{% INCLUDEJS '@blitze_content/vendor/masonry-layout/dist/masonry.pkgd.min.js' %}
{% INCLUDEJS '@blitze_content/assets/view/tiles/content_tiles.min.js' %}

{%- set numTopics = topicrow|length -%}
{% if numTopics %}
	{%- set topicTypeRatios = [0, 0.5, 0.75, 1] -%}
	{%- set colSize = 12 / content_view_settings.tiles_per_row|default(3) -%}

	<div id="sitemaker-content-tiles" class="grid tiles-container" data-offset="{{ content_view_settings.offset|default(0) }}" data-load-more-lang="{{ lang('LOAD_MORE') }}" data-no-more-lang="{{ lang('NO_MORE_TOPICS') }}">
		<div class="{{ 'col-' ~ colSize ~ '_sm-12' }} tile"></div>
		{% for topicrow in loops.topicrow %}
			{%- set ratio = topicTypeRatios[topicrow.S_TOPIC_TYPE] -%}
		<div class="grid-item {{ 'col-' ~ ((ratio) ? colSize * (ratio * colSize)|round(0, 'floor') : colSize) ~ '_sm-12' }} tile sm-block-spacing">
			<div class="panel post">
				<div class="inner">
					<div class="postbody sm-full-width">
					{% if not topicrow.CUSTOM_DISPLAY %}
						{% INCLUDE 'parts/summary_title.html' %}
					{% endif %}
						<div class="content">
						{% if topicrow.CUSTOM_DISPLAY %}
							{{ topicrow.CUSTOM_DISPLAY }}
						{% else %}
							{{ topicrow.FIELDS.body|join }}
							<p>&nbsp;</p>
							<div class="align-right sm-badge grayscale-color">
								<span class="info"><a href="{{ topicrow.TOPIC_URL }}">{{ lang('READ_MORE') }} ></a></span>
							</div>
						{% endif %}
						</div>
						{% if topicrow.FIELDS.footer|length && not topicrow.FIELDS.CUSTOM_DISPLAY %}
						<div class="sm-content-footer">{{ topicrow.FIELDS.footer|join(' | ') }}</div>
						{% endif %}
					</div>
				</div>
			</div>
		</div>
		{% endfor %}
	</div>

	{% if loops.pagination|length or TOTAL_POSTS %}
	<div id="pagination" class="pagination">
		{% if loops.pagination|length %}
		<ul style="width: 100%">
		{% for pagination in loops.pagination %}
			{% if pagination.S_IS_PREV %}
			<li class="arrow previous left-box"><a class="button button-icon-only" href="{pagination.PAGE_URL}" rel="prev" role="button"><i class="icon fa-chevron-{S_CONTENT_FLOW_BEGIN} fa-fw" aria-hidden="true"></i><span class="sr-only1">{L_PREVIOUS}</span></a></li>
			{% endif %}
			{% if pagination.S_IS_NEXT %}
			<li class="arrow next right-box"><a class="button button-icon-only" href="{pagination.PAGE_URL}" rel="next" role="button"><i class="icon fa-chevron-{S_CONTENT_FLOW_END} fa-fw" aria-hidden="true"></i><span class="sr-only1">{L_NEXT}</span></a></li>
			{% endif %}
		{% endfor %}
		</ul>
		{% endif %}
	</div>
	<div class="clear"></div>
	{% endif %}
{% else %}
<div class="panel post sm-block-spacing">
	<div class="inner">
		{{ lang('CONTENT_NO_TOPICS') }}
	</div>
</div>
{% endif %}

{% if not S_HIDE_HEADERS %}{% INCLUDE 'overall_footer.html' %}{% endif %}