<!– Featured post –> <div class=“container”> {% assign iter = “first” %} {% for post in paginator.posts %}

{% if iter == "first" %}

{% if paginator.page == 1 %}
{% assign first_page_first_post = true %}
<section class="section featured-post">
    <a href="{{ post.url }}">
    <div class="card is-shadowless">
    <h2 class="title is-size-3 is-size-5-mobile padded-multiline">
        <span>{{post.title}}
        {% unless post.subtitle == null %} - {{ post.subtitle }}{% endunless %}
        </span></h2>
    <div class="card-image">
        <figure class="image is-2by1 is-relative">
        <a href="{{ post.url }}">
            <img 
                data-src="{{ post.image.path | default: 'https://via.placeholder.com/910x455.png' | append: '?nf_resize=smartcrop&w=910&h=455'}}" 
                data-lowsrc="{{ post.image.path | default: 'https://via.placeholder.com/910x455.png' | append: '?nf_resize=smartcrop&w=100&h=50'}}" 
                alt="Image by {{page.image.author}} on {{page.image.source}}"
                class="lazyload blur-up">
        </a>
        {% assign postcontent = post.content %}{% comment  %}TODO: improve this as a include parameter{% endcomment %}
        {% capture readingtime %}{% include themes/jmblog-theme/components/reading-time.html %}{% endcapture %}
        {% if readingtime.size > 1 %}
        <span class="tag is-white is-ontop-right">{{ readingtime | strip }}</span>
        {% endif %}
        </figure>
    </div>
    <div class="card-content">

        <div class="content">
        <a href="{{ post.url }}" class="has-text-black">
            {{ post.summary }}
        </a>
        </div>
        <div class="tags">
            {% for tag in post.tags %}
            <span class="tag">#{{ tag }}</span>
            {% endfor %}
        </div>
    </div>
    </div>
    </a>
</section>

<hr>
    {% endif %}<!-- End page 1 -->

<!-- Main section -->
<section class="section">
    <div class="columns">
        <!-- Main area column -->
        <div class="column is-two-thirds">

            {% if paginator.page == 1 %}
            <h2 class="title is-3 is-uppercase">Recent Articles</h2>
            {% endif %}

            <div class="article-list">
{% endif %}<!-- End first iteration-->

                <!-- Articles -->
                {% unless first_page_first_post %}
                {% include themes/jmblog-theme/components/article_highlight.html post=post %}
                {% endunless %}

{% assign iter = null %} {% assign first_page_first_post = false %}

{% endfor %}

            </div><!-- End articles list -->

            {% include themes/jmblog-theme/components/pagination_links.html %}

        </div><!-- end left column -->

        <!-- Right side column -- Author details -->
        <div class="column">
            <h2 class="title is-3 is-uppercase">The Author</h2>
            {% include themes/jmblog-theme/components/author.html sidebar=true %}
        </div>

    </div><!-- End columns container -->

</section>

</div>