layout: default


<div style=“display: flex; flex-direction: column;”>

<div class="content-header" style="justify-content: center;">
    <span class="content-title">{{ site.title }}</span>
</div>
<div class="main-primary-container">
    {%- if site.posts.size > 0 -%}
    <div class="posts-container">
        {%- for post in site.posts -%}
        {%- assign date_format = site.date_format | default: "%b %-d, %Y" -%}
        <a class="post-item" href="{{ post.url | relative_url }}">
            <article class="post-inner">
                <div class="post-thumbnail-container">
                    <img class="post-thumbnail"
                        src="{{ post.thumbnail | relative_url | default: site.global.post.default_thumbnail }}">
                </div>
                <div class="post-inner-right">
                    <div class="post-details">
                        <span class="post-title">{{ post.title }}</span>
                        <span class="post-date">{{ post.date | date: date_format }}</span>
                        <span class="post-description">{{ post.description }}</span>
                    </div>
                    <div class="post-decorations">
                        <div class="post-decoration-icon">{% include tw_reply_icon.html %}</div>
                        <div class="post-decoration-icon">{% include tw_retweet_icon.html %}</div>
                        <div class="post-decoration-icon">{% include tw_like_icon.html %}</div>
                        <div class="post-decoration-icon">{% include tw_share_icon.html %}</div>
                    </div>
                </div>
            </article>
        </a>
        {%- endfor -%}
    </div>
    {%- else -%}
    <h1>Looks like there aren't any posts yet</h1>
    {%- endif -%}
</div>

</div>