<section class="page-img-container" style="height: <%- page.imgHeight %>;">
    <%- image_tag(page.imgURL, {
        alt: page.imgAlt || "",
        width: "100%"
    }) %>
</section>

<article class="markdown-container page-container">
    <div class="article">
        <%- page.content %>
    </div>

    <section class="comment-container">
        <!-- giscus -->
        <% if (page.giscus) { %>
            <script src="<%- theme.giscus.js %>"
                data-repo="<%- theme.giscus.repo %>"
                data-repo-id="<%- theme.giscus.repoId %>"
                data-category="<%- theme.giscus.category %>"
                data-category-id="<%- theme.giscus.categoryId %>"
                data-mapping="<%- theme.giscus.mapping %>"
                data-strict="<%- theme.giscus.strict %>"
                data-reactions-enabled="<%- theme.giscus.reactionsEnabled %>"
                data-emit-metadata="<%- theme.giscus.emitMetadata %>"
                data-input-position="<%- theme.giscus.inputPosition %>"
                data-theme="<%- theme.giscus.selfTheme ? theme.giscus.theme : 'https://cdn.jsdelivr.net/gh/can-dy-jack/giscus-theme-delicate@master/index.min.css' %>"
                data-lang="<%- theme.giscus.lang %>"
                data-loading="<%- theme.giscus.loading %>"
                crossorigin="anonymous"
                async>
            </script>
        <% } %>
    </section>
</article>