Website-Redesign/layouts/partials/js_paginator.html

<script>
    function renderTags(tags) {
        if (tags.length <= 0) return '';
        let res = '| <span title="tags"> </span>';
        for (let tag of tags) {
            res += `<a href="/tags/${tag}">#${tag}</a>`;
        }
        return res;
    }
    function renderImage(image) {
        if (!image) return '';
        return `<img src="${image}" />`
    }
    function renderSingleArticle(article) {
        return `
        <article class="card postlistitem {{ if .Site.Params.discreteCards }}discrete{{ end }}">
            <div>
                <h2>
                    <a href="${article.link}">${article.title}</a>
                </h2>
                <p class="date">
                <span title="Date"> </span>
                ${article.date}
                {{ if (.Site.Params.tagsInArticlePreview | default true) }}
                    ${renderTags(article.tags)}
                {{ end }}
                </p>
                {{ if .Site.Params.imageInArticlePreview }}
                    ${renderImage(article.image)}
                {{end}}
                {{ if (site.Params.articleSummary | default true) }}
                    <div class="articlePreview">
                        <p>${article.summary}</p>
                        <p><a href="${article.link}">Continue reading </a></p>
                    </div>
                {{ end }}
            </div>
            <hr />
        </article>
        `;
    }
    function renderArticles(articles) {
        let rendered = articles.map(a => renderSingleArticle(a)).join('\n');
        document.getElementById('postlist').innerHTML += rendered;
    }
</script>