{{#
    @name Posts show
    @desc The Posts show template.
#}}

<!-- /posts/show.antlers.html -->
<script type="application/ld+json">
    {
        "@context": "https://schema.org",
        "@type": "NewsArticle",
        "mainEntityOfPage": {
            "@type": "WebPage",
            "@id": "{{ permalink }}"
        },
        "headline": "{{ title }}",
        "image": "{{ config:app:url }}{{ image }}",
        "datePublished": "{{ date | format('c') }}",
        "author": {
            "@type": "Organization",
            "name": "{{ config:app:name }}",
            "url": "{{ config:app:url }}"
        },
        "publisher": {
            "@type": "Organization",
            "name": "{{ config:app:name }}"{{ if seo:organization_logo }},
            "logo": {
                "@type": "ImageObject",
                "url": "{{ config:app:url }}{{ glide:seo:organization_logo width='336' height='336' fit='contain' }}"
            }{{ /if }}
        }
    }
</script>
<main class="outer-grid" id="content">
    <div class="fluid-container grid self-start md:grid-cols-12 gap-8 lg:-mb-12">
        <header class="md:col-span-8 md:col-start-3">
            {{ partial:typography/time :content="date" class="block text-center" }}

            {{ partial:typography/h1 :content="title" class="mt-4 text-center" }}

            <figure class="aspect-[3/2] mt-4">
                {{ partial:statamic-peak-tools::components/picture :image="image" sizes="(min-width: 1280px) 1150px, (min-width: 768px) 90vw" aspect_ratio="3/2" lazy="true" cover="true" }}
            </figure>
        </header>
    </div>

    <section class="fluid-container grid grid-cols-12">
        {{ partial:typography/prose as="article" class="contents" }}
            {{ article }}
                {{ partial src="components/{type}" }}
            {{ /article }}
        {{ /partial:typography/prose }}
    </section>

    {{ collection:previous in="posts" sort="date:asc" limit="3" as="items" }}
        {{ unless no_results }}
            <section class="fluid-container grid md:grid-cols-12 gap-8">
                {{ partial:typography/h1 as="h2" content="{ trans:strings.posts_more }" class="md:col-span-12" }}

                {{ items }}
                    {{ partial:components/posts_item class="md:col-span-4" }}
                {{ /items }}
            </section>
        {{ /unless }}
    {{ /collection:previous }}
</main>
<!-- /posts/show.antlers.html -->