{{ define "main" }}
{{ $page := . }}

{{ $height := $page.Params.paige.home.image.height | default "20rem" }}
{{ $stretch := $page.Params.paige.home.image.stretch }}
{{ $width := $page.Params.paige.home.image.width }}

<article class="paige-article paige-home">
    <div class="align-items-center d-flex flex-column mb-0">
        {{ partial "paige/metadata.html" $page }}

        {{ if or $page.Params.paige.home.image.url $page.Params.paige.home.greeting $page.Params.paige.home.blurb }}
            <div>
                {{ if $page.Params.paige.home.image.url }}
                    {{ $class := cond ($stretch | not) "mw-100 rounded-4 shadow" "rounded-4 shadow" }}
                    {{ $style := cond ($stretch | not) (printf "height: %s; width: %s" $height ($width | default "auto")) (printf "height: %s; object-fit: cover; width: %s" $height ($width | default "100%")) }}

                    <p {{ if or (not $stretch) $width }} class="text-center" {{ end }}>
                        {{ partial "paige/img.html" (dict
                            "alt" $page.Params.paige.home.image.alt
                            "class" $class
                            "fetchpriority" "high"
                            "loading" "eager"
                            "page" $page
                            "src" $page.Params.paige.home.image.url
                            "style" $style
                        ) }}
                    </p>
                {{ end }}

                {{ with $page.Params.paige.home.greeting }}
                    <p class="display-5 fw-bold h2 text-center">{{ . | markdownify }}</p>
                {{ end }}

                {{ with $page.Params.paige.home.blurb }}
                    <div class="container-fluid">
                        <div class="justify-content-center row">
                            <div class="col col-auto col-lg-7 px-0">
                                <p class="lead text-center">{{ . | markdownify }}</p>
                            </div>
                        </div>
                    </div>
                {{ end }}
            </div>
        {{ end }}

        {{ partial "paige/toc.html" $page }}
        {{ partial "paige/alert.html" $page }}
        {{ partial "paige/content.html" $page }}

        {{ if $page.Param "paige.social" }}
            <p class="display-6 text-center">{{ partial "paige/social.html" $page }}</p>
        {{ end }}
    </div>
</article>
{{ end }}
