{# ========================================================================== #}
{# :: Content #}
{# ========================================================================== #}
{#
	The content section of the page which contains the main title and the
	different content blocks.
#}

{# ========================================================================== #}
{# :: Imports #}
{# ========================================================================== #}
{% import "components/wysiwyg.njk" as wysiwyg %}
{% import "components/gallery.njk" as gallery %}
{% import "components/fallback.njk" as fallback %}
{% import "components/embed.njk" as embed %}

{# ========================================================================== #}
{# :: Partial #}
{# ========================================================================== #}
{% if ROUTEDATA.DETAIL %}

	<section class="bp-l-section">
		<header class="bp-l-section__header">
			<h1 class="bp-l-section__title u-h1">{{ROUTEDATA.DETAIL.title}}</h1>
		</header>

		{% for item in ROUTEDATA.DETAIL.body %}
			<div class="bp-l-section__content">
				{% if item.type === "text" %}

					{{wysiwyg.default("", {
						content: item.data.content
					})}}

				{% elseif item.type === "gallery" %}

					{{gallery.default("", {
						grid: item.data.grid,
						items: item.data.images
					})}}

				{% elseif item.type === "colors" %}

					{% include "partials/api/colors.njk" %}

				{% elseif item.type === "assets" %}

					{% include "partials/api/assets.njk" %}

				{% elseif item.type === "media" %}

					{% include "partials/api/media.njk" %}

				{% elseif item.type === "embed" %}

					{{embed.default("", item.data)}}

				{% endif %}
			</div>
		{% endfor %}
	</section>

{% else %}

	{{fallback.default("", {
		text:
			"There was no API linked to this brandplatform. No data can be
			shown, try again next time."
	})}}

{% endif %}